[FEATURE] updated header colors (#94)

OVERVIEW This PR changes the header colors from VHX colors to Vimeo colors
vhx · Oct 12, 2017 · 40255cb · 40255cb
1 parent 6377dcb
commit 40255cb
Show file tree

Hide file tree

Showing 7 changed files with 37 additions and 33 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,7 @@
+### 1.6.4
+**2017-10-12**
+* Updated header colors temporarily.
+
 ### 1.6.3
 **2017-10-12**
 * Updated text colors temporarily.

diff --git a/VERSION b/VERSION
@@ -1 +1 @@
-1.6.3
+1.6.4
diff --git a/dist/headers.css b/dist/headers.css
@@ -41,7 +41,7 @@
 /* sizes
 ......................................*/
 .head, .head-1, .head-2, .head-3, .head-4, .head-5 {
-  color: #375667;
+  color: #1a2e3b;
   font-weight: 500;
   text-transform: uppercase;
   font-family: "brandon-grotesque-n1", "brandon-grotesque", "Brandon Grotesque", sans-serif; }
@@ -81,41 +81,41 @@
 /* header navy
 ......................................*/
 .head--navy {
-  color: #375667; }
+  color: #1a2e3b; }
 
 a.head--navy:link, a.head--navy:visited,
 a.head-1:link,
 a.head-1:visited, a.head-2:link, a.head-2:visited, a.head-3:link, a.head-3:visited, a.head-4:link, a.head-4:visited, a.head-5:link, a.head-5:visited {
-  color: #375667;
+  color: #1a2e3b;
   text-decoration: none; }
 a.head--navy:visited, a.head--navy:hover,
 a.head-1:visited,
 a.head-1:hover, a.head-2:visited, a.head-2:hover, a.head-3:visited, a.head-3:hover, a.head-4:visited, a.head-4:hover, a.head-5:visited, a.head-5:hover {
-  color: #869AA5;
+  color: #8699a6;
   text-decoration: none; }
 
 /* header gray
 ......................................*/
 .head--gray {
-  color: #869AA5; }
+  color: #8699a6; }
 
 a.head--gray:link, a.head--gray:visited {
-  color: #869AA5;
+  color: #8699a6;
   text-decoration: none; }
 a.head--gray:hover, a.head--gray:active {
-  color: #5E7887;
+  color: #8699a6;
   text-decoration: none; }
 
 /* header teal
 ......................................*/
 .head--teal {
-  color: #22B9B0; }
+  color: #00adef; }
 
 a.head--teal:link, a.head--teal:visited {
-  color: #22B9B0;
+  color: #00adef;
   text-decoration: none; }
 a.head--teal:hover, a.head--teal:active {
-  color: #149A97;
+  color: #00adef;
   text-decoration: none; }
 
 /* header white

diff --git a/dist/quartz.css b/dist/quartz.css
@@ -6066,7 +6066,7 @@ th {
 /* sizes
 ......................................*/
 .head, .head-1, .head-2, .head-3, .head-4, .head-5 {
-  color: #375667;
+  color: #1a2e3b;
   font-weight: 500;
   text-transform: uppercase;
   font-family: "brandon-grotesque-n1", "brandon-grotesque", "Brandon Grotesque", sans-serif; }
@@ -6106,41 +6106,41 @@ th {
 /* header navy
 ......................................*/
 .head--navy {
-  color: #375667; }
+  color: #1a2e3b; }
 
 a.head--navy:link, a.head--navy:visited,
 a.head-1:link,
 a.head-1:visited, a.head-2:link, a.head-2:visited, a.head-3:link, a.head-3:visited, a.head-4:link, a.head-4:visited, a.head-5:link, a.head-5:visited {
-  color: #375667;
+  color: #1a2e3b;
   text-decoration: none; }
 a.head--navy:visited, a.head--navy:hover,
 a.head-1:visited,
 a.head-1:hover, a.head-2:visited, a.head-2:hover, a.head-3:visited, a.head-3:hover, a.head-4:visited, a.head-4:hover, a.head-5:visited, a.head-5:hover {
-  color: #869AA5;
+  color: #8699a6;
   text-decoration: none; }
 
 /* header gray
 ......................................*/
 .head--gray {
-  color: #869AA5; }
+  color: #8699a6; }
 
 a.head--gray:link, a.head--gray:visited {
-  color: #869AA5;
+  color: #8699a6;
   text-decoration: none; }
 a.head--gray:hover, a.head--gray:active {
-  color: #5E7887;
+  color: #8699a6;
   text-decoration: none; }
 
 /* header teal
 ......................................*/
 .head--teal {
-  color: #22B9B0; }
+  color: #00adef; }
 
 a.head--teal:link, a.head--teal:visited {
-  color: #22B9B0;
+  color: #00adef;
   text-decoration: none; }
 a.head--teal:hover, a.head--teal:active {
-  color: #149A97;
+  color: #00adef;
   text-decoration: none; }
 
 /* header white

diff --git a/dist/quartz.min.css b/dist/quartz.min.css
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vhx/quartz",
-  "version": "1.6.3",
+  "version": "1.6.4",
   "description": "VHX Style Guide and JS Components.",
   "homepage": "https://github.com/vhx/quartz",
   "author": "VHX",

diff --git a/quartz-css/headers/styles/headers.scss b/quartz-css/headers/styles/headers.scss
@@ -7,7 +7,7 @@
 /* sizes
 ......................................*/
 .head {
-  color: $gray-7;
+  color: $astro-granite;
   font-weight: 500;
   text-transform: uppercase;
   font-family: $font-brandon;
@@ -59,54 +59,54 @@
 /* header navy
 ......................................*/
 .head--navy {
-  color: $gray-7;
+  color: $astro-granite;
 }
 a.head--navy,
 a.head-1, a.head-2, a.head-3, a.head-4, a.head-5, {
   &:link,
   &:visited {
-    color: $gray-7;
+    color: $astro-granite;
     text-decoration: none;
   }
   &:visited,
   &:hover {
-    color: $gray-5;
+    color: $regent-gray;
     text-decoration: none;
   }
 }
 
 /* header gray
 ......................................*/
 .head--gray {
-  color: $gray-5;
+  color: $regent-gray;
 }
 a.head--gray {
   &:link,
   &:visited {
-    color: $gray-5;
+    color: $regent-gray;
     text-decoration: none;
   }
   &:hover,
   &:active {
-    color: $gray-6;
+    color: $regent-gray;
     text-decoration: none;
   }
 }
 
 /* header teal
 ......................................*/
 .head--teal {
-  color: $teal-2;
+  color: $vimeo-blue;
 }
 a.head--teal {
   &:link,
   &:visited {
-    color: $teal-2;
+    color: $vimeo-blue;
     text-decoration: none;
   }
   &:hover,
   &:active {
-    color: $teal-3;
+    color: $vimeo-blue;
     text-decoration: none;
   }
 }