pomp/pompy.dev
1
0
Fork 0
Code Issues 8 Pull requests Activity Actions

katex CSS fix

Browse source 
- prevent katex formula overflowing on smaller displays
This commit is contained in:
Kim, Jimin 2021-12-20 08:52:41 +09:00
parent 903681b424
commit 70b226a082
1 changed files with 9 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

9
source/src/styles/globalStyle.tsx
View file

@ -193,6 +193,14 @@ const markCSS = css`
} }
` `
const katexCSS = css`
// prevent overflowing on small displays
.katex-html {
overflow-x: scroll;
padding: 0.5rem;
}
`
// Theme that will be used throughout the website // Theme that will be used throughout the website
// wrapping it using css because prettier extension does not work well with styled-components // wrapping it using css because prettier extension does not work well with styled-components
// https://github.com/styled-components/vscode-styled-components/issues/175 // https://github.com/styled-components/vscode-styled-components/issues/175
@ -204,6 +212,7 @@ const globalStyle = css`
${blockquoteCSS} ${blockquoteCSS}
${headerCSS} ${headerCSS}
${markCSS} ${markCSS}
${katexCSS}
body { body {
overflow-x: hidden; overflow-x: hidden;