From 1e0045c6209cf9ef2e60f6de4570eb593f235720 Mon Sep 17 00:00:00 2001
From: Martin Leblanc <m26lebla@uwaterloo.ca>
Date: Tue, 2 Jan 2024 12:54:21 -0500
Subject: [PATCH] ISTWCMS-6305: Continue use of color vars for link and button
colors
---
src/patterns/01-core/mixins/_headings.scss | 5 ----
.../03-layouts/site-footer/_site-footer.scss | 10 ++-----
.../04-components/link-list/_link-list.scss | 18 ++----------
.../04-components/links/_links-vars.scss | 28 +++++++++++++------
4 files changed, 23 insertions(+), 38 deletions(-)
diff --git a/src/patterns/01-core/mixins/_headings.scss b/src/patterns/01-core/mixins/_headings.scss
index eed89d9b..da049233 100644
--- a/src/patterns/01-core/mixins/_headings.scss
+++ b/src/patterns/01-core/mixins/_headings.scss
@@ -31,11 +31,6 @@
*:not(.uw-admin-label) + & {
margin-top: var(--size-2);
}
-
- a {
- color: inherit;
- font-weight: inherit;
- }
}
@mixin heading-1 {
diff --git a/src/patterns/03-layouts/site-footer/_site-footer.scss b/src/patterns/03-layouts/site-footer/_site-footer.scss
index fd810da4..3d669e2e 100644
--- a/src/patterns/03-layouts/site-footer/_site-footer.scss
+++ b/src/patterns/03-layouts/site-footer/_site-footer.scss
@@ -28,12 +28,6 @@
grid-row: 1 / 2;
text-align: left;
}
- a{
- @include link(
- var(--uw-white),
- var(--uw-white)
- );
- }
}
&__logo {
grid-column: 1 / 2;
@@ -85,8 +79,8 @@
padding-left: 0;
padding-right: 0;
}
- a{
- color: var(--uw-white-1);
+ .highlight {
+ color: var(--uw-white);
}
table {
caption {
diff --git a/src/patterns/04-components/link-list/_link-list.scss b/src/patterns/04-components/link-list/_link-list.scss
index cc4610ac..4d3806b5 100644
--- a/src/patterns/04-components/link-list/_link-list.scss
+++ b/src/patterns/04-components/link-list/_link-list.scss
@@ -189,7 +189,6 @@
.uw-link-list__link a,
.uw-link {
min-height: 24.8rem;
- //flex: 1 0 24%;
}
}
}
@@ -203,10 +202,6 @@
margin-bottom: 0;
.uw-link-list__link {
a {
- @include link-reverse(
- var(--uw-black),
- var(--uw-black)
- );
display: inline-block;
margin-bottom: var(--size-05);
}
@@ -282,14 +277,12 @@
display: inline-block;
font-family: var(--font-condensedbook);
font-size: var(--font-size-0);
- @media(min-width: $screen-sm) {
- font-size: var(--font-size-1);
- }
font-weight: var(--font-weight-200);
letter-spacing: var(--font-letterspacing-2);
line-height: var(--font-lineheight-4);
padding: var(--size-1) var(--size-2);
- @media(min-width: $screen-sm) {
+ @media(min-width: $screen-md) {
+ font-size: var(--font-size-1);
padding: var(--size-2) var(--size-4);
}
text-align: center;
@@ -317,11 +310,4 @@
}
}
}
- // bg color on hover of images
- .uw-link__bg-image.uw-link__link-color--#{$faculty} {
- &:hover,
- &:focus {
- background-color: var(--uw-black) !important;
- }
- }
}
diff --git a/src/patterns/04-components/links/_links-vars.scss b/src/patterns/04-components/links/_links-vars.scss
index 3bef9436..5ea41d2e 100644
--- a/src/patterns/04-components/links/_links-vars.scss
+++ b/src/patterns/04-components/links/_links-vars.scss
@@ -13,8 +13,11 @@
--link-color: var(--theme-link-color);
--link-color-2: var(--gray-5);
}
+ .contextual-links a {
+ --link-color: var(--uw-black);
+ text-shadow: none !important;
+ }
}
-
// Special color assignments inside background colors.
.uw-section__background--#{$faculty} {
@if $faculty == org-default or $faculty == neutral {
@@ -90,6 +93,9 @@
a {
--link-color: var(--uw-white);
--link-color-2: var(--theme-link-color);
+ .uw-link-list--style-option & {
+ --link-color-2: var(--#{$colour}-primary);
+ }
&.uw-link-list__button {
--link-color: var(--uw-white);
--link-color-2: var(--#{$colour}-primary);
@@ -212,6 +218,10 @@ body {
}
a {
// Force links custom.
+ &.button {
+ --link-color: var(--uw-white);
+ --link-color-2: var(--gray-5);
+ }
.pager__item & {
--link-color: var(--uw-black);
--link-color-2: var(--uw-white);
@@ -227,7 +237,7 @@ a {
--link-color-2: var(--uw-gold);
}
- .uw-footer-phone & {
+ .uw-footer-phone &, {
--link-color: var(--uw-gold);
--link-color-2: var(--uw-gold);
}
@@ -245,9 +255,6 @@ a {
// Force links black.
.contextual-link &,
.toolbar-tray &,
- .uw-site-name__link,
- .layout-builder__link,
- .layout-builder__add-block .layout-builder__link,
.tabs &,
.timeline-info__withlink &,
.ui-dialog-content &,
@@ -256,6 +263,7 @@ a {
.view-interact &,
.uw-site-footer__content table &,
&.uw-site-name__link,
+ &.layout-builder__link,
.waterloo-events__event--title,
.waterloo-events__event--summary,
.uw-waterloo-news__items &,
@@ -286,16 +294,18 @@ a {
.uw-section__background--neutral .card__title &,
.uw-section__background--org-default .card__title &,
.uw-contact__h2 &,
- .uw-link__link-color &{
+ .uw-link__link-color &,
+ .uw-link-list--style-quick &,
+ .uw-contact__h2 &{
@include link-reverse(
var(--link-color),
var(--link-color-2)
);
}
// Set no underlined on hover for buttons ect.
- .uw-site-name__link,
- .layout-builder__link,
- .layout-builder__add-block .layout-builder__link,
+ &.button,
+ &.uw-site-name__link,
+ &.layout-builder__link,
.tabs &,
.timeline-info__withlink &,
.ui-dialog-content &,
--
GitLab