From c9c7cc274ed3313a9f1045ff395d5c22f22fbed0 Mon Sep 17 00:00:00 2001 From: Brandon Albright Date: Thu, 20 May 2021 12:27:56 -0500 Subject: [PATCH 1/5] updated colors page, and added css file for same --- docs/Gemfile.lock | 32 +++++++++++++++++--------------- 1 file changed, 17 insertions(+), 15 deletions(-) diff --git a/docs/Gemfile.lock b/docs/Gemfile.lock index b26c3de..c9c9d9b 100644 --- a/docs/Gemfile.lock +++ b/docs/Gemfile.lock @@ -1,7 +1,7 @@ GEM remote: https://rubygems.org/ specs: - activesupport (6.0.3.6) + activesupport (6.0.3.7) concurrent-ruby (~> 1.0, >= 1.0.2) i18n (>= 0.7, < 2) minitest (~> 5.1) @@ -17,28 +17,26 @@ GEM commonmarker (0.17.13) ruby-enum (~> 0.5) concurrent-ruby (1.1.8) - connection_pool (2.2.5) dnsruby (1.61.5) simpleidn (~> 0.1) em-websocket (0.5.2) eventmachine (>= 0.12.9) http_parser.rb (~> 0.6.0) - ethon (0.13.0) + ethon (0.14.0) ffi (>= 1.15.0) + eventmachine (1.2.7) eventmachine (1.2.7-x64-mingw32) - excon (0.80.1) execjs (2.7.0) - faraday (1.4.0) - faraday-excon (~> 1.0) + faraday (1.4.1) + faraday-excon (~> 1.1) faraday-net_http (~> 1.0) - faraday-net_http_persistent (~> 1.0) + faraday-net_http_persistent (~> 1.1) multipart-post (>= 1.2, < 3) ruby2_keywords (>= 0.0.4) - faraday-excon (1.0.0) - excon (>= 0.27.4) + faraday-excon (1.1.0) faraday-net_http (1.0.1) - faraday-net_http_persistent (1.0.3) - net-http-persistent (>= 3.1) + faraday-net_http_persistent (1.1.0) + ffi (1.15.0) ffi (1.15.0-x64-mingw32) forwardable-extended (2.6.0) gemoji (3.0.1) @@ -219,11 +217,13 @@ GEM jekyll-seo-tag (~> 2.1) minitest (5.14.4) multipart-post (2.1.1) - net-http-persistent (4.0.1) - connection_pool (~> 2.2) + nokogiri (1.11.3-arm64-darwin) + racc (~> 1.4) nokogiri (1.11.3-x64-mingw32) racc (~> 1.4) - octokit (4.20.0) + nokogiri (1.11.3-x86_64-darwin) + racc (~> 1.4) + octokit (4.21.0) faraday (>= 0.9) sawyer (~> 0.8.0, >= 0.5.3) pathutil (0.16.2) @@ -261,12 +261,14 @@ GEM tzinfo (>= 1.0.0) unf (0.1.4) unf_ext + unf_ext (0.0.7.7) unf_ext (0.0.7.7-x64-mingw32) unicode-display_width (1.7.0) wdm (0.1.1) zeitwerk (2.4.2) PLATFORMS + universal-darwin-20 x64-mingw32 DEPENDENCIES @@ -278,4 +280,4 @@ DEPENDENCIES wdm (~> 0.1.1) BUNDLED WITH - 2.2.14 + 2.2.17 From 5a398d5042069524340bc38968aa695c8b09f276 Mon Sep 17 00:00:00 2001 From: Brandon Albright Date: Thu, 20 May 2021 12:43:25 -0500 Subject: [PATCH 2/5] didn't push changes correctly --- docs/pages/type.html | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 docs/pages/type.html diff --git a/docs/pages/type.html b/docs/pages/type.html new file mode 100644 index 0000000..d1d9bc5 --- /dev/null +++ b/docs/pages/type.html @@ -0,0 +1,6 @@ +--- +layout: default +title: Type +permalink: "/type" +--- +

The type page

