chore(dsdl): Change variable prefix from calitp to dsdl

Except for the three Cal-ITP brand color variables.

Author: Scotchester

src/stylesheets/core.css

@@ -5,8 +5,8 @@
 
 
 body {
-  color: var(--calitp-gray-100);
-  font-family: var(--calitp-font-stack);
+  color: var(--dsdl-gray-100);
+  font-family: var(--dsdl-font-stack);
   line-height: var(--line-height-normal);
 }
 
@@ -110,9 +110,14 @@ h1 {
 
 a:link,
 a:visited {
-  color: var(--calitp-blue-70);
+  color: var(--dsdl-blue-70);
 }
 a:hover,
 a:focus {
-  color: var(--calitp-blue-80);
+  color: var(--dsdl-blue-80);
+}
+
+code,
+pre {
+  font-family: var(--dsdl-monospace-font-stack);
 }

src/stylesheets/main.css

@@ -631,7 +631,8 @@ footer a:hover {
 .dsdl-demo h2,
 .dsdl-demo h3,
 .dsdl-demo h4 {
-  font-family: var(--calitp-font-stack);
+  /* TODO: Remove when it's not necessary to override the styles above. */
+  font-family: var(--dsdl-font-stack);
 }
 
 .dsdl-demo h2,
@@ -674,7 +675,7 @@ footer a:hover {
 .dsdl-core-type-matrix th,
 .dsdl-core-type-matrix td {
   padding: 0.5rem;
-  border: 1px solid var(--calitp-gray-20);
+  border: 1px solid var(--dsdl-gray-20);
 }
 .dsdl-core-type-matrix th {
   background: var(--calitp-brand-blue);

src/stylesheets/tokens.css

@@ -17,8 +17,8 @@
 
 :root {
   /* Fonts */
-  --calitp-font-stack: 'Space Grotesk', system-ui;
-  --monospace-font-stack: 'Source Code Pro', 'Cascadia Code', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  --dsdl-font-stack: 'Space Grotesk', system-ui;
+  --dsdl-monospace-font-stack: 'Source Code Pro', 'Cascadia Code', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
   /* Size */
   --text-xxs: calc(10rem / 16);
   --text-xs: calc(12rem / 16);
@@ -41,10 +41,10 @@
 
 :root {
   {% for color in site.data.dsdl_colors -%}
-  --calitp-{{ color.group }}-{{ color.level }}: {{ color.value }};
+  --dsdl-{{ color.group }}-{{ color.level }}: {{ color.value }};
   {% endfor %}
 
-  --calitp-brand-blue: var(--calitp-blue-70);  /* #045b86 */
-  --calitp-brand-cyan: var(--calitp-cyan-40);  /* #38abd0 */
-  --calitp-brand-yellow: var(--calitp-yellow-30);  /* #febd28 */
+  --calitp-brand-blue: var(--dsdl-blue-70);  /* #045b86 */
+  --calitp-brand-cyan: var(--dsdl-cyan-40);  /* #38abd0 */
+  --calitp-brand-yellow: var(--dsdl-yellow-30);  /* #febd28 */
 }