ISTWCMS-5594: color yml and scss update

src/patterns/01-core/props/_colors.scss

 :where(html) {
-  --gray-0: #f8f9fa;
-  --gray-1: #f1f3f5;
-  --gray-2: #e9ecef;
-  --gray-3: #dee2e6;
-  --gray-4: #ced4da;
-  --gray-5: #adb5bd;
-  --gray-6: #868e96;
-  --gray-7: #495057;
-  --gray-8: #343a40;
-  --gray-9: #212529;
+  // uw-branding follows:
+  --art-1: #ffe8cc;
+  --art-2: #ffd8a8;
+  --art-3: #ffc078;
+  --art-4: #ffa94d;
+  --art-primary: #ff922b;
+  --cgc-1: #ffa5aa;
+  --cgc-2: #e41740;
+  --cgc-3: #b71233;
+  --cgc-4: #80001f;
+  --cgc-red: #c4262e;
+  --cgc-light: #E8878C;
+  --cgc-primary: #c4262e;
+  --gray-0: #ffffff;
+  --gray-1: #fafafa;
+  --gray-2: #eee;
+  --gray-3: #ccc;
+  --gray-4: #A2A2A2;
+  --gray-5: #757575;
+  --gray-6: #4e4e4e;
+  --gray-7: #333;
+  --gray-8: #000;
+  --gray-9: #000;
+  --eng-1: #d0b4ef;
+  --eng-2: #be33da;
+  --eng-3: #8100b4;
+  --eng-4: #57058b;
+  --eng-primary: #57058b;
+  --env-1: #daf582;
+  --env-2: #bed500;
+  --env-3: #b4be00;
+  --env-4: #607000;
+  --env-primary: #607000;
+  --health-1: #97dfef;
+  --health-2: #00bed0;
+  --health-3: #0098a5;
+  --health-4: #005963;
+  --health-primary: #005963;
+  --math-1: #ffbeef;
+  --math-2: #ff63aa;
+  --math-3: #df2498;
+  --math-4: #c60078;
+  --math-primary: #df2498;
+  --neutral-1: #dfdfdf;
+  --neutral-2: #a2a2a2;
+  --neutral-3: #787878;
+  --neutral-4: #000;
+  --neutral-primary: #000;
+  --sci-1: #d0ebff;
+  --sci-2: #a5d8ff;
+  --sci-3: #74c0fc;
+  --sci-4: #4dabf7;
+  --sci-primary: #339af0;
+  --school-1: #ffa5aa;
+  --school-2: #e41740;
+  --school-3: #b71233;
+  --school-4: #80001f;
+  --school-primary: #b71233;
+  --stj-1: #ffa5aa;
+  --stj-2: #e41740;
+  --stj-3: #b71233;
+  --stj-4: #80001f;
+  --stj-gold: #c88a11;
+  --stj-green: #01573e;
+  --stj-light: #92B7AC;
+  --stj-primary: #01573e;
+  --stp-1: #ffa5aa;
+  --stp-2: #e41740;
+  --stp-3: #b71233;
+  --stp-4: #80001f;
+  --stp-brown: #c88a11;
+  --stp-green: #01573e;
+  --stp-light: #92B7AC;
+  --stp-primary: #01573e;
+  --ren-1: #ffa5aa;
+  --ren-2: #e41740;
+  --ren-3: #b71233;
+  --ren-4: #80001f;
+  --ren-gold: #c88a11;
+  --ren-green: #01573e;
+  --ren-light: #92B7AC;
+  --ren-primary: #01573e;
+  --uw-black-1: #dfdfdf;
+  --uw-black-2: #a2a2a2;
+  --uw-black-3: #787878;
+  --uw-black-4: #000;
+  --uw-black-primary: #000;
+  --uw-gold-1: #fffaaa;
+  --uw-gold-2: #ffea30;
+  --uw-gold-3: #fdd54f;
+  --uw-gold-4: #e4b429;
+  --uw-gold-primary: #fffaaa;
+  --uw-white-1: #fff;
+  --uw-white-primary: #fff;
+  // Default Ohana follows:
   --red-0: #fff5f5;
   --red-1: #ffe3e3;
   --red-2: #ffc9c9;

src/patterns/02-base/colors/colors.yml

 ---
 colors:
-#  brand:
-#    blue-cool-30v: '#59b9de'
-#    blue-cool-50v: '#0d7ea2'
-#    green-warm-20: '#cbd17a'
-#    green-warm-50: '#6f7a41'
-#    red-warm-20v: '#f6bd9c'
-#    red-warm-40v: '#ef5e25'
-#  shades:
-#    light: '#fff'
-#    dark: '#000'
   grayscale:
-#    gray-5: '#f0f0f0'
-#    gray-10: '#e6e6e6'
-#    gray-20: '#c9c9c9'
-#    gray-30: '#adadad'
-#    gray-40: '#919191'
-#    gray-50: '#757575'
-#    gray-60: '#5c5c5c'
-#    gray-70: '#454545'
-#    gray-80: '#2e2e2e'
-#    gray-90: '#1b1b1b'
-    white: '#fff'
-    gray-1: '#fafafa'
-    gray-2: '#eee'
-    gray-3: '#ccc'
-    gray-4: '#A2A2A2'
-    gray-5: '#757575'
-    gray-6: '#4e4e4e'
-    gray-7: '#333'
-    black: '#000'
+    --gray-0: 'var(--gray-0)'
+    --gray-1: 'var(--gray-1)'
+    --gray-2: 'var(--gray-2)'
+    --gray-3: 'var(--gray-3)'
+    --gray-4: 'var(--gray-4)'
+    --gray-5: 'var(--gray-5)'
+    --gray-6: 'var(--gray-6)'
+    --gray-7: 'var(--gray-7)'
+    --gray-8: 'var(--gray-8)'
+    --gray-9: 'var(--gray-9)'
   uw-black:
-    lvl1: '#dfdfdf'
-    lvl2: '#a2a2a2'
-    lvl3: '#787878'
-    lvl4: '#000'
-    primary: '#000'
+    --uw-black-1: 'var(--uw-black-1)'
+    --uw-black-2: 'var(--uw-black-2)'
+    --uw-black-3: 'var(--uw-black-3)'
+    --uw-black-4: 'var(--uw-black-4)'
+    --uw-black-primary: 'var(--uw-black-primary)'
   uw-gold:
-    lvl1: '#fffaaa'
-    lvl2: '#ffea30'
-    lvl3: '#fdd54f'
-    lvl4: '#e4b429'
-    primary: '#fffaaa'
+    --uw-gold-1: 'var( --uw-gold-1)'
+    --uw-gold-2: 'var( --uw-gold-2)'
+    --uw-gold-3: 'var(--uw-gold-3)'
+    --uw-gold-4: 'var(--uw-gold-4)'
+    --uw-gold-primary: 'var(--uw-gold-primary)'
   uw-white:
-    lvl1: '#fff'
-    primary: '#fff'
+    --uw-white-1: 'var(--uw-white-1)'
+    --uw-white-primary: 'var(--uw-white-primary)'
   neutral:
-    lvl1: '#dfdfdf'
-    lvl2: '#a2a2a2'
-    lvl3: '#787878'
-    lvl4: '#000'
-    primary: '#000'
+    --neutral-1: 'var(--neutral-1)'
+    --neutral-2: 'var(--neutral-2)'
+    --neutral-3: 'var(--neutral-3)'
+    --neutral-4: 'var(--neutral-4)'
+    --neutral-primary: 'var(--neutral-primary)'
   org-ahs:
-    lvl1: '#97dfef'
-    lvl2: '#00bed0'
-    lvl3: '#0098a5'
-    lvl4: '#005963'
-    primary: '#005963'
+    --health-1: 'var( --health-1)'
+    --health-2: 'var( --health-2)'
+    --health-3: 'var( --health-3)'
+    --health-4: 'var( --health-4)'
+    --health-primary: 'var(--health-primary)'
   org-art:
-    lvl1: '#ffd5a5'
-    lvl2: '#fbaf00'
-    lvl3: '#e78100'
-    lvl4: '#d93f00'
-    primary: '#d93f00'
+    --art-1: 'var(--art-1)'
+    --art-2: 'var(--art-2)'
+    --art-3: 'var(--art-3)'
+    --art-4: 'var(--art-4)'
+    --art-primary: 'var(--art-primary)'
   org-eng:
-    lvl1: '#d0b4ef'
-    lvl2: '#be33da'
-    lvl3: '#8100b4'
-    lvl4: '#57058b'
-    primary: '#57058b'
+    --eng-1: 'var(--eng-1)'
+    --eng-2: 'var(--eng-2)'
+    --eng-3: 'var(--eng-3)'
+    --eng-4: 'var(--eng-4)'
+    --eng-primary: 'var(--eng-primary)'
   org-env:
-    lvl1: '#daf582'
-    lvl2: '#bed500'
-    lvl3: '#b4be00'
-    lvl4: '#607000'
-    primary: '#607000'
+    --env-1: 'var(--env-1)'
+    --env-2: 'var(--env-2)'
+    --env-3: 'var(--env-3)'
+    --env-4:  'var(--env-4)'
+    --env-primary: 'var(--env-primary)'
   org-mat:
-    lvl1: '#ffbeef'
-    lvl2: '#ff63aa'
-    lvl3: '#df2498'
-    lvl4: '#c60078'
-    primary: '#df2498'
+    --math-1: 'var(--math-1)'
+    --math-2: 'var(--math-2)'
+    --math-3: 'var(--math-3)'
+    --math-4: 'var(--math-4)'
+    --math-primary: 'var(--math-primary)'
   org-sci:
-    lvl1: '#b4d5ff'
-    lvl2: '#63a0ff'
-    lvl3: '#0073ce'
-    lvl4: '#0033be'
-    primary: '#0073ce'
+    --sci-1: 'var(--sci-1)'
+    --sci-2: 'var(--sci-2)'
+    --sci-3: 'var(--sci-3)'
+    --sci-4: 'var(--sci-4)'
+    --sci-primary: 'var(--sci-primar)'
   org-school:
-    lvl1: '#ffa5aa'
-    lvl2: '#e41740'
-    lvl3: '#b71233'
-    lvl4: '#80001f'
-    primary: '#b71233'
+    --school-1: 'var(--school-1)'
+    --school-2: 'var(--school-2)'
+    --school-3: 'var(--school-3)'
+    --school-4: 'var(--school-4)'
+    --school-primary: 'var(--school-primary)'
   org-ren:
-    green: '#00693c'
-    red: '#de3831'
-    gold: '#d2c295'
-    lvl1: '#ffa5aa'
-    lvl2: '#e41740'
-    lvl3: '#b71233'
-    lvl4: '#80001f'
-    primary: '#00693c'
-    light: '#7FB49D'
+    --ren-1: 'var(--ren-1)'
+    --ren-2: 'var(--ren-2)'
+    --ren-3: 'var(--ren-3)'
+    --ren-4: 'var(--ren-4)'
+    --ren-gold: 'var(--ren-gold)'
+    --ren-green: 'var(--ren-green)'
+    --ren-red: 'var(--ren-red)'
+    --ren-primary: 'var(--ren-primary)'
+    --ren-light: 'var(--ren-light)'
   org-stj:
-    green: '#01573e'
-    gold: '#c88a11'
-    lvl1: '#ffa5aa'
-    lvl2: '#e41740'
-    lvl3: '#b71233'
-    lvl4: '#80001f'
-    primary: '#01573e'
-    light: '#92B7AC'
+    --stj-green: 'var(--stj-green)'
+    --stj-gold: 'var(--stj-gold)'
+    --stj-1: 'var(--stj-1)'
+    --stj-2: 'var(--stj-2)'
+    --stj-3: 'var(--stj-3)'
+    --stj-4: 'var(--stj-4)'
+    --stj-primary: 'var(--stj-primary)'
+    --stj-light: 'var(--stj-light)'
   org-stp:
-    green: '#879637'
-    brown: '#584528'
-    lvl1: '#ffa5aa'
-    lvl2: '#e41740'
-    lvl3: '#b71233'
-    lvl4: '#80001f'
-    primary: '#879637'
-    light: '#C2CD79'
+    --stp-green: 'var(--stp-green)'
+    --stp-brown: 'var(--stp-brown)'
+    --stp-1: 'var(--stp-1)'
+    --stp-2: 'var(--stp-2)'
+    --stp-3: 'var(--stp-3)'
+    --stp-4: 'var(--stp-4)'
+    --stp-primary: 'var(--stp-primary)'
+    --stp-light: 'var(--stp-light)'
   org-cgc:
-    red: '#c4262e'
-    lvl1: '#ffa5aa'
-    lvl2: '#e41740'
-    lvl3: '#b71233'
-    lvl4: '#80001f'
-    primary: '#c4262e'
-    light: '#E8878C'
+    --cgc-red: 'var(--cgc-red)'
+    --cgc1: 'var(--cgc-1)'
+    --cgc2: 'var(--cgc-2)'
+    --cgc3: 'var(--cgc-3)'
+    --cgc-4: 'var(--cgc-4)'
+    --cgc-primary: 'var(--cgc-primary)'
+    --cgc-light: 'var(--cgc-light)'
+  Red:
+    --red-0: 'var(--red-0)'
+    --red-1: 'var(--red-1)'
+    --red-2: 'var(--red-2)'
+    --red-3: 'var(--red-3)'
+    --red-4: 'var(--red-4)'
+    --red-5: 'var(--red-5)'
+    --red-6: 'var(--red-6)'
+    --red-7: 'var(--red-7)'
+    --red-8: 'var(--red-8)'
+    --red-9: 'var(--red-9)'
+  Pink:
+    --pink-0: 'var(--pink-0)'
+    --pink-1: 'var(--pink-1)'
+    --pink-2: 'var(--pink-2)'
+    --pink-3: 'var(--pink-3)'
+    --pink-4: 'var(--pink-4)'
+    --pink-5: 'var(--pink-5)'
+    --pink-6: 'var(--pink-6)'
+    --pink-7: 'var(--pink-7)'
+    --pink-8: 'var(--pink-8)'
+    --pink-9: 'var(--pink-9)'
+  Grape:
+    --grape-0: 'var(--grape-0)'
+    --grape-1: 'var(--grape-1)'
+    --grape-2: 'var(--grape-2)'
+    --grape-3: 'var(--grape-3)'
+    --grape-4: 'var(--grape-4)'
+    --grape-5: 'var(--grape-5)'
+    --grape-6: 'var(--grape-6)'
+    --grape-7: 'var(--grape-7)'
+    --grape-8: 'var(--grape-8)'
+    --grape-9: 'var(--grape-9)'
+  Violet:
+    --violet-0: 'var(--violet-0)'
+    --violet-1: 'var(--violet-1)'
+    --violet-2: 'var(--violet-2)'
+    --violet-3: 'var(--violet-3)'
+    --violet-4: 'var(--violet-4)'
+    --violet-5: 'var(--violet-5)'
+    --violet-6: 'var(--violet-6)'
+    --violet-7: 'var(--violet-7)'
+    --violet-8: 'var(--violet-8)'
+    --violet-9: 'var(--violet-9)'
+  Indigo:
+    --indigo-0: 'var(--indigo-0)'
+    --indigo-1: 'var(--indigo-1)'
+    --indigo-2: 'var(--indigo-2)'
+    --indigo-3: 'var(--indigo-3)'
+    --indigo-4: 'var(--indigo-4)'
+    --indigo-5: 'var(--indigo-5)'
+    --indigo-6: 'var(--indigo-6)'
+    --indigo-7: 'var(--indigo-7)'
+    --indigo-8: 'var(--indigo-8)'
+    --indigo-9: 'var(--indigo-9)'
+  Blue:
+    --blue-0: 'var(--blue-0)'
+    --blue-1: 'var(--blue-1)'
+    --blue-2: 'var(--blue-2)'
+    --blue-3: 'var(--blue-3)'
+    --blue-4: 'var(--blue-4)'
+    --blue-5: 'var(--blue-5)'
+    --blue-6: 'var(--blue-6)'
+    --blue-7: 'var(--blue-7)'
+    --blue-8: 'var(--blue-8)'
+    --blue-9: 'var(--blue-9)'
+  Cyan:
+    --cyan-0: 'var(--cyan-0)'
+    --cyan-1: 'var(--cyan-1)'
+    --cyan-2: 'var(--cyan-2)'
+    --cyan-3: 'var(--cyan-3)'
+    --cyan-4: 'var(--cyan-4)'
+    --cyan-5: 'var(--cyan-5)'
+    --cyan-6: 'var(--cyan-6)'
+    --cyan-7: 'var(--cyan-7)'
+    --cyan-8: 'var(--cyan-8)'
+    --cyan-9: 'var(--cyan-9)'
+  Teal:
+    --teal-0: 'var(--teal-0)'
+    --teal-1: 'var(--teal-1)'
+    --teal-2: 'var(--teal-2)'
+    --teal-3: 'var(--teal-3)'
+    --teal-4: 'var(--teal-4)'
+    --teal-5: 'var(--teal-5)'
+    --teal-6: 'var(--teal-6)'
+    --teal-7: 'var(--teal-7)'
+    --teal-8: 'var(--teal-8)'
+    --teal-9: 'var(--teal-9)'
+  Green:
+    --green-0: 'var(--green-0)'
+    --green-1: 'var(--green-1)'
+    --green-2: 'var(--green-2)'
+    --green-3: 'var(--green-3)'
+    --green-4: 'var(--green-4)'
+    --green-5: 'var(--green-5)'
+    --green-6: 'var(--green-6)'
+    --green-7: 'var(--green-7)'
+    --green-8: 'var(--green-8)'
+    --green-9: 'var(--green-9)'
+  Lime:
+    --lime-0: 'var(--lime-0)'
+    --lime-1: 'var(--lime-1)'
+    --lime-2: 'var(--lime-2)'
+    --lime-3: 'var(--lime-3)'
+    --lime-4: 'var(--lime-4)'
+    --lime-5: 'var(--lime-5)'
+    --lime-6: 'var(--lime-6)'
+    --lime-7: 'var(--lime-7)'
+    --lime-8: 'var(--lime-8)'
+    --lime-9: 'var(--lime-9)'
+  Yellow:
+    --yellow-0: 'var(--yellow-0)'
+    --yellow-1: 'var(--yellow-1)'
+    --yellow-2: 'var(--yellow-2)'
+    --yellow-3: 'var(--yellow-3)'
+    --yellow-4: 'var(--yellow-4)'
+    --yellow-5: 'var(--yellow-5)'
+    --yellow-6: 'var(--yellow-6)'
+    --yellow-7: 'var(--yellow-7)'
+    --yellow-8: 'var(--yellow-8)'
+    --yellow-9: 'var(--yellow-9)'
+  Orange:
+    --orange-0: 'var(--orange-0)'
+    --orange-1: 'var(--orange-1)'
+    --orange-2: 'var(--orange-2)'
+    --orange-3: 'var(--orange-3)'
+    --orange-4: 'var(--orange-4)'
+    --orange-5: 'var(--orange-5)'
+    --orange-6: 'var(--orange-6)'
+    --orange-7: 'var(--orange-7)'
+    --orange-8: 'var(--orange-8)'
+    --orange-9: 'var(--orange-9)'

src/patterns/global.scss

@@ -5,4 +5,4 @@
 @use '01-core/props' as *;
 @use '01-core/utilities' as *;
 @use '01-core/elements' as *;
-//@use '03-layouts/grid/grid' as *;
+@use '03-layouts/grid/grid' as *;