From 7a191606cbf5cd290dad1f89cc6f007a87b40231 Mon Sep 17 00:00:00 2001 From: Adam Carpenter Date: Sat, 14 Mar 2020 21:03:04 -0400 Subject: changed up theming, added fonts, logo, etc --- src/scss/index.scss | 69 ++++++++++++++++++++++++++++++++++++++++++++++------ src/scss/palette.css | 9 +++++++ 2 files changed, 70 insertions(+), 8 deletions(-) create mode 100644 src/scss/palette.css (limited to 'src/scss') diff --git a/src/scss/index.scss b/src/scss/index.scss index ac1ab6d..596993e 100644 --- a/src/scss/index.scss +++ b/src/scss/index.scss @@ -1,14 +1,24 @@ @charset "utf-8"; // Import Google Fonts -@import url('https://fonts.googleapis.com/css?family=Nunito:400,700'); +//@import url('https://fonts.googleapis.com/css?family=Nunito:400,700'); +@import url('https://fonts.googleapis.com/css?family=PT+Sans:400,400i,700&display=swap'); -// Set brand colors -$pine-green: #01646d; -$midnight-green: #114b5f; -$eton-blue: #88d498; -$pastel-gray: #c6dabf; -$isabelline: #f7f4ea; +// Palette +//$pine-green: #01646d; +//$midnight-green: #114b5f; +//$eton-blue: #88d498; +//$pastel-gray: #c6dabf; +//$isabelline: #f7f4ea; +$darkteal: rgb(0, 100, 108); +$green: rgb(88, 169, 143); +$darkerteal: rgb(29, 133, 137); +$gray: rgb(157, 210, 211); +$teal: rgb(58, 165, 166); +$cyan: rgb(156, 210, 210); +$darkgray: rgb(127, 177, 181); +$darkgreen: rgb(59, 136, 114); +$yellow: rgb(186, 214, 187); // Update Bulma's global variables // $primary: $pine-green; @@ -19,8 +29,10 @@ $isabelline: #f7f4ea; // $danger: $red // $dark: $grey-darker // $text: $grey-dark -// $family-sans-serif: "Nunito", sans-serif; +$family-sans-serif: "PT Sans", sans-serif; // $hr-background-color: $primary; +$title-color: white; +//$subtitle-color: white; // $body-background-color: $isabelline; @@ -33,6 +45,43 @@ $isabelline: #f7f4ea; @import "../../node_modules/bulma/sass/layout/_all.sass"; @import "../../node_modules/bulma/sass/grid/_all.sass"; +.darkteal { + background-color: $darkteal; + color: white; +} +.green { + background-color: $green; + color: white; +} +.darkerteal { + background-color: $darkerteal; + color: white; +} +.gray { + background-color: $gray; + color: white; +} +.teal { + background-color: $teal; + color: white; +} +.cyan { + background-color: $cyan; + color: white; +} +.darkgray { + background-color: $darkgray; + color: white; +} +.darkgreen { + background-color: $darkgreen; + color: white; +} +.yellow { + background-color: $yellow; + color: white; +} + .blurb { background-color: white; clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 75% 75%, 75% 100%, 50% 75%, 0% 75%); @@ -43,6 +92,10 @@ $isabelline: #f7f4ea; clip-path: polygon(8% 0%, 100% 0%, 100% 100%, 0% 100%); } +.quiet { + background-color: white; +} + body { background-image: url("/bg.png"); } diff --git a/src/scss/palette.css b/src/scss/palette.css new file mode 100644 index 0000000..66799cd --- /dev/null +++ b/src/scss/palette.css @@ -0,0 +1,9 @@ +/* Generated with GIMP Palette Export */ +.darkteal { color: rgb(0, 100, 108) } +.green { color: rgb(88, 169, 143) } +.darkerteal { color: rgb(29, 133, 137) } +.gray { color: rgb(157, 210, 211) } +.teal { color: rgb(58, 165, 166) } +.cyan { color: rgb(156, 210, 210) } +.darkgray { color: rgb(127, 177, 181) } +.darkgreen { color: rgb(59, 136, 114) } -- cgit v1.2.3