adjust codeblock style

semanticdata · Oct 16, 2024 · 58b8ff3 · 58b8ff3
1 parent 7de0ba5
commit 58b8ff3
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 49 deletions.
diff --git a/sass/_code.scss b/sass/_code.scss
@@ -9,69 +9,45 @@ code {
     background-color: variables.$grey;
     border-radius: 3px;
     color: variables.$code-color;
-    font-size: 85%;
+    // font-size: 85%;
     padding: 0.25em 0.5em;
 }
 
 pre {
     margin: 0 0 1rem;
     overflow: auto;
+
+    padding: 0.25rem 0.5rem;
+    overflow: auto;
+    border-radius: 5px;
 }
 
 pre code {
     background-color: transparent;
     color: inherit;
-    font-size: 100%;
     padding: 0;
-    font: variables.$code-font;
-}
-
-.highlight {
-    background-color: variables.$grey;
-    border-radius: 3px;
-    line-height: 1.4;
-    margin: 0 0 1rem;
-    padding: 1rem;
-
-    pre {
-        margin-bottom: 0;
-        overflow-x: auto;
-    }
-
-    .lineno {
-        color: variables.$default-tint;
-        display: inline-block; // Ensures the null space also isn't selectable
-        padding: 0 0.75rem 0 0.25rem;
-        // Make sure numbers aren't selectable
-        -webkit-user-select: none;
-        -moz-user-select: none;
-        user-select: none;
-    }
+    font: variables.$monospaced;
+    border: 0;
+    line-height: 1;
 }
 
-pre {
-    padding: 1rem;
-    overflow: auto;
-}
-/* The line numbers already provide some kind of left/right padding */
 pre[data-linenos] {
     padding: 1rem 0;
     padding: 0;
 }
 pre table td {
     padding: 0 0.25rem;
     color: white;
-    // border: 0;
+    border: 0;
+    border-right: 1px solid variables.$default-tint;
 }
 /* The line number cells */
 pre table td:nth-of-type(1) {
     text-align: center;
     user-select: none;
 }
 pre mark {
-    /* If you want your highlights to take the full width */
     display: block;
-    /* The default background colour of a mark is bright yellow */
     background-color: rgba(254, 252, 232, 0.9);
 }
 pre table {
@@ -80,6 +56,25 @@ pre table {
     border: 0;
 }
 
-pre code {
-    border: 0;
+.highlight {
+    background-color: variables.$grey;
+    border-radius: 3px;
+    margin: 0 0 1rem;
+    // line-height: 1.2;
+    // padding: 1rem;
+
+    pre {
+        margin-bottom: 0;
+        overflow-x: auto;
+    }
+
+    .lineno {
+        color: variables.$default-tint;
+        display: inline-block; // Ensures the null space also isn't selectable
+        padding: 0 0.75rem 0 0.25rem;
+        // Make sure numbers aren't selectable
+        -webkit-user-select: none;
+        -moz-user-select: none;
+        user-select: none;
+    }
 }
diff --git a/sass/_variables.scss b/sass/_variables.scss
@@ -1,20 +1,7 @@
 $serif-primary: "Bitter", "Inconsolata";
 $serif-secondary: "Bitter", "Inconsolata";
 $sans-serif: "Bitter", "Inconsolata";
-// $serif-primary: "Libre Baskerville", "Times New Roman", Times,
-//   "Source Serif Pro", "Helvetica Neue", Helvetica, Arial, "Hiragino Sans GB",
-//   "Hiragino Sans GB W3", "Microsoft YaHei UI", "Microsoft YaHei", "微软雅黑",
-//   "思源黑体", SYHT, "WenQuanYi Micro Hei", serif !default;
-// $serif-secondary: Palatino, "Palatino LT STD", "Palatino Linotype",
-//   "Book Antiqua", "Georgia", serif !default;
-// $sans-serif: "Helvetica Neue", "Segoe UI", Helvetica, Arial, sans-serif !default;
 $monospaced: Menlo, Monaco, monospace !default;
-$code-font:
-  400 1.125rem/1.75 SFMono-Regular,
-  Consolas,
-  Liberation Mono,
-  Menlo,
-  monospace;
 
 @mixin box-sizing($type: border-box) {
   -webkit-box-sizing: $type;