Fix issue with code block title in light themes and adjust result border

Author: facelessuser

docs/src/scss/extensions/_highlight.scss

@@ -82,6 +82,10 @@
     /* Needed for tab preserving mode */
     tab-size: 8;
 
+    + .result {
+      border-width: px2rem(2px);
+    }
+
     /* `pymdownx-inline` mode */
     [data-linenos] {
 
@@ -125,7 +129,7 @@
     padding: px2em(8px) px2em(16px, 13.6px) px2em(8px) px2em(40px, 13.6px);
     font-weight: 700;
     font-size: px2rem(13.6px);
-    background-color: var(--md-default-bg-color--ultra-dark);
+    background-color: var(--md-code-title-bg-color);
     border-top-left-radius: px2rem(2px);
     border-top-right-radius: px2rem(2px);
 

docs/src/scss/palette/_colors.scss

@@ -5,6 +5,7 @@
   --md-code-link-bg-color: hsla(0, 0%, 96%, 1);
   --md-code-link-accent-bg-color: var(--md-code-link-bg-color);
   --md-default-bg-color--trans: rgb(100%, 100%, 100%, 0);
+  --md-code-title-bg-color: var(--md-code-bg-color);
 
   --md-code-special-bg-color: #{darken(hsl(0, 0%, 96%), 5%)};
   --md-code-alternate-bg-color: var(--md-code-bg-color);
@@ -61,6 +62,12 @@
     --md-default-bg-color--lightest:     #{transparentize($drac-default-bg, 0.88)};
     --md-default-bg-color--trans:        #{transparentize($drac-default-bg, 1)};
 
+    // Dark specific colors
+    --md-default-bg-color--dark:         #{darken($drac-default-bg, 3%)};
+    --md-default-bg-color--darker:       #{darken($drac-default-bg, 6%)};
+    --md-default-bg-color--darkest:      #{darken($drac-default-bg, 9%)};
+    --md-default-bg-color--ultra-dark:   #{darken($drac-default-bg, 15%)};
+
     // General text
     --md-text-color: var(--md-default-fg-color);
     --md-typeset-color: var(--md-default-fg-color);
@@ -71,6 +78,7 @@
     // Code colors
     --md-code-fg-color: #{$drac-fg};
     --md-code-bg-color: #{$drac-bg};
+    --md-code-title-bg-color: var(--md-default-bg-color--ultra-dark);
     --md-code-inline-bg-color: #{lighten($drac-bg, 5%)};
     --md-code-hl-operator-color: #{$drac-pink};
     --md-code-hl-punctuation-color: #{$drac-fg};
@@ -117,12 +125,6 @@
     --md-typeset-kbd-border-color: var(--md-default-bg-color--ultra-dark);
     --md-typeset-kbd-accent-color: var(--md-default-fg-color--lighter);
   }
-
-  // Dark specific colors
-  --md-default-bg-color--dark:         #{darken($drac-default-bg, 3%)};
-  --md-default-bg-color--darker:       #{darken($drac-default-bg, 6%)};
-  --md-default-bg-color--darkest:      #{darken($drac-default-bg, 9%)};
-  --md-default-bg-color--ultra-dark:   #{darken($drac-default-bg, 15%)};
 }
 
 // ----------------------------------------------------------------------------

docs/theme/assets/pymdownx-extras/extra-34c51d7bc1.css

@@ -163,7 +163,7 @@ extra:
       link: https://discord.gg/TWs8Tgr
 extra_css:
   # - https://cdn.jsdelivr.net/npm/katex@0.13.18/dist/katex.min.css
-  - assets/pymdownx-extras/extra-58cc14bf7d.css
+  - assets/pymdownx-extras/extra-34c51d7bc1.css
 extra_javascript:
   - https://unpkg.com/mermaid@9.1.7/dist/mermaid.min.js
   # - https://cdn.jsdelivr.net/npm/katex@0.13.18/dist/katex.min.js