diff --git a/web/src/pages/Courts/CourtDetails/Description.tsx b/web/src/pages/Courts/CourtDetails/Description.tsx index f9bb221c6..6cae460bc 100644 --- a/web/src/pages/Courts/CourtDetails/Description.tsx +++ b/web/src/pages/Courts/CourtDetails/Description.tsx @@ -17,32 +17,36 @@ const Container = styled.div` const TextContainer = styled.div` width: 100%; padding: 12px 0; +`; +const StyledReactMarkdown = styled(ReactMarkdown)` p { word-break: break-word; } - li { - line-height: 1.5em; - margin-top: 0.5em; + ul, + ol { + li + li { + margin-top: 8px; + } } h1 { margin: 16px 0 16px 0; - font-size: 24px; - line-height: 32px; + font-size: 20px; + line-height: 26px; } h2 { margin: 16px 0 16px 0; font-size: 20px; - line-height: 24px; + line-height: 26px; } h3 { margin: 16px 0 16px 0; font-size: 18px; - line-height: 20px; + line-height: 24px; } a { @@ -128,6 +132,6 @@ const Description: React.FC = () => { }; const formatMarkdown = (markdown?: string) => - markdown ? {markdown.replace(/\n/g, " \n")} : ; + markdown ? {markdown.replace(/\n/g, " \n")} : ; export default Description; diff --git a/web/src/styles/global-style.ts b/web/src/styles/global-style.ts index fe8cba478..94edd40d4 100644 --- a/web/src/styles/global-style.ts +++ b/web/src/styles/global-style.ts @@ -46,7 +46,7 @@ export const GlobalStyle = createGlobalStyle` h2 { margin: 0 0 16px 0; - font-weight: 600; + font-weight: 400; font-size: 24px; line-height: 32px; color: ${({ theme }) => theme.primaryText}; @@ -93,7 +93,7 @@ export const GlobalStyle = createGlobalStyle` color: ${({ theme }) => theme.primaryBlue}; transition: color 0.1s; } - + hr { opacity: 1; border: 1px solid ${({ theme }) => theme.stroke}; @@ -102,12 +102,14 @@ export const GlobalStyle = createGlobalStyle` svg, img { display: inline-block; vertical-align: middle; - visibility: visible; - + visibility: visible; } ul, ol { li { + font-weight: 400; + font-size: 16px; + line-height: 24px; color: ${({ theme }) => theme.primaryText}; } }