From f562dfcd05d3cc785a702a9375c2fbb15bcbe29e Mon Sep 17 00:00:00 2001
From: ebremner <ebremner@uwaterloo.ca>
Date: Fri, 20 Mar 2020 12:19:44 -0400
Subject: [PATCH] ISTWCMS-3574: updating stylings for CTA with faculty
---
.../call-to-action/_call-to-action.scss | 61 +++++++++++++++----
.../call-to-action/call-to-action.twig | 2 +-
.../call-to-action/call-to-action.yml | 6 +-
3 files changed, 52 insertions(+), 17 deletions(-)
diff --git a/source/_patterns/04-components/call-to-action/_call-to-action.scss b/source/_patterns/04-components/call-to-action/_call-to-action.scss
index 5d298396..4d35c7f0 100644
--- a/source/_patterns/04-components/call-to-action/_call-to-action.scss
+++ b/source/_patterns/04-components/call-to-action/_call-to-action.scss
@@ -1,3 +1,44 @@
+$faculties: 'org-default', 'org-ahs', 'org-art', 'org-eng', 'org-env', 'org-mat', 'org-sci', 'org-school';
+
+@each $faculty in $faculties {
+ .uw-cta {
+ .#{$faculty} {
+ .uw-cta__text--big {
+
+ @if $faculty == org-default {
+ color: $uw-gold;
+ }
+ @else {
+ color: gesso-brand($faculty, 'lvl1');
+ }
+ }
+ }
+
+ &__aside.#{$faculty} {
+ &:hover {
+ @if $faculty == org-default {
+ background-color: $uw-gold;
+
+ .uw-cta__text--big,
+ .uw-cta__text--small,
+ .uw-cta__text--medium {
+ color: $uw-black;
+ }
+ }
+ @else {
+ background-color: gesso-brand($faculty, 'lvl1');
+
+ .uw-cta__text--big,
+ .uw-cta__text--small,
+ .uw-cta__text--medium {
+ color: gesso-brand($faculty, 'lvl4');
+ }
+ }
+ }
+ }
+ }
+}
+
.uw-cta {
clear: both;
height: 100%;
@@ -11,22 +52,10 @@
padding: 0 1rem;
}
- aside {
+ .uw-cta__aside {
background-color: $uw-black;
flex: 1 0 30%;
margin: 0 1rem;
-
- .uw-cta__wrapper {
- color: $uw-gold;
- }
-
- &:hover {
- background-color: $uw-gold;
-
- .uw-cta__wrapper {
- color: $uw-black;
- }
- }
}
}
@@ -37,6 +66,10 @@
padding: 0;
text-decoration: none;
width: 100%;
+
+ &:hover {
+ text-decoration: none;
+ }
}
.uw-cta__text {
@@ -49,6 +82,7 @@
}
&--medium {
+ color: $uw-white;
font-size: 1.2rem;
letter-spacing: 0.05rem;
line-height: 1.2;
@@ -56,6 +90,7 @@
}
&--small {
+ color: $uw-white;
font-size: 0.8rem;
letter-spacing: 0.02rem;
line-height: 1;
diff --git a/source/_patterns/04-components/call-to-action/call-to-action.twig b/source/_patterns/04-components/call-to-action/call-to-action.twig
index 53cc3ca7..5a153ceb 100644
--- a/source/_patterns/04-components/call-to-action/call-to-action.twig
+++ b/source/_patterns/04-components/call-to-action/call-to-action.twig
@@ -3,7 +3,7 @@
{% for cta in ctas %}
- <aside class="uw-cta__aside">
+ <aside class="uw-cta__aside {{ cta.theme }}">
{% if cta.link %}
<a href="{{ cta.link }}" class="uw-cta__link">
diff --git a/source/_patterns/04-components/call-to-action/call-to-action.yml b/source/_patterns/04-components/call-to-action/call-to-action.yml
index aa3360d2..15b5a663 100644
--- a/source/_patterns/04-components/call-to-action/call-to-action.yml
+++ b/source/_patterns/04-components/call-to-action/call-to-action.yml
@@ -19,10 +19,10 @@ ctas:
type: 'big'
- text: 'ST#2'
type: 'small'
- theme: 'org-default'
+ theme: 'org-ahs'
-
link: '#'
details:
- - text: 'BT#1'
+ - text: 'BT#3'
type: 'big'
- theme: 'org-default'
+ theme: 'org-eng'
--
GitLab