From 2826ef3ebd9834dde139c92fa04a1f243c283e25 Mon Sep 17 00:00:00 2001 From: Atomos821 Date: Sat, 28 Nov 2020 13:13:01 +0100 Subject: [PATCH] Unified styling for www & docs --- docs/assets/css/style.css | 44 +-------- docs/assets/css/style.css.map | 2 +- docs/assets/scss/components/aki-card.scss | 9 +- docs/assets/scss/style.scss | 36 +------- docs/assets/scss/utils/theme.scss | 4 +- docs/assets/scss/utils/typography.scss | 103 ---------------------- www/assets/css/style.css | 52 +++-------- www/assets/css/style.css.map | 2 +- www/assets/scss/components/aki-card.scss | 9 +- www/assets/scss/style.scss | 47 +++------- www/assets/scss/utils/theme.scss | 8 +- www/assets/scss/utils/typography.scss | 103 ---------------------- 12 files changed, 35 insertions(+), 384 deletions(-) delete mode 100644 docs/assets/scss/utils/typography.scss delete mode 100644 www/assets/scss/utils/typography.scss diff --git a/docs/assets/css/style.css b/docs/assets/css/style.css index 4063ad5..f5676f2 100644 --- a/docs/assets/css/style.css +++ b/docs/assets/css/style.css @@ -36,11 +36,7 @@ aki-card, color: #fff; display: flex; flex-direction: column; - font-size: 0.875rem; - letter-spacing: 0.0178571429em; - line-height: 1.25rem; - font-family: "Open Sans", sans-serif; - max-width: calc(25rem - 3rem); + max-width: 60ch; padding: 1.25rem 1.5rem; } aki-card aki-card-title *.aki-card-title, @@ -49,11 +45,8 @@ aki-card *[aki-card-title], *.aki-card *[aki-card-title], *[aki-card] aki-card-title *.aki-card-title, *[aki-card] *[aki-card-title] { - font-family: "Source Sans Pro", sans-serif; font-size: 1.25rem; font-weight: 700; - letter-spacing: 0.009375em; - line-height: 1.75rem; margin-bottom: 1rem; text-transform: uppercase; } @@ -205,41 +198,6 @@ header .right { flex: 1 1 auto; justify-content: flex-end; text-transform: uppercase; - /* - @media (max-width: 64em) { - &.dropdown { - align-items: center; - cursor: pointer; - display: flex; - justify-content: center; - min-width: 4rem; - - float: left; - overflow: hidden; - - &:hover .dropdown-content { - // display: block; - background: $primary; - box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); - display: flex; - flex-direction: column; - padding: 1rem; - right: 0; - top: 5.5rem; - } - - .dropdown-button { - display: initial; - } - - .dropdown-content { - display: none; - position: absolute; - z-index: 1; - } - } - } - */ } header .right .dropdown-button { display: none; diff --git a/docs/assets/css/style.css.map b/docs/assets/css/style.css.map index 427978d..4b7ee1f 100644 --- a/docs/assets/css/style.css.map +++ b/docs/assets/css/style.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../scss/utils/theme.scss","../scss/style.scss","../scss/components/aki-button.scss","../scss/utils/elevation.scss","../scss/components/aki-card.scss","../scss/components/aki-divider.scss","../scss/components/aki-toolbar.scss"],"names":[],"mappings":"AAAQ;ACSA;ACTR;AAAA;AAAA;EAGI,kBFQK;EEPL;EACA;EACA,YCJW;EDKX,OFKQ;EEJR;EACA;EACA;EACA;EACA;;AAGA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;EACI,YFfE;EEgBF,YCbO;EDcP,OFhBK;;;AINb;AAAA;AAAA;EAGI,YJEM;EIDN,YDHW;ECIX;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGI;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;AAAA;AAAA;EACI,YDrBO;;;AERf;AAAA;EAEI,YLIS;EKHT;EACA;EACA;;;ACLJ;AAAA;AAAA;EAGI;EACA,kBNCM;EMCN,YHFW;EGGX,ONDS;EMET;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACI,ONZK;EMaL;;AAGJ;AAAA;AAAA;EACI;EACA;;AAEA;AAAA;AAAA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;EACI;;;AL1BhB;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;AAAA;AAAA;AAAA;AAAA;EAKI;EACA;EACA;EACA;;;AAGJ;EAEI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;AAAA;EAEI;;;AAOA;AAAA;AAAA;EAGI;EACA;EACA;EACA;;AAIA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EANJ;IAOQ;;;AAKZ;EACI;EACA;EACA;AAOA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AALA;EACI;;;AA2CZ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI,YD3JE;EC4JF,YE7JO;EF8JP,OD5JK;EC6JL;EACA;EACA;EACA;;AAEA;EACI;;AAEA;AAAA;EAEI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI,ODhLD;;ACkLC;EACI;;AAGJ;EACI,ODrLX;;AC2LO;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;;AAIA;EACI;;AAIA;EACI;;AAQxB;EACI,YD/NI;ECgOJ,OD/NO;ECgOP;EACA;EACA;;AAEA;EAPJ;IAQQ;IACA;;;;AAKZ;EACI,OD1OK;EC2OL;;;AAWA;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAIR;EACI;;AAGJ;AAAA;EAEI;;AAGJ;EACI,YA7BS;EA8BT,OA7BY;;AAgChB;EACI;;AAGJ;AAAA;EAEI,eDjRQ","file":"style.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../scss/utils/theme.scss","../scss/style.scss","../scss/components/aki-button.scss","../scss/utils/elevation.scss","../scss/components/aki-card.scss","../scss/components/aki-divider.scss","../scss/components/aki-toolbar.scss"],"names":[],"mappings":"AAAQ;ACSA;ACTR;AAAA;AAAA;EAGI,kBFQK;EEPL;EACA;EACA,YCJW;EDKX,OFKQ;EEJR;EACA;EACA;EACA;EACA;;AAGA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;EACI,YFfE;EEgBF,YCbO;EDcP,OFhBK;;;AINb;AAAA;AAAA;EAGI,YJEM;EIDN,YDHW;ECIX;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGI;EACA;EACA;EACA;;AAGJ;AAAA;AAAA;EACI,YDdO;;;AERf;AAAA;EAEI,YLIS;EKHT;EACA;EACA;;;ACLJ;AAAA;AAAA;EAGI;EACA,kBNCM;EMCN,YHFW;EGGX,ONDS;EMET;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACI,ONZK;EMaL;;AAGJ;AAAA;AAAA;EACI;EACA;;AAEA;AAAA;AAAA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;EACI;;;AL1BhB;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;AAAA;AAAA;AAAA;AAAA;EAKI;EACA;EACA;EACA;;;AAGJ;EAEI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;AAAA;EAEI;;;AAOA;AAAA;AAAA;EAGI;EACA;EACA;EACA;;AAIA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EANJ;IAOQ;;;AAKZ;EACI;EACA;EACA;;AAEA;EACI;;;AASZ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI,YDzHE;EC0HF,YE3HO;EF4HP,OD1HK;EC2HL;EACA;EACA;EACA;;AAEA;EACI;;AAEA;AAAA;EAEI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI,OD9ID;;ACgJC;EACI;;AAGJ;EACI,ODnJX;;ACyJO;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;;AAIA;EACI;;AAIA;EACI;;AAQxB;EACI,YD7LI;EC8LJ,OD7LO;EC8LP;EACA;EACA;;AAEA;EAPJ;IAQQ;IACA;;;;AAKZ;EACI,ODxMK;ECyML;;;AAWA;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAIR;EACI;;AAGJ;AAAA;EAEI;;AAGJ;EACI,YA7BS;EA8BT,OA7BY;;AAgChB;EACI;;AAGJ;AAAA;EAEI,eD/OQ","file":"style.css"} \ No newline at end of file diff --git a/docs/assets/scss/components/aki-card.scss b/docs/assets/scss/components/aki-card.scss index 2e0efec..fa228cd 100644 --- a/docs/assets/scss/components/aki-card.scss +++ b/docs/assets/scss/components/aki-card.scss @@ -7,21 +7,14 @@ aki-card, color: $on-primary; display: flex; flex-direction: column; - font-size: .875rem; - letter-spacing: .0178571429em; - line-height: 1.25rem; - font-family: $font-open-sans, sans-serif; - max-width: calc(25rem - 3rem); + max-width: 60ch; // Ideal character count per row. padding: 1.25rem 1.5rem; aki-card-title *.aki-card-title, *[aki-card-title] { - font-family: $font-source-sans-pro, sans-serif; font-size: 1.25rem; font-weight: 700; - letter-spacing: .009375em; - line-height: 1.75rem; margin-bottom: 1rem; text-transform: uppercase; } diff --git a/docs/assets/scss/style.scss b/docs/assets/scss/style.scss index 54a11e6..2a9abdb 100644 --- a/docs/assets/scss/style.scss +++ b/docs/assets/scss/style.scss @@ -111,41 +111,7 @@ header { } // TODO: Redo header media query (vertical res > 768px -> Dropdown or moved to sidenav toggle) - /* - @media (max-width: #{$bp-medium}) { - &.dropdown { - align-items: center; - cursor: pointer; - display: flex; - justify-content: center; - min-width: 4rem; - - float: left; - overflow: hidden; - - &:hover .dropdown-content { - // display: block; - background: $primary; - box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); - display: flex; - flex-direction: column; - padding: 1rem; - right: 0; - top: 5.5rem; - } - - .dropdown-button { - display: initial; - } - - .dropdown-content { - display: none; - position: absolute; - z-index: 1; - } - } - } - */ + // See www for reference on previous code. } } diff --git a/docs/assets/scss/utils/theme.scss b/docs/assets/scss/utils/theme.scss index 21e9b90..c755839 100644 --- a/docs/assets/scss/utils/theme.scss +++ b/docs/assets/scss/utils/theme.scss @@ -12,8 +12,8 @@ $on-secondary: #fff; $accent: #ffc107; $on-accent: #000; -$font-source-sans-pro: 'Source Sans Pro'; -$font-open-sans: 'Open Sans'; +// $font-source-sans-pro: 'Source Sans Pro'; +// $font-open-sans: 'Open Sans'; $base-font-size: 16px; $base-line-height: 1.5; diff --git a/docs/assets/scss/utils/typography.scss b/docs/assets/scss/utils/typography.scss deleted file mode 100644 index 026e855..0000000 --- a/docs/assets/scss/utils/typography.scss +++ /dev/null @@ -1,103 +0,0 @@ -// == Typography -h1, -.headline-1, -.heading-1 { - font-size: 6rem; - font-weight: 300; - letter-spacing: -.015625em; - line-height: 6rem; -} - -h2, -.headline-2, -.heading-2 { - font-size: 3.75rem; - font-weight: 300; - letter-spacing: -.0083333333em; - line-height: 3.75rem; -} - -h3, -.headline-3, -.heading-3 { - font-size: 3rem; - font-weight: 400; - letter-spacing: normal; - line-height: 3.125rem; -} - -h4, -.headline-4, -.heading-4 { - font-size: 2.125rem; - font-weight: 400; - letter-spacing: .0073529412em; - line-height: 2.5rem; -} - -h5, -.headline-5, -.heading-5 { - font-size: 1.5rem; - font-weight: 400; - letter-spacing: normal; - line-height: 2rem; -} - -h6, -.headline-6, -.heading-6 { - font-size: 1.25rem; - font-weight: 500; - letter-spacing: .125em; - line-height: 2rem; -} - -.subtitle-1 { - font-size: 1rem; - font-weight: 400; - letter-spacing: .009375em; - line-height: 1.75rem; -} - -.subtitle-2 { - font-size: .875rem; - font-weight: 500; - letter-spacing: .0071428571em; - line-height: 1.375rem; -} - -.body-1 { - font-size: 1rem; - font-weight: 400; - letter-spacing: .03125em; - line-height: 1.5rem; -} - -.body-2 { - font-size: .875rem; - font-weight: 400; - letter-spacing: .0178571429em; - line-height: 1.25rem; -} - -.button { - font-size: .875rem; - font-weight: 500; - letter-spacing: .0892857143em; - line-height: 2.25rem; -} - -.caption { - font-size: .75rem; - font-weight: 400; - letter-spacing: .0333333333em; - line-height: 1.25rem; -} - -.overline { - font-size: .75rem; - font-weight: 500; - letter-spacing: .1666666667em; - line-height: 2rem; -} \ No newline at end of file diff --git a/www/assets/css/style.css b/www/assets/css/style.css index 1671477..6dff012 100644 --- a/www/assets/css/style.css +++ b/www/assets/css/style.css @@ -22,7 +22,7 @@ aki-button:hover:not(:active), aki-button:active, *[aki-button]:active, *.aki-button:active { - background: #121212; + background: #080808; box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12); color: #fff; } @@ -30,17 +30,13 @@ aki-button:active, aki-card, *.aki-card, *[aki-card] { - background: #121212; + background: #080808; box-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 1px 3px 0 rgba(0, 0, 0, 0.12); border-radius: 0.125rem; color: #fff; display: flex; flex-direction: column; - font-size: 0.875rem; - letter-spacing: 0.0178571429em; - line-height: 1.25rem; - font-family: "Open Sans", sans-serif; - max-width: calc(25rem - 3rem); + max-width: 60ch; padding: 1.25rem 1.5rem; } aki-card aki-card-title *.aki-card-title, @@ -49,11 +45,8 @@ aki-card *[aki-card-title], *.aki-card *[aki-card-title], *[aki-card] aki-card-title *.aki-card-title, *[aki-card] *[aki-card-title] { - font-family: "Source Sans Pro", sans-serif; font-size: 1.25rem; font-weight: 700; - letter-spacing: 0.009375em; - line-height: 1.75rem; margin-bottom: 1rem; text-transform: uppercase; } @@ -75,7 +68,7 @@ aki-toolbar, *[aki-toolbar], *.aki-toolbar { align-items: center; - background-color: #121212; + background-color: #080808; box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12); color: #fff; display: flex; @@ -102,7 +95,7 @@ aki-toolbar nav, aki-toolbar nav a, *[aki-toolbar] nav a, *.aki-toolbar nav a { - border-bottom: 0.25rem solid #121212; + border-bottom: 0.25rem solid #080808; cursor: pointer; padding: 1rem; letter-spacing: 0.0178571429em; @@ -176,22 +169,6 @@ small, font-size: 0.75rem; } -/* -html { - font-family: 'Source Sans Pro', sans-serif; - font-size: $base-font-size; -} - -body { - display: flex; - flex-direction: column; - height: 100vh; - margin: 0; - padding: 0; - position: absolute; - width: 100vw; -} -*/ header .left, header .center, header .right { @@ -200,6 +177,10 @@ header .right { height: calc(100% - 2rem); padding: 1rem; } +header .center, +header .right { + text-transform: uppercase; +} header .left .logo { display: block; filter: invert(1); @@ -208,17 +189,10 @@ header .left .logo { } header .left .title { font-size: 1.75rem; + font-weight: 700; letter-spacing: 0.03125em; margin-left: 1rem; } -header .left .title span:last-child { - margin-left: 0.5rem; -} -@media (max-width: 64em) { - header .left .title span:first-child { - display: none; - } -} @media (max-width: 48em) { header .left .title { margin-left: 0; @@ -267,7 +241,7 @@ header .right .dropdown-button { overflow: hidden; } header .right.dropdown:hover .dropdown-content { - background: #121212; + background: #080808; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); display: flex; flex-direction: column; @@ -307,7 +281,7 @@ main .bg-video { z-index: -99; } main .bg-video .wrapper { - background-color: #282828; + background-color: #1f1f1f; height: 100%; width: 100%; z-index: -98; @@ -399,7 +373,7 @@ div[overlay-menu-content][closed] { .view[home] [aki-button] { font-size: 1.25rem; letter-spacing: 0.009375em; - padding: 0.75rem 1.5rem; + padding: 0.5rem 1.25rem; } .view[home] .tagline { bottom: 4rem; diff --git a/www/assets/css/style.css.map b/www/assets/css/style.css.map index 840748e..a7b2cce 100644 --- a/www/assets/css/style.css.map +++ b/www/assets/css/style.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../scss/utils/theme.scss","../scss/style.scss","../scss/components/aki-button.scss","../scss/utils/elevation.scss","../scss/components/aki-card.scss","../scss/components/aki-divider.scss","../scss/components/aki-toolbar.scss"],"names":[],"mappings":"AAAQ;ACSA;ACTR;AAAA;AAAA;EAGI,kBFQK;EEPL;EACA;EACA,YCJW;EDKX,OFKQ;EEJR;EACA;EACA;EACA;EACA;;AAGA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;EACI,YFfE;EEgBF,YCbO;EDcP,OFhBK;;;AINb;AAAA;AAAA;EAGI,YJEM;EIDN,YDHW;ECIX;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGI;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;AAAA;AAAA;EACI,YDrBO;;;AERf;AAAA;EAEI,YLIS;EKHT;EACA;EACA;;;ACLJ;AAAA;AAAA;EAGI;EACA,kBNCM;EMCN,YHFW;EGGX,ONDS;EMET;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACI,ONZK;EMaL;;AAGJ;AAAA;AAAA;EACI;EACA;;AAEA;AAAA;AAAA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;EACI;;;ALjBhB;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;AAAA;AAAA;AAAA;AAAA;EAKI;EACA;EACA;EACA;;;AAGJ;EAEI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;AAAA;EAEI;;;AAGJ;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmBI;AAAA;AAAA;EAGI;EACA;EACA;EACA;;AAIA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;IACI;;;AAIR;EAfJ;IAgBQ;;;AAIR;EA5BJ;IA6BQ;IACA;IACA;;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EAlBJ;IAmBQ;IACA;;;AAKJ;EACI;;AAGJ;EACI;IACI;IACA;IACA;IACA;IACA;IAEA;IACA;;EAEA;IAEI,YDnLV;ICoLU;IACA;IACA;IACA;IACA;IACA;;EAGJ;IACI;;EAGJ;IACI;IACA;IACA;;;AAKZ;EAvCJ;IAwCQ;;;;AAKZ;EACI;EACA;EACA;EACA;;AAEA;EACI,kBDxNK;ECyNL;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI,kBD5NA;EC6NA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EATJ;IAUQ;;;;AAIR;EACI,ODzQK;EC0QL;;;AAGJ;EACI,kBD9QK;EC+QL;EACA,YE3QY;EF4QZ,ODhRQ;ECiRR;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAIR;EACI;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;;AAGI;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;EACA;;AAIR;EAjBJ;IAmBQ;;;AAMR;EACI;;AAQJ;EACI;EACA;;AAEA;EACI;;AAMR;EACI;EACA;EACA;EACA","file":"style.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../scss/utils/theme.scss","../scss/style.scss","../scss/components/aki-button.scss","../scss/utils/elevation.scss","../scss/components/aki-card.scss","../scss/components/aki-divider.scss","../scss/components/aki-toolbar.scss"],"names":[],"mappings":"AAAQ;ACSA;ACTR;AAAA;AAAA;EAGI,kBFQK;EEPL;EACA;EACA,YCJW;EDKX,OFKQ;EEJR;EACA;EACA;EACA;EACA;;AAGA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;EACI,YFfE;EEgBF,YCbO;EDcP,OFhBK;;;AINb;AAAA;AAAA;EAGI,YJEM;EIDN,YDHW;ECIX;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGI;EACA;EACA;EACA;;AAGJ;AAAA;AAAA;EACI,YDdO;;;AERf;AAAA;EAEI,YLIS;EKHT;EACA;EACA;;;ACLJ;AAAA;AAAA;EAGI;EACA,kBNCM;EMCN,YHFW;EGGX,ONDS;EMET;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACI,ONZK;EMaL;;AAGJ;AAAA;AAAA;EACI;EACA;;AAEA;AAAA;AAAA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACI;;AAGJ;AAAA;AAAA;EACI;;;AL1BhB;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;AAAA;AAAA;AAAA;AAAA;EAKI;EACA;EACA;EACA;;;AAGJ;EAEI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;AAAA;EAEI;;;AAOA;AAAA;AAAA;EAGI;EACA;EACA;EACA;;AAGJ;AAAA;EAEI;;AAIA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EANJ;IAOQ;;;AAIR;EAnBJ;IAoBQ;IACA;IACA;;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EAlBJ;IAmBQ;IACA;;;AAKJ;EACI;;AAGJ;EACI;IACI;IACA;IACA;IACA;IACA;IAEA;IACA;;EAEA;IAEI,YDvJV;ICwJU;IACA;IACA;IACA;IACA;IACA;;EAGJ;IACI;;EAGJ;IACI;IACA;IACA;;;AAKZ;EAvCJ;IAwCQ;;;;AAKZ;EACI;EACA;EACA;EACA;;AAEA;EACI,kBD5LK;EC6LL;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI,kBDhMA;ECiMA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EATJ;IAUQ;;;;AAIR;EACI,OD7OK;EC8OL;;;AAGJ;EACI,kBDlPK;ECmPL;EACA,YE/OY;EFgPZ,ODpPQ;ECqPR;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAIR;EACI;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;;AAGI;EACI;EACA;EACA;;AAIJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;EACA;;AAIR;EAjBJ;IAmBQ;;;AAMR;EACI;;AAQJ;EACI;EACA;;AAEA;EACI;;AAMR;EACI;EACA;EACA;EACA","file":"style.css"} \ No newline at end of file diff --git a/www/assets/scss/components/aki-card.scss b/www/assets/scss/components/aki-card.scss index 2e0efec..fa228cd 100644 --- a/www/assets/scss/components/aki-card.scss +++ b/www/assets/scss/components/aki-card.scss @@ -7,21 +7,14 @@ aki-card, color: $on-primary; display: flex; flex-direction: column; - font-size: .875rem; - letter-spacing: .0178571429em; - line-height: 1.25rem; - font-family: $font-open-sans, sans-serif; - max-width: calc(25rem - 3rem); + max-width: 60ch; // Ideal character count per row. padding: 1.25rem 1.5rem; aki-card-title *.aki-card-title, *[aki-card-title] { - font-family: $font-source-sans-pro, sans-serif; font-size: 1.25rem; font-weight: 700; - letter-spacing: .009375em; - line-height: 1.75rem; margin-bottom: 1rem; text-transform: uppercase; } diff --git a/www/assets/scss/style.scss b/www/assets/scss/style.scss index 65a2c46..a0da056 100644 --- a/www/assets/scss/style.scss +++ b/www/assets/scss/style.scss @@ -9,16 +9,7 @@ @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap'); - -// .text1 { -// font-family: 'Open Sans', sans-serif; -// font-weight: 400; -// } - -// .text2 { -// font-family: 'Source Sans Pro', sans-serif; -// font-weight: 700; -// } +// TODO: Media queries for smaller screens and devices. html { font-size: 100%; // 16px @@ -77,22 +68,7 @@ small, font-size: 0.75rem; } -/* -html { - font-family: 'Source Sans Pro', sans-serif; - font-size: $base-font-size; -} - -body { - display: flex; - flex-direction: column; - height: 100vh; - margin: 0; - padding: 0; - position: absolute; - width: 100vw; -} -*/ +// -------- header { @@ -105,6 +81,11 @@ header { padding: 1rem; } + .center, + .right { + text-transform: uppercase; + } + .left { .logo { display: block; @@ -115,19 +96,10 @@ header { .title { font-size: 1.75rem; + font-weight: 700; letter-spacing: .03125em; margin-left: 1rem; - span:last-child { - margin-left: .5rem; - } - - @media (max-width: #{$bp-medium}) { - span:first-child { - display: none; - } - } - @media (max-width: #{$bp-small}) { margin-left: 0; } @@ -328,7 +300,8 @@ div[overlay-menu-content] { [aki-button] { font-size: 1.25rem; letter-spacing: 0.009375em; - padding: .75rem 1.5rem; + padding: .5rem 1.25rem; + // text-transform: uppercase; } .tagline { diff --git a/www/assets/scss/utils/theme.scss b/www/assets/scss/utils/theme.scss index b9fcfb2..c755839 100644 --- a/www/assets/scss/utils/theme.scss +++ b/www/assets/scss/utils/theme.scss @@ -3,17 +3,17 @@ $background: #fff; $on-background: #000; -$primary: #121212; +$primary: #080808; $on-primary: #fff; -$secondary: #282828; +$secondary: #1f1f1f; $on-secondary: #fff; $accent: #ffc107; $on-accent: #000; -$font-source-sans-pro: 'Source Sans Pro'; -$font-open-sans: 'Open Sans'; +// $font-source-sans-pro: 'Source Sans Pro'; +// $font-open-sans: 'Open Sans'; $base-font-size: 16px; $base-line-height: 1.5; diff --git a/www/assets/scss/utils/typography.scss b/www/assets/scss/utils/typography.scss deleted file mode 100644 index 026e855..0000000 --- a/www/assets/scss/utils/typography.scss +++ /dev/null @@ -1,103 +0,0 @@ -// == Typography -h1, -.headline-1, -.heading-1 { - font-size: 6rem; - font-weight: 300; - letter-spacing: -.015625em; - line-height: 6rem; -} - -h2, -.headline-2, -.heading-2 { - font-size: 3.75rem; - font-weight: 300; - letter-spacing: -.0083333333em; - line-height: 3.75rem; -} - -h3, -.headline-3, -.heading-3 { - font-size: 3rem; - font-weight: 400; - letter-spacing: normal; - line-height: 3.125rem; -} - -h4, -.headline-4, -.heading-4 { - font-size: 2.125rem; - font-weight: 400; - letter-spacing: .0073529412em; - line-height: 2.5rem; -} - -h5, -.headline-5, -.heading-5 { - font-size: 1.5rem; - font-weight: 400; - letter-spacing: normal; - line-height: 2rem; -} - -h6, -.headline-6, -.heading-6 { - font-size: 1.25rem; - font-weight: 500; - letter-spacing: .125em; - line-height: 2rem; -} - -.subtitle-1 { - font-size: 1rem; - font-weight: 400; - letter-spacing: .009375em; - line-height: 1.75rem; -} - -.subtitle-2 { - font-size: .875rem; - font-weight: 500; - letter-spacing: .0071428571em; - line-height: 1.375rem; -} - -.body-1 { - font-size: 1rem; - font-weight: 400; - letter-spacing: .03125em; - line-height: 1.5rem; -} - -.body-2 { - font-size: .875rem; - font-weight: 400; - letter-spacing: .0178571429em; - line-height: 1.25rem; -} - -.button { - font-size: .875rem; - font-weight: 500; - letter-spacing: .0892857143em; - line-height: 2.25rem; -} - -.caption { - font-size: .75rem; - font-weight: 400; - letter-spacing: .0333333333em; - line-height: 1.25rem; -} - -.overline { - font-size: .75rem; - font-weight: 500; - letter-spacing: .1666666667em; - line-height: 2rem; -} \ No newline at end of file