From 81e6191d79e79b426ef5bc6f225e56e84ca44c93 Mon Sep 17 00:00:00 2001 From: Sarah Frisk Date: Mon, 25 Jan 2016 23:58:52 -0500 Subject: [PATCH 1/4] Colors: Initial pass on updated palette. --- scss/variables/colors.js | 93 +++++++++++++++++++++++++--------------- 1 file changed, 58 insertions(+), 35 deletions(-) diff --git a/scss/variables/colors.js b/scss/variables/colors.js index 5f7cb5d..dea3f9c 100644 --- a/scss/variables/colors.js +++ b/scss/variables/colors.js @@ -8,42 +8,65 @@ } }( this, function( chassis ) { -var colors = { - "chassis-gray-dark": { - "value": "#383838", - "name": "Chassis Gray - Dark" - }, - "chassis-gray": { - "value": "#c1c1c1", - "name": "Chassis Gray" - }, - "chassis-gray-light": { - "value": "#f2f2f2", - "name": "Chassis Gray - Light" - }, - "chassis-blue-dark": { - "value": "#388695", - "name": "Chassis Blue - Dark" - }, - "chassis-blue": { - "value": "#4fc0c8", - "name": "Chassis Blue" - }, - "chassis-yellow": { - "value": "#fadf51", - "name": "Chassis Yellow" - } -}; chassis.colors = { - "background": colors[ "chassis-gray-dark" ], - "font": colors[ "chassis-gray-dark" ], - "link": colors[ "chassis-blue-dark" ], - "button": colors[ "chassis-blue" ], - "buttonText": colors[ "chassis-gray-light" ], - "blockquoteBorder": { - name: "Chassis - Blockquote color", - value: "#eee" - } + "primary": { + name: "Primary Colors", + value: { + "base": "#3F51B5", + "light": "#5C6BC0", + "dark": "#3949AB", + "darker": "#303F9F" + } + }, + "success": { + name: "Success Colors", + values: { + "base": "#8BC34A", + "light": "#9CCC65", + "dark": "#8BC34A", + "darker": "#689F38" + } + }, + "warning": { + name: "Warning Colors", + value: { + "base": "#FF9800", + "light": "#FFA726", + "dark": "#FB8C00", + "darker": "#F57C00" + } + }, + "info": { + name: "Info Colors", + values: { + "base": "#00BCD4", + "light": "#26C6DA", + "dark": "#00ACC1", + "darker": "#0097A7" + } + }, + "error": { + name: "Error Colors", + values: { + "base": "#F44336", + "light": "#EF5350", + "dark": "#E53935", + "darker": "#D32F2F" + } + }, + "text": { + name: "Text Colors", + values: { + "base": "#212121", + "light": "#727272" + } + }, + "background": { + name: "Background Colors", + values: { + "base": "#fff" + } + } }; return chassis; } ) ); From 2cb91bea4d84e85aba652c358159ed01a2df9beb Mon Sep 17 00:00:00 2001 From: Sarah Frisk Date: Tue, 26 Jan 2016 10:06:13 -0500 Subject: [PATCH 2/4] Palette: Fixed spacing and variable names --- scss/variables/colors.js | 32 ++++++++++++++++---------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/scss/variables/colors.js b/scss/variables/colors.js index dea3f9c..4944175 100644 --- a/scss/variables/colors.js +++ b/scss/variables/colors.js @@ -20,53 +20,53 @@ chassis.colors = { }, "success": { name: "Success Colors", - values: { + value: { "base": "#8BC34A", "light": "#9CCC65", "dark": "#8BC34A", "darker": "#689F38" } }, - "warning": { + "warning": { name: "Warning Colors", value: { "base": "#FF9800", "light": "#FFA726", "dark": "#FB8C00", "darker": "#F57C00" - } - }, + } + }, "info": { name: "Info Colors", - values: { + value: { "base": "#00BCD4", "light": "#26C6DA", "dark": "#00ACC1", "darker": "#0097A7" } - }, - "error": { + }, + "error": { name: "Error Colors", - values: { + value: { "base": "#F44336", "light": "#EF5350", "dark": "#E53935", "darker": "#D32F2F" } - }, - "text": { + }, + "text": { name: "Text Colors", - values: { + value: { "base": "#212121", "light": "#727272" } - }, - "background": { + }, + "background": { name: "Background Colors", - values: { + value: { "base": "#fff" - } - } + } + } }; return chassis; } ) ); From 5c1afc2799497f3f295b6bab8286822751606f85 Mon Sep 17 00:00:00 2001 From: Sarah Frisk Date: Tue, 16 Feb 2016 09:12:21 -0500 Subject: [PATCH 3/4] Palette: Update colors to have better contrasting --- scss/variables/colors.js | 55 +++++++++++++++++++++++----------------- 1 file changed, 32 insertions(+), 23 deletions(-) diff --git a/scss/variables/colors.js b/scss/variables/colors.js index 4944175..133c1e5 100644 --- a/scss/variables/colors.js +++ b/scss/variables/colors.js @@ -9,6 +9,15 @@ }( this, function( chassis ) { chassis.colors = { + "default": { + name: "Default Colors", + value: { + "base": "transparent", + "light": "transparent", + "dark": "transparent", + "darker": "transparent" + } + }, "primary": { name: "Primary Colors", value: { @@ -21,31 +30,31 @@ chassis.colors = { "success": { name: "Success Colors", value: { - "base": "#8BC34A", - "light": "#9CCC65", - "dark": "#8BC34A", - "darker": "#689F38" + "base": "#43A047", + "light": "#4CAF50", + "dark": "#388E3C", + "darker": "#2E7D32" } }, - "warning": { + "warning": { name: "Warning Colors", value: { - "base": "#FF9800", - "light": "#FFA726", - "dark": "#FB8C00", - "darker": "#F57C00" - } - }, + "base": "#FF5722", + "light": "#FF7043", + "dark": "#F4511E", + "darker": "#E64A19" + } + }, "info": { name: "Info Colors", value: { - "base": "#00BCD4", - "light": "#26C6DA", - "dark": "#00ACC1", - "darker": "#0097A7" + "base": "#039BE5", + "light": "#03A9F4", + "dark": "#0288D1", + "darker": "#0277BD" } - }, - "error": { + }, + "error": { name: "Error Colors", value: { "base": "#F44336", @@ -53,20 +62,20 @@ chassis.colors = { "dark": "#E53935", "darker": "#D32F2F" } - }, - "text": { + }, + "text": { name: "Text Colors", value: { "base": "#212121", "light": "#727272" } - }, - "background": { + }, + "background": { name: "Background Colors", value: { "base": "#fff" - } - } + } + } }; return chassis; } ) ); From 08b1db73dd6f6b2eaae1f464d5ab8c22229e9a05 Mon Sep 17 00:00:00 2001 From: Sarah Frisk Date: Tue, 16 Feb 2016 09:45:18 -0500 Subject: [PATCH 4/4] Palette: Add default colors --- scss/variables/colors.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/scss/variables/colors.js b/scss/variables/colors.js index 133c1e5..4e06351 100644 --- a/scss/variables/colors.js +++ b/scss/variables/colors.js @@ -12,10 +12,10 @@ chassis.colors = { "default": { name: "Default Colors", value: { - "base": "transparent", - "light": "transparent", - "dark": "transparent", - "darker": "transparent" + "base": "#FAFAFA", + "light": "#FFFFFF", + "dark": "#FAFAFA", + "darker": "#F5F5F5" } }, "primary": {