From 0179ee1993ae55a15272a11ab6eaf1b0d70d18a1 Mon Sep 17 00:00:00 2001 From: Ben Visness Date: Sat, 28 Aug 2021 07:33:03 -0500 Subject: [PATCH] Use the new font on the logo --- public/logo_nounder.svg | 29 -------- public/logo_underscore.svg | 30 --------- public/style.css | 63 +++++++----------- src/rawdata/scss/_core.scss | 96 ++++++++++----------------- src/templates/src/include/header.html | 4 +- src/templates/src/wheeljam_index.html | 2 +- 6 files changed, 62 insertions(+), 162 deletions(-) delete mode 100644 public/logo_nounder.svg delete mode 100644 public/logo_underscore.svg diff --git a/public/logo_nounder.svg b/public/logo_nounder.svg deleted file mode 100644 index 841809f5..00000000 --- a/public/logo_nounder.svg +++ /dev/null @@ -1,29 +0,0 @@ - - - - - - - - - - - - - diff --git a/public/logo_underscore.svg b/public/logo_underscore.svg deleted file mode 100644 index 03f30888..00000000 --- a/public/logo_underscore.svg +++ /dev/null @@ -1,30 +0,0 @@ - - - - - - - - - - - - - - diff --git a/public/style.css b/public/style.css index 17abea0f..8eaabc98 100644 --- a/public/style.css +++ b/public/style.css @@ -7595,15 +7595,34 @@ article code { margin-right: auto; margin-left: auto; } +header .underscore { + width: 100%; + height: 100%; + animation: logo-blink 1s infinite alternate; + -webkit-animation: logo-blink 1s infinite alternate ease-in-out; } + +header .logo, header .underscore { + background-size: 8.75rem; + background-repeat: no-repeat; + background-position: center center; } + +header .hmn-logo { + height: 3.75rem; + width: 100%; + text-transform: uppercase; + font-family: 'MohaveHMN'; + font-size: 2rem; + display: flex; + align-items: center; + justify-content: center; + color: white !important; } + @media screen and (min-width: 30em) { + header .hmn-logo { + width: 11.25rem; } } + header .menu-bar { width: 100%; z-index: 10; } - header .menu-bar .hmdev-logo { - background-image: url("/public/logo_nounder.svg"); } - header .menu-bar .hmdev-logo.project { - background-image: url("/public/logo_net.svg"); } - header .menu-bar .hmdev-logo .underscore { - background-image: url("/public/logo_underscore.svg"); } header .menu-bar .items a { font-weight: bold; } header .menu-bar .items a.patreon { @@ -7613,38 +7632,6 @@ header .menu-bar { display: inline-block; } header .menu-bar .items a h1 { display: inline; } - header .menu-bar .hmdev-logo { - width: 100%; } - @media screen and (min-width: 30em) { - header .menu-bar .hmdev-logo { - width: 11.25rem; } } - header .menu-bar .hmdev-logo.project { - width: 70px; } - -@keyframes logo-blink { - from { - opacity: 0.0; } - to { - opacity: 1.0; } } - -@-webkit-keyframes logo-blink { - from { - opacity: 0.0; } - to { - opacity: 1.0; } } - header .menu-bar .logo { - height: 3.75rem; - margin: 0px; - padding: 0px; } - header .menu-bar .underscore { - width: 100%; - height: 100%; - animation: logo-blink 1s infinite alternate; - -webkit-animation: logo-blink 1s infinite alternate ease-in-out; } - header .menu-bar .logo, header .menu-bar .underscore { - background-size: 8.75rem; - background-repeat: no-repeat; - background-position: center center; } header .user-options { position: relative; } diff --git a/src/rawdata/scss/_core.scss b/src/rawdata/scss/_core.scss index 1aaa3411..e8c9a9b2 100644 --- a/src/rawdata/scss/_core.scss +++ b/src/rawdata/scss/_core.scss @@ -436,22 +436,44 @@ article code { } header { + .logo { + + } + + .underscore { + width: 100%; + height: 100%; + animation: logo-blink 1s infinite alternate; + -webkit-animation: logo-blink 1s infinite alternate ease-in-out; + } + + .logo, .underscore { + background-size: px2rem(140px); + background-repeat: no-repeat; + background-position: center center; + } + + .hmn-logo { + height: px2rem(60px); + width: 100%; + text-transform: uppercase; + font-family: 'MohaveHMN'; + font-size: 2rem; + + display: flex; + align-items: center; + justify-content: center; + color: white !important; + + @media #{$breakpoint-not-small} { + width: px2rem(180px); + } + } + .menu-bar { width: 100%; z-index: 10; - .hmdev-logo { - background-image: url("/public/logo_nounder.svg"); - - &.project { - background-image:url("/public/logo_net.svg"); - } - - .underscore { - background-image: url("/public/logo_underscore.svg"); - } - } - .items a { @extend .pa2; @extend .pv3-ns; @@ -479,56 +501,6 @@ header { display: inline; } } - - // TODO(ben): What is the difference between this and .logo? - .hmdev-logo { - width: 100%; - - @media #{$breakpoint-not-small} { - width: px2rem(180px); - } - - &.project { - width:70px; - } - - @keyframes logo-blink { - from { - opacity: 0.0; - } - to { - opacity: 1.0; - } - } - - @-webkit-keyframes logo-blink { - from { - opacity: 0.0; - } - to { - opacity: 1.0; - } - } - } - - .logo { - height: px2rem(60px); - margin: 0px; - padding: 0px; - } - - .underscore { - width: 100%; - height: 100%; - animation: logo-blink 1s infinite alternate; - -webkit-animation: logo-blink 1s infinite alternate ease-in-out; - } - - .logo, .underscore { - background-size: px2rem(140px); - background-repeat: no-repeat; - background-position: center center; - } } .user-options { diff --git a/src/templates/src/include/header.html b/src/templates/src/include/header.html index 0f4805bc..fbeb5e23 100644 --- a/src/templates/src/include/header.html +++ b/src/templates/src/include/header.html @@ -33,8 +33,8 @@
-
{{ if .IsProjectPage }} diff --git a/src/templates/src/wheeljam_index.html b/src/templates/src/wheeljam_index.html index c55377a4..0c65d20c 100644 --- a/src/templates/src/wheeljam_index.html +++ b/src/templates/src/wheeljam_index.html @@ -45,7 +45,7 @@ margin-bottom: 0 !important; } - .hmdev-logo { + .hmn-logo { background-color: rgba(255, 255, 255, 0.1) !important; }