All files / client/src/views/my-program-items/components shared.tsx

100% Statements 18/18
100% Branches 0/0
100% Functions 6/6
100% Lines 18/18

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77        1x             1x               1x   39x     1x 39x           1x           1x 17x           1x       1x     11x           1x   705x     1x 690x       1x       1x          
import styled from "styled-components";
import { ErrorMessage } from "client/components/ErrorMessage";
import { TertiaryButton } from "client/components/TertiaryButton";
 
export const MyProgramListItem = styled.li`
  align-items: center;
  justify-content: left;
  margin-bottom: 8px;
  list-style: none;
`;
 
export const MyProgramList = styled.ul`
  margin-left: 16px;
 
  li:first-child {
    margin-top: -12px;
  }
`;
 
export const MyProgramTime = styled.h2`
  margin: 20px 0 0 0;
  font-size: ${(props) => props.theme.fontSizeNormal};
`;
 
export const MyProgramGameTitle = styled.h3`
  font-size: ${(props) => props.theme.fontSizeNormal};
  font-weight: normal;
  margin-top: 24px;
  margin-bottom: 4px;
`;
 
export const MyProgramButtonContainer = styled.div`
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
`;
 
export const MyProgramButtonContainerMobile = styled(MyProgramButtonContainer)`
  @media (max-width: ${(props) => props.theme.breakpointPhone}) {
    flex-direction: column;
    align-items: flex-start;
  }
`;
 
export const MyProgramErrorMessage = styled(ErrorMessage)`
  margin: 4px 0 8px 0;
`;
 
export const MyProgramCancelSignupFormContainer = styled.div`
  display: flex;
 
  @media (max-width: ${(props) => props.theme.breakpointPhone}) {
    flex-direction: column;
    margin-left: -16px;
  }
`;
 
export const MyProgramHeader = styled.h1`
  margin: 0 0 -8px 0;
  font-size: ${(props) => props.theme.fontSizeLarge};
`;
 
export const MyProgramSecondaryText = styled.p`
  color: ${(props) => props.theme.textSecondary};
  margin-bottom: 0;
`;
 
export const ShowAllButton = styled(TertiaryButton)`
  width: max-content;
`;
 
export const EmptyContentContainer = styled.div`
  display: flex;
  flex-direction: column;
  row-gap: 8px;
`;