From acc14b6b42b0cd0e392ca3eced80904c74d1142e Mon Sep 17 00:00:00 2001
From: Tyler Struyk <tyler.struyk@uwaterloo.ca>
Date: Fri, 4 Oct 2019 20:30:47 +0000
Subject: [PATCH] Added Color Bars
---
.../00-config/colors-bars/_colors-bars.scss | 72 +++++++++++++++++++
.../00-config/colors-bars/colors-bars.twig | 36 ++++++++++
.../00-config/colors-bars/colors-bars.yml | 70 ++++++++++++++++++
3 files changed, 178 insertions(+)
create mode 100644 source/_patterns/00-global/00-config/colors-bars/_colors-bars.scss
create mode 100644 source/_patterns/00-global/00-config/colors-bars/colors-bars.twig
create mode 100644 source/_patterns/00-global/00-config/colors-bars/colors-bars.yml
diff --git a/source/_patterns/00-global/00-config/colors-bars/_colors-bars.scss b/source/_patterns/00-global/00-config/colors-bars/_colors-bars.scss
new file mode 100644
index 00000000..dae49b22
--- /dev/null
+++ b/source/_patterns/00-global/00-config/colors-bars/_colors-bars.scss
@@ -0,0 +1,72 @@
+@import "../colors/colors.scss";
+
+// Classes attached to the body or header that color bars colors.
+$different-color-bars: (
+ default: $uw-colors-uw-golds-hex,
+ fac-ahs: $uw-colors-fac-ahs-hex,
+ fac-art: $uw-colors-fac-art-hex,
+ fac-eng: $uw-colors-fac-eng-hex,
+ fac-env: $uw-colors-fac-env-hex,
+ fac-mat: $uw-colors-fac-mat-hex,
+ fac-sci: $uw-colors-fac-sci-hex,
+ sch: $uw-colors-school-hex,
+);
+
+// All the colors are for the bars are already generated in base-colors
+// The only one that is not, is when there is no class.
+@each $ckey, $hex in $uw-colors-uw-golds-hex {
+ header.default .uw-colors--#{$ckey}--background {
+ background: $hex;
+ }
+
+ header.default .uw-colors--#{$ckey}--foreground {
+ color: $hex;
+ }
+}
+
+.uw-site--colours {
+ margin-left: auto;
+ margin-right: auto;
+ max-width: 100%;
+}
+
+.uw-site--cbar {
+ display: flex;
+ flex-direction: row wrap;
+ justify-content: flex-start;
+ width: 100%;
+}
+
+@media screen and (min-width: 1rem) {
+ .uw-cbar {
+ height: 0.625rem;
+ }
+}
+
+@media screen and (min-width: 40.0625rem) {
+ .uw-cbar {
+ height: 0.875rem;
+ }
+}
+
+@media screen and (min-width: 48.0625rem) {
+ .uw-cbar {
+ height: 1rem;
+ }
+}
+
+@media screen and (min-width: 63.1875rem) {
+ .uw-cbar {
+ height: 1.125rem;
+ }
+}
+
+.uw-cbar {
+ -webkit-box-flex: 1;
+ -webkit-flex: 1;
+ -moz-flex: 1;
+ -ms-flex: 1;
+ flex: 1;
+ margin: 0;
+ padding: 0;
+}
diff --git a/source/_patterns/00-global/00-config/colors-bars/colors-bars.twig b/source/_patterns/00-global/00-config/colors-bars/colors-bars.twig
new file mode 100644
index 00000000..a4ea3f7a
--- /dev/null
+++ b/source/_patterns/00-global/00-config/colors-bars/colors-bars.twig
@@ -0,0 +1,36 @@
+{% set lvl = 0 %}
+{% set cbar_num = 0 %}
+{% for group in items.groups %}
+ <h1> {{ group.name }}</h1>
+ {% if (group.sub_groups) %}
+ {% for sub_group in group.sub_groups %}
+ <h2>{{ sub_group.name }}</h2>
+ <div id="color-bar{{ cbar_num }}" class="uw_site--colors">
+ <div class="uw-cbar" style="background: black"></div>
+ <div class="uw-section--innner">
+ <div class="uw-site--cbar">
+ {% set lvl = 0 %}
+ {% for hex in sub_group.colors %}
+ {% set lvl = lvl + 1 %}
+ <div class="uw-colors--lvl{{ lvl }} uw-cbar" style="background: {{ hex }}"></div>
+ {% endfor %}
+ </div>
+ </div>
+ </div>
+ {% endfor %}
+ {% else %}
+ <div id="color-bar{{ cbar_num }}" class="uw_site--colors">
+ <div class="uw-cbar" style="background: black"></div>
+ <div class="uw-section--innner">
+ <div class="uw-site--cbar">
+ {% set lvl = 0 %}
+ {% for hex in group.colors %}
+ {% set lvl = lvl + 1 %}
+ <div class="uw-colors--lvl{{ lvl }} uw-cbar" style="background: {{ hex }}"></div>
+ {% endfor %}
+ </div>
+ </div>
+ </div>
+
+ {% endif %}
+{% endfor %}
diff --git a/source/_patterns/00-global/00-config/colors-bars/colors-bars.yml b/source/_patterns/00-global/00-config/colors-bars/colors-bars.yml
new file mode 100644
index 00000000..73cb2fd1
--- /dev/null
+++ b/source/_patterns/00-global/00-config/colors-bars/colors-bars.yml
@@ -0,0 +1,70 @@
+items:
+ groups:
+ -
+ name: "University of Waterloo"
+ abbv: uw
+ colors:
+ - '#ffffaa'
+ - '#ffea3d'
+ - '#ffd54f'
+ - '#e4b429'
+ -
+ name: "Faculties"
+ abbv: fac
+ sub_groups:
+ -
+ name: "Faculty of Arts"
+ abbv: art
+ colors:
+ - '#ffd5a5'
+ - '#fbaf00'
+ - '#e78100'
+ - '#d93f00'
+ -
+ name: "Faculty of Applied Health Sciences"
+ abbv: ahs
+ colors:
+ - '#97dfef'
+ - '#00bed0'
+ - '#0098a5'
+ - '#005963'
+ -
+ name: "Faculty of Engineering"
+ abbv: eng
+ colors:
+ - '#d0b4ef'
+ - '#be33da'
+ - '#8100b4'
+ - '#57058b'
+ -
+ name: "Faculty of Environment"
+ abbv: env
+ colors:
+ - '#daf582'
+ - '#bed500'
+ - '#b4be00'
+ - '#607000'
+ -
+ name: "Faculty of Math"
+ abbv: mat
+ colors:
+ - '#ffbeef'
+ - '#ff63aa'
+ - '#df2498'
+ - '#c60078'
+ -
+ name: "Faculty of Science"
+ abbv: sci
+ colors:
+ - '#b4d5ff'
+ - '#63a0ff'
+ - '#0073ce'
+ - '#0033be'
+ -
+ name: "Schools and Satellite Campuses"
+ abbv: sch
+ colors:
+ - '#ffA5aa'
+ - '#e41740'
+ - '#b71233'
+ - '#80001f'
--
GitLab