Ver código fonte

Fix bad syntax highlighting color schemes (#630)

Some pygment color schemes (like `bw`, which we use as default in the
exampleSite) do not set a foreground color explicitly, which makes those
themes look bad/illegible when using the dark mode of hugo-coder. Most
such themes are light themes (it seems after a quick research), which
explains this phenomenon.

This commit adds a fix for such color schemes by setting the default
foreground color to the one used in the light hugo-coder colorscheme.
It is overridden by proper syntax highlighting schemes.
Alphonse Mariya 4 anos atrás
pai
commit
29a7a942b7

+ 7 - 0
assets/scss/_base_dark.scss

@@ -38,6 +38,13 @@
     color: $fg-color-dark;
   }
 
+  // fix color schemes which do not explicitly set fg-color
+  .highlight {
+    pre {
+      color: $fg-color;
+    }
+  }
+
   pre {
     code {
       background-color: inherit;

+ 35 - 1
exampleSite/resources/_gen/assets/scss/scss/coder-dark.scss_9e20ccd2d8034c8e0fd83b11fb6e2bd5.content

@@ -40,14 +40,31 @@ body.colorscheme-dark {
   body.colorscheme-dark code {
     background-color: #424242;
     color: #dadada; }
+  body.colorscheme-dark .highlight pre {
+    color: #212121; }
   body.colorscheme-dark pre code {
     background-color: inherit;
     color: inherit; }
   body.colorscheme-dark blockquote {
     border-left: 2px solid #424242; }
+  body.colorscheme-dark th,
+  body.colorscheme-dark td {
+    padding: 1.6rem; }
+  body.colorscheme-dark table {
+    border-collapse: collapse; }
   body.colorscheme-dark table td,
   body.colorscheme-dark table th {
     border: 2px solid #dadada; }
+  body.colorscheme-dark table tr:first-child th {
+    border-top: 0; }
+  body.colorscheme-dark table tr:last-child td {
+    border-bottom: 0; }
+  body.colorscheme-dark table tr td:first-child,
+  body.colorscheme-dark table tr th:first-child {
+    border-left: 0; }
+  body.colorscheme-dark table tr td:last-child,
+  body.colorscheme-dark table tr th:last-child {
+    border-right: 0; }
 
 @media (prefers-color-scheme: dark) {
   body.colorscheme-auto {
@@ -92,14 +109,31 @@ body.colorscheme-dark {
     body.colorscheme-auto code {
       background-color: #424242;
       color: #dadada; }
+    body.colorscheme-auto .highlight pre {
+      color: #212121; }
     body.colorscheme-auto pre code {
       background-color: inherit;
       color: inherit; }
     body.colorscheme-auto blockquote {
       border-left: 2px solid #424242; }
+    body.colorscheme-auto th,
+    body.colorscheme-auto td {
+      padding: 1.6rem; }
+    body.colorscheme-auto table {
+      border-collapse: collapse; }
     body.colorscheme-auto table td,
     body.colorscheme-auto table th {
-      border: 2px solid #dadada; } }
+      border: 2px solid #dadada; }
+    body.colorscheme-auto table tr:first-child th {
+      border-top: 0; }
+    body.colorscheme-auto table tr:last-child td {
+      border-bottom: 0; }
+    body.colorscheme-auto table tr td:first-child,
+    body.colorscheme-auto table tr th:first-child {
+      border-left: 0; }
+    body.colorscheme-auto table tr td:last-child,
+    body.colorscheme-auto table tr th:last-child {
+      border-right: 0; } }
 
 body.colorscheme-dark .content .post .tags .tag {
   background-color: #424242; }

Diferenças do arquivo suprimidas por serem muito extensas
+ 0 - 0
resources/_gen/assets/scss/scss/coder-dark.scss_1fcd9040f1144c65015c77e7b93bc5ac.content


+ 1 - 1
resources/_gen/assets/scss/scss/coder-dark.scss_1fcd9040f1144c65015c77e7b93bc5ac.json

@@ -1 +1 @@
-{"Target":"css/coder-dark.min.ccbbada2e264e4fdbf9b2181cccc2cdb289a63dc9520a1e96ac2b9a45778df29.css","MediaType":"text/css","Data":{"Integrity":"sha256-zLutouJk5P2/myGBzMws2yiaY9yVIKHpasK5pFd43yk="}}
+{"Target":"css/coder-dark.min.002ee2378e14c7a68f1f0a53d9694ed252090987c4e768023fac694a4fc5f793.css","MediaType":"text/css","Data":{"Integrity":"sha256-AC7iN44Ux6aPHwpT2WlO0lIJCYfE52gCP6xpSk/F95M="}}

+ 35 - 1
resources/_gen/assets/scss/scss/coder-dark.scss_9e20ccd2d8034c8e0fd83b11fb6e2bd5.content

@@ -40,14 +40,31 @@ body.colorscheme-dark {
   body.colorscheme-dark code {
     background-color: #424242;
     color: #dadada; }
+  body.colorscheme-dark .highlight pre {
+    color: #212121; }
   body.colorscheme-dark pre code {
     background-color: inherit;
     color: inherit; }
   body.colorscheme-dark blockquote {
     border-left: 2px solid #424242; }
+  body.colorscheme-dark th,
+  body.colorscheme-dark td {
+    padding: 1.6rem; }
+  body.colorscheme-dark table {
+    border-collapse: collapse; }
   body.colorscheme-dark table td,
   body.colorscheme-dark table th {
     border: 2px solid #dadada; }
+  body.colorscheme-dark table tr:first-child th {
+    border-top: 0; }
+  body.colorscheme-dark table tr:last-child td {
+    border-bottom: 0; }
+  body.colorscheme-dark table tr td:first-child,
+  body.colorscheme-dark table tr th:first-child {
+    border-left: 0; }
+  body.colorscheme-dark table tr td:last-child,
+  body.colorscheme-dark table tr th:last-child {
+    border-right: 0; }
 
 @media (prefers-color-scheme: dark) {
   body.colorscheme-auto {
@@ -92,14 +109,31 @@ body.colorscheme-dark {
     body.colorscheme-auto code {
       background-color: #424242;
       color: #dadada; }
+    body.colorscheme-auto .highlight pre {
+      color: #212121; }
     body.colorscheme-auto pre code {
       background-color: inherit;
       color: inherit; }
     body.colorscheme-auto blockquote {
       border-left: 2px solid #424242; }
+    body.colorscheme-auto th,
+    body.colorscheme-auto td {
+      padding: 1.6rem; }
+    body.colorscheme-auto table {
+      border-collapse: collapse; }
     body.colorscheme-auto table td,
     body.colorscheme-auto table th {
-      border: 2px solid #dadada; } }
+      border: 2px solid #dadada; }
+    body.colorscheme-auto table tr:first-child th {
+      border-top: 0; }
+    body.colorscheme-auto table tr:last-child td {
+      border-bottom: 0; }
+    body.colorscheme-auto table tr td:first-child,
+    body.colorscheme-auto table tr th:first-child {
+      border-left: 0; }
+    body.colorscheme-auto table tr td:last-child,
+    body.colorscheme-auto table tr th:last-child {
+      border-right: 0; } }
 
 body.colorscheme-dark .content .post .tags .tag {
   background-color: #424242; }

Alguns arquivos não foram mostrados porque muitos arquivos mudaram nesse diff