feat(#62): adjust code block styles to accomodate line highlighting

meganesu · Jun 19, 2024 · 41c75aa · 41c75aa
1 parent aa0fdbd
commit 41c75aa
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/src/components/code-block/index.js b/src/components/code-block/index.js
@@ -10,6 +10,7 @@ import {
   preWrapper as preWrapperStyles,
   pre as preStyles,
   code as codeStyles,
+  highlight as highlightStyles,
 } from "./styles.module.css"
 
 const CodeBlock = (props) => {

diff --git a/src/components/code-block/styles.module.css b/src/components/code-block/styles.module.css
@@ -22,13 +22,17 @@
 
 .pre-wrapper {
   overflow: auto;
-  padding-right: 1rem;
 }
 
 .pre {
-  margin-left: 1rem;
+  min-width: fit-content;
 }
 
 .code {
   display: block;
+  padding: 0rem 1rem;
 }
+
+.highlight {
+  background-color: rgba(84, 146, 255, 0.25);
+}