diff --git a/src/styles/prism.ts b/src/styles/prism.ts index 30af143e..3ec581a0 100644 --- a/src/styles/prism.ts +++ b/src/styles/prism.ts @@ -70,16 +70,16 @@ const prismStyles = css` /* Overrides */ --prism-scheme: dark; - --prism-foreground: #ffa657; + --prism-foreground: #a5d6ff; --prism-background: #1a202c; --prism-comment: #7285b7; --prism-string: #a5d6ff; --prism-literal: #429988; - --prism-keyword: #ff7b72; + --prism-keyword: #5fb6ff; --prism-function: #79c0ff; --prism-function-variable: #d2a8ff; --prism-deleted: #a14f55; - --prism-class: #7ee787; + --prism-class: #b794f4; --prism-builtin: #c9d1d9; --prism-property: #79c0ff; --prism-parameter: #c9d1d9; @@ -88,9 +88,9 @@ const prismStyles = css` --prism-decorator: #bd8f8f; --prism-number: #6394bf; --prism-boolean: #1c6b48; - --prism-variable: #c2b36e; + --prism-variable: #4299e1; --prism-regex: #ab5e3f; - --prism-json-property: #6b8b9e; + --prism-json-property: #5fb6ff; --prism-line-number: #888888; --prism-line-number-gutter: #eeeeee; --prism-line-highlight-background: #444444; @@ -338,7 +338,7 @@ const prismStyles = css` #181924 ); /* Set highlight bg color */ border-left-width: 2px; - border-left-color: rgb(255 166 87); /* Set highlight accent border color */ + border-left-color: #b794f4; /* Set highlight accent border color */ } .line-number::before { @@ -380,14 +380,15 @@ const prismStyles = css` .rehype-code-title { margin: ${theme.space[6]} 0 0; - padding: ${theme.space[2]} ${theme.space[4]}; + padding: ${theme.space[4]} ${theme.space[6]}; font-family: ${theme.fonts.mono}; background: ${theme.colors.gray[200]}; color: ${theme.colors.gray[800]}; border-top-left-radius: ${theme.radii.sm}; border-top-right-radius: ${theme.radii.sm}; + border-width: 1px; + border-bottom: 0; font-size: 0.8rem; - font-weight: 600; width: 100%; + pre[class*="language-"] { @@ -403,8 +404,9 @@ const prismStyles = css` } .rehype-code-title { - background: ${theme.colors.gray[700]}; + background: ${theme.colors.gray[900]}; color: ${theme.colors.gray[100]}; + border-color: ${theme.colors.gray[700]}; } :not(pre) > code {