All files / client/src/views/program-item/components ProgramItemButtonGroup.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
 
 
 
 
 
 
 
 
 
1x
 
 
 
1x
 
 
 
1075x
 
 
 
 
import { ReactElement, ReactNode } from "react";
import styled from "styled-components";
import { ButtonGroup } from "client/components/ButtonGroup";
import { programItemContentMargin } from "client/views/my-program-items/components/shared";
 
interface Props {
  children: ReactNode;
}
 
// Centered action row in a program item card
export const ProgramItemButtonGroup = ({ children }: Props): ReactElement => (
  <Container>{children}</Container>
);
 
const Container = styled(ButtonGroup)`
  ${programItemContentMargin};
  justify-content: center;
 
  @media (max-width: ${(props) => props.theme.breakpointDesktop}) {
    flex-direction: column;
  }
`;