adds support for input output code blocks

JuliaDataCubes · Aug 31, 2024 · 285a26b · 285a26b
1 parent 4264906
commit 285a26b
Showing 1 changed file with 41 additions and 4 deletions.
diff --git a/docs/src/.vitepress/theme/style.css b/docs/src/.vitepress/theme/style.css
@@ -30,7 +30,11 @@ https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/var
   /* Code Snippet font */
   --vp-font-family-mono: JuliaMono-Regular, monospace;
 }
-
+/* 
+Disable contextual alternates (kind of like ligatures but different) in monospace, 
+which turns `/>` to an up arrow and `|>` (the Julia pipe symbol) to an up arrow as well.  
+This is pretty bad for Julia folks reading even though copy+paste retains the same text.
+*/
 /* Target elements with class 'mono' */
 .mono-no-substitutions {
   font-family: "JuliaMono-Light", monospace;
@@ -62,10 +66,10 @@ pre, code {
   --julia-green: #389826;
   --c-white-dark: #f8f8f8;
   --c-black-darker: #0d121b;
-  --c-black: #111827;
+  --c-black: #0f0d0d;
   --c-black-light: #161f32;
   --c-black-lighter: #262a44;
-  --vp-c-brand: #646cff;
+  --vp-c-brand: #0b0c0f;
   --vp-c-brand-light: #747bff;
   --vp-c-brand-lighter: #3d6692;
   --vp-c-brand-lightest: #bcc0ff;
@@ -187,7 +191,7 @@ mjx-container > svg {
   --vp-c-bg-soft-up: var(--c-black-lighter);
   --vp-c-bg-mute: var(--c-black-light);
   --vp-c-bg-soft-mute: var(--c-black-lighter);
-  --vp-c-bg-alt: #0d121b;
+  --vp-c-bg-alt: #020203;
   --vp-c-bg-elv: var(--vp-c-bg-soft);
   --vp-c-bg-elv-mute: var(--vp-c-bg-soft-mute);
   --vp-c-mute: var(--vp-c-bg-mute);
@@ -231,4 +235,37 @@ mjx-container > svg {
   .VPDoc {
     padding-left: 25px !important;  
   }
+}
+
+/* Custom CSS variables for input and output backgrounds */
+:root {
+  /* Light theme colors */
+  --vp-c-bg-input-light: #f3f4f6;  /* Light gray for input */
+  --vp-c-bg-output-light: #e8f0fe; /* Light blue for output */
+
+  /* Dark theme colors */
+  --vp-c-bg-input-dark: #1a1a1a;   /* Dark gray for input */
+  --vp-c-bg-output-dark: #131a20;  /* Dark blue for output */
+}
+
+/* Light theme styles */
+:root {
+  --vp-c-bg-input: var(--vp-c-bg-input-light);
+  --vp-c-bg-output: var(--vp-c-bg-output-light);
+}
+
+/* Dark theme styles */
+.dark {
+  --vp-c-bg-input: var(--vp-c-bg-input-dark);
+  --vp-c-bg-output: var(--vp-c-bg-output-dark);
+}
+
+/* Style for input code blocks */
+.language-julia {
+  background-color: var(--vp-c-bg-input) !important;
+}
+
+/* Style for output code blocks */
+.language- {
+  background-color: var(--vp-c-bg-output) !important;
 }