\ No newline at end of file From edb15bcd94857aa9c21548006c14830652183217 Mon Sep 17 00:00:00 2001 From: Brandon Albright Date: Thu, 20 May 2021 12:54:34 -0500 Subject: [PATCH 3/5] corrected, was writing under ignored files --- docs/css/style.scss | 12 +++++ docs/pages/colors.html | 119 ++++++++++++++++++++++++++++++++++++++++- 2 files changed, 130 insertions(+), 1 deletion(-) diff --git a/docs/css/style.scss b/docs/css/style.scss index 2c930ae..ff71917 100644 --- a/docs/css/style.scss +++ b/docs/css/style.scss @@ -99,4 +99,16 @@ nav { line-height: 1.625rem; margin-bottom: 2rem; } +} + +.color-box { + border: 1px solid #000000; + box-sizing: border-box; + height: 114px; + width: 114px; +} + +.box { + box-sizing: border-box; + padding: 20px; } \ No newline at end of file diff --git a/docs/pages/colors.html b/docs/pages/colors.html index 1798b8f..fc9a26f 100644 --- a/docs/pages/colors.html +++ b/docs/pages/colors.html @@ -3,4 +3,121 @@ title: Colors permalink: "/colors" --- -

The colors page

\ No newline at end of file +
+

Logo Color

+

Use these colors for any graphics where type doesn’t need to be read.

+
+
+
+

Main Logo Green

+

#10A882

+
+
+
+

Primary Colors

+

Use these colors for any graphics where type does need to be read.

+
+
+
+
+

Dark Green

+

#126B55

+
+
+
+
+

Background Grey

+

#D2D7DF

+
+
+
+
+

Background White

+

#FFFFFF

+
+
+
+
+

Charcoal

+

#444444

+
+
+
+
+

Black

+

#000000

+
+
+
+
+

Button Pressed

+

#093228

+
+
+
+
+

Button Deactivated

+

#909090

+
+
+
+
+

CEIC Purple

+

#4C327D

+
+
+
+
+

Type Usage with Colors

+
+
+
+

+ Aa
#FFFFFF +

+
+
+
+
+

+ Aa
#126B55 +

+
+
+
+
+

+ Aa
#000000 +

+
+
+
+
+

+ Aa
#000000 +

+
+
+
+
+

+ Aa
#FFFFFF +

+
+
+
+
+

+ Aa
#FFFFFF +

+
+
+
+
+

+ Aa
#4C327D +

+
+
+
+
\ No newline at end of file From b659c20585660525e82af242c5d01f4d4a7a953c Mon Sep 17 00:00:00 2001 From: Brandon Albright Date: Wed, 26 May 2021 14:24:04 -0500 Subject: [PATCH 4/5] add type and buttons page --- docs/_includes/head.html | 2 + docs/_includes/nav.html | 1 + docs/css/style.scss | 193 ++++++++++++++++++++++++++++++++++++++- docs/pages/buttons.html | 39 +++++++- docs/pages/type.html | 43 ++++++++- 5 files changed, 273 insertions(+), 5 deletions(-) diff --git a/docs/_includes/head.html b/docs/_includes/head.html index af586ea..b15c43b 100644 --- a/docs/_includes/head.html +++ b/docs/_includes/head.html @@ -7,6 +7,8 @@ {{ site.title }} + + diff --git a/docs/_includes/nav.html b/docs/_includes/nav.html index 7e67752..d1521e8 100644 --- a/docs/_includes/nav.html +++ b/docs/_includes/nav.html @@ -12,6 +12,7 @@ Buttons Cards Colors + Type

Atoms

diff --git a/docs/css/style.scss b/docs/css/style.scss index ff71917..bbd4ad8 100644 --- a/docs/css/style.scss +++ b/docs/css/style.scss @@ -85,14 +85,43 @@ nav { } .main { + font-family: 'Karla', Helvetica; h1 { - font-size: 2.625rem; - font-weight: 600; - line-height: 3rem; + font-family: 'Karla', Helvetica; + font-size: 38px; + font-weight: bold; + line-height: 44px; margin-top: 0; } + h2 { + font-family: 'Karla', Helvetica; + font-weight: bold; + font-size: 24px; + line-height: 28px; + } + + h3 { + font-family: 'Karla', Helvetica; + font-weight: normal; + font-size: 20px; + line-height: 23px; + text-transform: uppercase; + } + + p { + font-size: 18px; + line-height: 21px; + } + + b { + font-weight: bold; + font-size: 16px; + line-height: 19px; + } + + .intro-text { color: rgb(124, 124, 124); font-size: 1.25rem; @@ -111,4 +140,162 @@ nav { .box { box-sizing: border-box; padding: 20px; +} + +.type-box { + width: 275px; + height: auto; + padding: 20px; +} + +.example-buttons { + width: 364px; + display: flex; + justify-content: space-between; +} + +.active-button { + background: #FFFFFF; + border: 1.5px solid #126B55; + border-radius: 5px; + width: 101px; + height: 35px; + font-family: Karla; + font-style: normal; + font-weight: bold; + font-size: 16px; + line-height: 19px; + text-align: center; + color: #093228; + + &:hover { + background: #126B55; + box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25); + color: #FFFFFF; + } + + &:focus { + background: #093228; + box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25); + color: rgba(255, 255, 255, 0.5); + } + + &:disabled{ + background: #FFFFFF; + border: 1.5px solid #BABABA; + } +} + +.hover-button { + border: 1.5px solid #126B55; + border-radius: 5px; + width: 101px; + height: 35px; + font-family: Karla; + font-style: normal; + font-weight: bold; + font-size: 16px; + line-height: 19px; + text-align: center; + background: #126B55; + box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25); + color: #FFFFFF; +} + +.pressed-button { + border: 1.5px solid #126B55; + border-radius: 5px; + width: 101px; + height: 35px; + font-family: Karla; + font-style: normal; + font-weight: bold; + font-size: 16px; + line-height: 19px; + text-align: center; + background: #093228; + box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25); + color: rgba(255, 255, 255, 0.5); +} + +.disabled-button { + border-radius: 5px; + width: 101px; + height: 35px; + font-family: Karla; + font-style: normal; + font-weight: bold; + font-size: 16px; + line-height: 19px; + text-align: center; + background: #FFFFFF; + border: 1.5px solid #BABABA; +} + +.active-button-light { + background: #126B55; + border: 1.5px solid #126B55; + border-radius: 5px; + width: 101px; + height: 35px; + font-family: Karla; + font-style: normal; + font-weight: bold; + font-size: 16px; + line-height: 19px; + text-align: center; + color: #FFFFFF; + + &:hover { + background: #FFFFFF; + box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25); + color: #093228; + } +} + +.hover-button-light { + border: 1.5px solid #126B55; + border-radius: 5px; + width: 101px; + height: 35px; + font-family: Karla; + font-style: normal; + font-weight: bold; + font-size: 16px; + line-height: 19px; + text-align: center; + background: #FFFFFF; + box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25); + color: #093228; +} + +.pressed-button-light { + border: 1.5px solid #126B55; + border-radius: 5px; + width: 101px; + height: 35px; + font-family: Karla; + font-style: normal; + font-weight: bold; + font-size: 16px; + line-height: 19px; + text-align: center; + background: #D2D7DF; + box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.25); + color: rgba(0, 0, 0, 0.5); +} + +.disabled-button-light { + border: none; + border-radius: 5px; + width: 101px; + height: 35px; + font-family: Karla; + font-style: normal; + font-weight: bold; + font-size: 16px; + line-height: 19px; + text-align: center; + background: #909090; + color: #FFFFFF; } \ No newline at end of file diff --git a/docs/pages/buttons.html b/docs/pages/buttons.html index 61757c1..8d25514 100644 --- a/docs/pages/buttons.html +++ b/docs/pages/buttons.html @@ -3,4 +3,41 @@ title: Buttons permalink: "/buttons" --- -

The buttons page

\ No newline at end of file +
+

on dark backgrounds

+
+

Active

+ +
+
+

Hover

+ +
+
+

Pressed

+ +
+
+

Deactivated

+ +
+
+
+

on light backgrounds

+
+

Active

+ +
+
+

Hover

+ +
+
+

Pressed

+ +
+
+

Deactivated

+ +
+
\ No newline at end of file diff --git a/docs/pages/type.html b/docs/pages/type.html index d1d9bc5..88d7400 100644 --- a/docs/pages/type.html +++ b/docs/pages/type.html @@ -3,4 +3,45 @@ title: Type permalink: "/type" --- -

The type page

\ No newline at end of file +
+ +
+

PRIMARY TYPEFACE

+

Karla

+

abcdefghijklmnopqrstuvwxyz

+
+ +
+

Type Sizes

+

H1 Bold, 38px

+

H2 Bold, 24px

+

H3 Regular, 20px

+

P Regular, 18px

+ B Bold, 16px +
+ +
+

Line Height

+

Line height for Heading One is 44px.

+

Line height for Heading Two is 28px

+

line height for heading three is 23px

+

Line height for Paragraph is 21px

+
+
+
+ +
+

secondary typeface (if primary isn't available)

+

Helvetica

+

abcdefghijklmnopqrstuvwxyz

+
+ +
+

type sizes

+

H1 Bold, 38px

+

H2 Bold, 24px

+

H3 Regular, 20px

+

P Regular, 18px

+ B Bold, 16px +
+
\ No newline at end of file From b9c2ea0c2e06f9c8cd44b745743dacfbc865a5fc Mon Sep 17 00:00:00 2001 From: Brandon Albright Date: Wed, 9 Jun 2021 19:04:27 -0500 Subject: [PATCH 5/5] Update type.html --- docs/pages/type.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/pages/type.html b/docs/pages/type.html index 88d7400..99e62a6 100644 --- a/docs/pages/type.html +++ b/docs/pages/type.html @@ -44,4 +44,4 @@

H3 Regular, 20px

P Regular, 18px

B Bold, 16px
- \ No newline at end of file +