enhance: rt 32428 logo and branding

ecep_assets/css/site.css

@@ -7,30 +7,70 @@
 
 /* SETTINGS */
 
-/* https://github.com/TACC/Core-Styles/blob/v0.13.0/src/lib/_imports/settings/color.css */
+/* ECEP Branding */
 :root {
-  /* Accent */
-  --global-color-accent--xxx-light: #DAADFF;
-  --global-color-accent--x-light: #A12EFF;
-  --global-color-accent--light: #6E00C8;
-  --global-color-accent--normal: #4F008F;
-  --global-color-accent--dark: #2F0054;
-  --global-color-accent--x-dark: #1E0037;
+  --ecep-purple: #4D008C;
+  --ecep-green: #8FC01C;
+  --ecep-accent-blue: #0177A9;
+  --ecep-accent-red: #C5103D;
+  --ecep-accent-gray: #888C8D;
+
+  --ecep-font-title: 'Open Sans', 'Segoe UI', Tahoma, sans-serif;
+  --ecep-font-content: Arial, sans-serif;
+}
+
+:root {
+  /* Color */
+  /* https://github.com/TACC/Core-Styles/blob/v0.13.0/src/lib/_imports/settings/color.css */
+
+  /* Primary */
+  --global-color-primary--x-light: /* #f4f4f4 */
+      oklch( from var(--ecep-gray) 87.5 c h );
+  --global-color-primary--light: /* #d4d8d9 */
+      oklch( from var(--ecep-gray) 75 c h );
+  --global-color-primary--normal: /* #888C8D */
+    var(--ecep-gray );
+  --global-color-primary--dark: /* #45494a */
+      oklch( from var(--ecep-gray) 40 c h );
+  --global-color-primary--x-dark: /* #313536 */
+      oklch( from var(--ecep-gray) 33.3 c h );
+  --global-color-primary--xx-dark: /* #1f2324 */
+      oklch( from var(--ecep-gray) 25 c h );
 
-  --global-color-accent--alt: #DDC4F2;
-  --global-color-accent--weak: #5B00A440;
+  /* Accent */
+  --global-color-accent--xxx-light: oklch( from var(--ecep-purple) 93.5 c h );
+  --global-color-accent--xx-light: oklch( from var(--ecep-purple) 89.4 c h );
+  --global-color-accent--x-light: oklch( from var(--ecep-purple) 82.8 c h );
+  --global-color-accent--light: oklch( from var(--ecep-purple) 54.5 c h );
+  --global-color-accent--normal: var(--ecep-purple);
+  --global-color-accent--dark: oklch( from var(--ecep-purple) 28 c h );
+  --global-color-accent--x-dark: oklch( from var(--ecep-purple) 19 c h );
+  /* Accent (DEPRECATED) */
+  --global-color-accent--alt: oklch( from var(--ecep-purple) 82.8 c h );
+  --global-color-accent--weak: oklch( from var(--ecep-purple) 40 c h );
 
   /* Link */
   --global-color-link-on-light--normal: var(--global-color-accent--normal);
   --global-color-link-on-dark--normal: var(--global-color-accent--xxx-light);
-}
 
-/* https://github.com/TACC/Core-Styles/blob/v0.13.0/src/lib/_imports/theme.default.css */
-:root {
-  --header-bkgd-color: #4F008F;
-  --header-minor-border-color: #DAADFF;
-  --header-search-brdr-color: #A12EFF;
-  --header-search-bkgd-color: #5f00ad;
+
+
+  /* Font */
+  /* https://github.com/TACC/Core-Styles/blob/v0.13.0/src/lib/_imports/settings/font.css */
+  --sans--cms: var(--ecep-font-content);
+  /* HACK: Distinguish heading font in settings */
+  /* FAQ: Core-Styles assumes same font for headings */
+  & :is(h1, h2, h3, h4, h5, h6) {
+    font-family: var(--ecep-font-title);
+  }
+
+
+
+  /* https://github.com/TACC/Core-Styles/blob/v0.13.0/src/lib/_imports/theme.default.css */
+  --header-bkgd-color: var(--ecep-purple);
+  --header-minor-border-color: var(--global-color-accent--xxx-light);
+  --header-search-brdr-color: var(--global-color-accent--x-light);
+  --header-search-bkgd-color: oklch( from var(--global-color-accent--dark) 45 c h / 50% );
 }