CSS: colorize blockquotes

Author: Bromeon

website/src/css/main.css

@@ -157,15 +157,23 @@ html {
     /*@apply font-mono;*/
 }
 
+:is(.dark .markdown-content code) {
+    background-color: var(--brown-body-bg-dark);
+}
+
 .markdown-content blockquote {
     @apply border-l-4;
     @apply border-gray-400;
     @apply pl-4;
     @apply my-4;
+
+    color: var(--brown-caption);
+    border-color: var(--brown-hover);
 }
 
-:is(.dark .markdown-content code) {
-    background-color: var(--brown-body-bg-dark);
+:is(.dark .markdown-content blockquote) {
+    color: var(--brown-caption-dark);
+    border-color: var(--brown-hover-dark);
 }
 
 .markdown-content table {
@@ -509,6 +517,7 @@ html {
     color: var(--brown-caption);
 }
 
+
 /* --------------------------------------------------------------- */
 /* dark theme */
 

website/static/css/main.css

@@ -1592,17 +1592,24 @@ html {
   /*@apply font-mono;*/
 }
 
+:is(.dark .markdown-content code) {
+  background-color: var(--brown-body-bg-dark);
+}
+
 .markdown-content blockquote {
   border-left-width: 4px;
   --tw-border-opacity: 1;
   border-color: rgb(156 163 175 / var(--tw-border-opacity));
   padding-left: 1rem;
   margin-top: 1rem;
   margin-bottom: 1rem;
+  color: var(--brown-caption);
+  border-color: var(--brown-hover);
 }
 
-:is(.dark .markdown-content code) {
-  background-color: var(--brown-body-bg-dark);
+:is(.dark .markdown-content blockquote) {
+  color: var(--brown-caption-dark);
+  border-color: var(--brown-hover-dark);
 }
 
 .markdown-content table {