diff --git a/src/patterns/01-core/props/_colors.scss b/src/patterns/01-core/props/_colors.scss
index 639711bcfd901c7aef7f9e97b0efd2a9089baab7..af9c8be2093d0a9e4eef614c5f06272501bfe3e0 100644
--- a/src/patterns/01-core/props/_colors.scss
+++ b/src/patterns/01-core/props/_colors.scss
@@ -220,18 +220,18 @@
}
$faculties_colours: (
- 'org-default': --uw-gold,
- 'org-ahs': --ahs,
- 'org-art': --art,
- 'org-eng': --eng,
- 'org-env': --env,
- 'org-mat': --mat,
- 'org-sci': --sci,
- 'org-school': --school,
- 'org-stp': --stp,
- 'org-cgc': --cgc,
- 'org-stj': --stj,
- 'org-ren': --ren
+ 'org-default': uw-gold,
+ 'org-ahs': ahs,
+ 'org-art': art,
+ 'org-eng': eng,
+ 'org-env': env,
+ 'org-mat': mat,
+ 'org-sci': sci,
+ 'org-school': school,
+ 'org-stp': stp,
+ 'org-cgc': cgc,
+ 'org-stj': stj,
+ 'org-ren': ren
);
//Swatches
diff --git a/src/patterns/04-components/color-bar/_color-bar.scss b/src/patterns/04-components/color-bar/_color-bar.scss
index e64e424c1e2c51790e8d6b0d522e1878cfc0d418..9192ea13badd4bdd10401e7266dab1af790ba622 100644
--- a/src/patterns/04-components/color-bar/_color-bar.scss
+++ b/src/patterns/04-components/color-bar/_color-bar.scss
@@ -5,8 +5,8 @@ $lvls: '1', '2', '3', '4';
@each $faculty, $colour in $faculties_colours {
@each $lvl in $lvls {
.uw-colour-bar__cbar {
- &.#{$faculty}-#{$lvl} {
- background-color: var(#{$colour}-#{$lvl});
+ &.#{$colour}-#{$lvl} {
+ background-color: var(--#{$colour}-#{$lvl});
}
}
}
diff --git a/src/patterns/04-components/date/_date.scss b/src/patterns/04-components/date/_date.scss
index ed273295b0353cbea0444ae4729eb1b5053b1581..fa0845d39ecfac92042bae4e46fc5e95ede6fcee 100644
--- a/src/patterns/04-components/date/_date.scss
+++ b/src/patterns/04-components/date/_date.scss
@@ -68,12 +68,12 @@
@if $faculty == org-default {
.uw-date {
- background-color: var($colour);
+ background-color: var(--#{$colour}-primary);
color: var(--uw-black);
}
.uw-date-details {
- background-color: var($colour);
+ background-color: var(--#{$colour}-primary);
&[open] {
.uw-date-details__summary {
@@ -88,18 +88,18 @@
}
@include svg-background(mobile-arrow-down);
- background-color: var($colour);
+ background-color: var(--#{$colour}-primary);
color: var(--uw-black);
}
}
@else {
.uw-date {
- background-color: var(#{$colour}-primary);
+ background-color: var(--#{$colour}-primary);
color: var(--uw-white);
}
.uw-date-details {
- background-color: var(#{$colour}-primary);
+ background-color: var(--#{$colour}-primary);
&[open] {
.uw-date-details__summary {
@@ -114,7 +114,7 @@
}
@include svg-background(mobile-arrow-down-w);
- background-color: var(#{$colour}-primary);
+ background-color: var(--#{$colour}-primary);
color: var(--uw-white);
}
}
diff --git a/src/patterns/04-components/menu/menu--horizontal/_menu--horizontal.scss b/src/patterns/04-components/menu/menu--horizontal/_menu--horizontal.scss
index 698dccb38d83d1b9d0e1ce75f1f2f18b366998fe..c718575d6919ca29a1ce7c0878e4dee1af5872ec 100644
--- a/src/patterns/04-components/menu/menu--horizontal/_menu--horizontal.scss
+++ b/src/patterns/04-components/menu/menu--horizontal/_menu--horizontal.scss
@@ -121,8 +121,8 @@ $menu-horizontal-drop-bg: #f7f7f7;
.uw-site-home__link{
svg{
.bg-circle{
- fill: var(#{$colour}-primary);
- stroke: var(#{$colour}-primary);
+ fill: var(--#{$colour}-primary);
+ stroke: var(--#{$colour}-primary);
}
.house{
fill: var(--uw-white);
@@ -132,10 +132,10 @@ $menu-horizontal-drop-bg: #f7f7f7;
svg{
.bg-circle{
fill: var(--uw-white);
- stroke: var(#{$colour}-primary);
+ stroke: var(--#{$colour}-primary);
}
.house{
- fill: var(#{$colour}-primary);
+ fill: var(--#{$colour}-primary);
}
}
}
@@ -143,10 +143,10 @@ $menu-horizontal-drop-bg: #f7f7f7;
svg{
.bg-circle{
fill: var(--uw-white);
- stroke: var(#{$colour}-primary);
+ stroke: var(--#{$colour}-primary);
}
.house{
- fill: var(#{$colour}-primary);
+ fill: var(--#{$colour}-primary);
}
}
}
@@ -160,8 +160,8 @@ $menu-horizontal-drop-bg: #f7f7f7;
.menu__item{
&__parent{
a{
- border-bottom: 1px solid var(#{$colour}-primary);
- color: var(#{$colour}-primary);
+ border-bottom: 1px solid var(--#{$colour}-primary);
+ color: var(--#{$colour}-primary);
}
}
}
@@ -191,13 +191,13 @@ $menu-horizontal-drop-bg: #f7f7f7;
text-decoration: none;
&:focus {
background-color: inherit;
- border-bottom: var(--size-xs) solid var(#{$colour}-primary);
+ border-bottom: var(--size-xs) solid var(--#{$colour}-primary);
color: var(--uw-black);
}
&.active{
background-color: inherit;
- border-bottom: var(--size-xs) solid var(#{$colour}-primary);
- color: var(#{$colour}-primary);
+ border-bottom: var(--size-xs) solid var(--#{$colour}-primary);
+ color: var(--#{$colour}-primary);
&::after{
display: none;
}
@@ -209,8 +209,8 @@ $menu-horizontal-drop-bg: #f7f7f7;
}
&:hover{
background-color: inherit;
- border-bottom: var(--size-xs) solid var(#{$colour}-primary);
- color: var(#{$colour}-primary);
+ border-bottom: var(--size-xs) solid var(--#{$colour}-primary);
+ color: var(--#{$colour}-primary);
}
}
}
diff --git a/src/patterns/04-components/site-name/_site-name.scss b/src/patterns/04-components/site-name/_site-name.scss
index 31752d7bf7d2083a568bbacc810d902d2e85a2fe..04e886989b9baec7a666ad0cd6561164c766c2fc 100644
--- a/src/patterns/04-components/site-name/_site-name.scss
+++ b/src/patterns/04-components/site-name/_site-name.scss
@@ -2,11 +2,11 @@
// Styles for Site name.
@use '../../01-core' as *;
-$site-name-font-family: var(--gray-2);
$site-name-font-size: var(--font-size-5);
.uw-site-name {
a{
+ color: var(--uw-black);
&:hover{
text-decoration: underline;
}
diff --git a/src/patterns/04-components/tag/_tag.scss b/src/patterns/04-components/tag/_tag.scss
index 1be9bb5c4088eed9d7a60f2b0c5aed6c17d836e4..dcdb8275224f63ee4a12669e1647950365c7dc16 100644
--- a/src/patterns/04-components/tag/_tag.scss
+++ b/src/patterns/04-components/tag/_tag.scss
@@ -3,7 +3,6 @@
@use '../../01-core' as *;
-$faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat', 'org-sci', 'org-school', 'org-stp', 'org-cgc', 'org-stj', 'org-ren';
$tag-font-family-small: var(--font-systemmedium) !default;
$tag-font-family-normal: var(--font-systembold) !default;
$tag-font-size-normal: var(--font-size-00) !default;
@@ -104,8 +103,7 @@ $tag-font-size-small: var(--font-size-0000) !default;
transition: background 300ms ease;
}
}
-
-@each $faculty in $faculties {
+@each $faculty, $colour in $faculties_colours {
.#{$faculty} {
a.tag--full{
@if $faculty == org-default {
@@ -117,24 +115,24 @@ $tag-font-size-small: var(--font-size-0000) !default;
color: var(--uw-black-primary);
}
}
- //@else if $faculty == org-stp or $faculty == org-stj or $faculty == org-ren or $faculty == org-cgc{
- // background-color:gesso-brand($faculty,'primary');
- // color: gesso-brand(org-default,uw-white,'primary');
- // &:hover,
- // &:focus {
- // background-color: gesso-brand($faculty, 'light');
- // color:gesso-brand($faculty,'primary');
- // }
- //}
- //@else {
- // background-color:gesso-brand($faculty,'primary');
- // color: gesso-brand(org-default,uw-white,'primary');
- // &:hover,
- // &:focus {
- // background-color: gesso-brand($faculty, 'lvl1');
- // color:gesso-brand($faculty,'primary');
- // }
- //}
+ @else if $faculty == org-stp or $faculty == org-stj or $faculty == org-ren or $faculty == org-cgc{
+ background-color: var(--#{$colour}-primary);
+ color: var(--uw-white);
+ &:hover,
+ &:focus {
+ background-color: var(--#{$colour}-light);
+ color: var(--#{$colour}-primary);
+ }
+ }
+ @else {
+ background-color: var(--#{$colour}-primary);
+ color: var(--uw-white);
+ &:hover,
+ &:focus {
+ background-color: var(--#{$colour}-primary);
+ color: var(--#{$colour}-primary);
+ }
+ }
}
}
}