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 --- package.json | 2 +- src/assets/logo.png | Bin 0 -> 113640 bytes src/html/index.html | 250 +++++++++++++++++++++++++++------------------------ src/scss/index.scss | 69 ++++++++++++-- src/scss/palette.css | 9 ++ 5 files changed, 203 insertions(+), 127 deletions(-) create mode 100644 src/assets/logo.png create mode 100644 src/scss/palette.css diff --git a/package.json b/package.json index ea756c1..6313564 100644 --- a/package.json +++ b/package.json @@ -16,7 +16,7 @@ "scripts": { "start": "run-p serve watch", "css:dev": "node-sass src/scss/index.scss dist/css/index.css", - "js:dev": "cp -r src/js dist/js", + "js:dev": "cp -r src/js/* dist/js", "clean": "rm -rf dist/", "mkdirs": "mkdir -p dist/js && mkdir -p dist/css", "copy:assets": "cp -r src/assets/* dist/", diff --git a/src/assets/logo.png b/src/assets/logo.png new file mode 100644 index 0000000..da51050 Binary files /dev/null and b/src/assets/logo.png differ diff --git a/src/html/index.html b/src/html/index.html index 777d1ef..08a7c84 100644 --- a/src/html/index.html +++ b/src/html/index.html @@ -19,7 +19,7 @@ @@ -50,7 +50,7 @@
-
-
+
-
-

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris eget lobortis erat. Vivamus venenatis nec quam vitae vulputate. Class aptent taciti sociosqu ad litora torquent @@ -82,12 +81,13 @@ Phasellus accumsan vitae elit sed fringilla. Nulla porttitor magna eget ipsum ultricies malesuada quis a ipsum. -

-

+
-
-
- LOGO +
+
+
+ +
@@ -96,125 +96,140 @@
-
+
+
-
-
-
-

- Subject Tutoring -

-

- Tutoring for specific courses or disciplines. Click - here for a full list of courses covered. -

+
+
+
+
+

+ Subject Tutoring +

+

+ Tutoring for specific courses or disciplines. Click + here for a full list of courses covered. +

+
+
-
-
-
-

- Time Management -

-

- Personalized plans for managing academics, - extracurriculars, and other commitments. -

+
+
+
+

+ Time Management +

+

+ Personalized plans for managing academics, + extracurriculars, and other commitments. +

+
+
-
-
-
-
-

- Study Skills -

-

- Learn how to make the most of your study time. -

+
+
+
+
+

+ Study Skills +

+

+ Learn how to make the most of your study time. +

+
+
-
-
-
-

- Academic Coaching -

-

- Time management and study skills blended with - continuing accountability. -

+
+
+
+

+ Academic Coaching +

+

+ Time management and study skills blended with + continuing accountability. +

+
+
-
-
-
-
-

- College Prep -

-

- ACT & SAT preparation and assistance with - college application essays. -

+
+
+
+
+

+ College Prep +

+

+ ACT & SAT preparation and assistance with + college application essays. +

+
+
-
-
-
-

- College-Level Writing -

-

- Get a head start on meeting professors' - expectations. -

+
+
+
+

+ College-Level Writing +

+

+ Get a head start on meeting professors' + expectations. +

+
+
-
-
-
-
-

- Group Webinars -

-

- Participate in general workshops and pre-planned - courses from the comfort of home. -

+
+
+
+
+

+ Group Webinars +

+

+ Participate in general workshops and pre-planned + courses from the comfort of home. +

+
+
-
-
-
-

- Parent Consultations -

-

- For parents seeking advice for facilitating their child's learning. -

+
+
+
+

+ Parent Consultations +

+

+ For parents seeking advice for facilitating their child's learning. +

+
+
-
+
-
+
-
- +
-
-

School is tricky, and there is no universal pathway @@ -256,25 +271,24 @@

-- Amy Carpenter

-
-
-
-
-

- Lorem ipsum dolor sit amet, consectetur adipiscing elit. - Mauris eget lobortis erat. Vivamus venenatis nec quam vitae - vulputate. Class aptent taciti sociosqu ad litora torquent - per conubia nostra, per inceptos himenaeos. -

-
-
-
+
@@ -334,6 +348,6 @@
- + 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