diff --git a/components/indicators/IndicatorHighlightsList.tsx b/components/indicators/IndicatorHighlightsList.tsx index 5a490cf6..c7367c41 100644 --- a/components/indicators/IndicatorHighlightsList.tsx +++ b/components/indicators/IndicatorHighlightsList.tsx @@ -41,8 +41,16 @@ export const GET_INDICATOR_HIGHLIGHTS = gql` const ListHeader = styled(Col)` h2 { + text-align: center; + padding: ${(props) => props.theme.spaces.s100}; + border-radius: ${(props) => props.theme.cardBorderRadius}; + background-color: ${(props) => props.theme.themeColors.white}; + color: ${(props) => props.theme.headingsColor}; + margin-bottom: ${(props) => props.theme.spaces.s300}; + font-size: ${(props) => props.theme.fontSizeLg}; + + @media (min-width: ${(props) => props.theme.breakpointMd}) { font-size: ${(props) => props.theme.fontSizeXl}; - margin-bottom: ${(props) => props.theme.spaces.s400}; } `;