Improve the color of prompts

_sass/addon/commons.scss

@@ -3,35 +3,29 @@
 */
 @import url('https://fonts.googleapis.com/css2?family=Lato&family=Source+Sans+Pro:wght@400;600;900&display=swap');
 
-@mixin mode-toggle($dark-mode: false) {
-  @if $dark-mode {
-    @include dark-scheme;
-  } @else {
-    @include light-scheme;
-  }
-}
+html {
+  @media (prefers-color-scheme: light) {
+    &:not([data-mode]),
+    [data-mode=light] {
+      @include light-scheme;
+    }
 
-html:not([data-mode]),
-html[data-mode=light] {
-  @include mode-toggle();
-}
-
-html[data-mode=dark] {
-  @include mode-toggle(true);
-}
-
-@media (prefers-color-scheme: dark) {
-  html:not([data-mode]),
-  html[data-mode=dark] {
-    @include mode-toggle(true);
+    &[data-mode=dark] {
+      @include dark-scheme;
+    }
   }
 
-  html[data-mode=light] {
-    @include mode-toggle();
-  }
-}
+  @media (prefers-color-scheme: dark) {
+    &:not([data-mode]),
+    &[data-mode=dark] {
+      @include dark-scheme;
+    }
+
+    &[data-mode=light] {
+      @include light-scheme;
+    }
+  }
 
-:root {
   font-size: 16px;
 }
 
@@ -109,10 +103,11 @@ blockquote {
     display: flex;
     border-left: 0;
     border-radius: 6px;
-    padding: 0.75rem 1rem;
+    padding: 0.75rem 1.2rem;
+    color: var(--prompt-text-color);
 
     &::before {
-      margin-right: 0.8rem;
+      margin-right: 1rem;
       font-family: "Font Awesome 5 Free";
       text-align: center;
       width: 1.25rem;

_sass/addon/module.scss

@@ -146,7 +146,6 @@
 @mixin prompt($type, $fw-icon, $icon-weight: 900) {
   &.prompt-#{$type} {
     background-color: var(--prompt-#{$type}-bg);
-    color: var(--prompt-text-color);
 
     &::before {
       content: $fw-icon;

_sass/addon/syntax.scss

@@ -5,23 +5,27 @@
 @import "colors/light-syntax";
 @import "colors/dark-syntax";
 
-html:not([data-mode]),
-html[data-mode=light] {
-  @include light-syntax;
-}
+html {
+  @media (prefers-color-scheme: light) {
+    &:not([data-mode]),
+    [data-mode=light] {
+      @include light-syntax;
+    }
 
-html[data-mode=dark] {
-  @include dark-syntax;
-}
-
-@media (prefers-color-scheme: dark) {
-  html:not([data-mode]),
-  html[data-mode=dark] {
-    @include dark-syntax;
+    &[data-mode=dark] {
+      @include dark-syntax;
+    }
   }
 
-  html[data-mode=light] {
-    @include light-syntax;
+  @media (prefers-color-scheme: dark) {
+    &:not([data-mode]),
+    &[data-mode=dark] {
+      @include dark-syntax;
+    }
+
+    &[data-mode=light] {
+      @include light-syntax;
+    }
   }
 }
 
@@ -110,11 +114,6 @@ code {
     background-color: var(--inline-code-bg);
   }
 
-  [class^="prompt-"] & {
-    background-color: var(--prompt-code-bg);
-    color: var(--prompt-code-text-color);
-  }
-
   &.filepath {
     background-color: inherit;
     color: var(--filepath-text-color);