From 481a2bb139e0568e75adf1d03bda0ee95d4acc40 Mon Sep 17 00:00:00 2001 From: Jason Costello Date: Mon, 6 Mar 2017 11:22:08 -0800 Subject: [PATCH] Revert "Remove header enterprise announcement" This reverts commit c3734b2df3f0e3fb74fca3a4aaff62e8c0647c08. --- .../assets/stylesheets/_announcement-bnr.scss | 142 ++++++++++++++++++ .../source/assets/stylesheets/_variables.scss | 2 +- .../assets/stylesheets/application.scss | 1 + website/source/layouts/_meta.erb | 2 +- 4 files changed, 145 insertions(+), 2 deletions(-) create mode 100755 website/source/assets/stylesheets/_announcement-bnr.scss diff --git a/website/source/assets/stylesheets/_announcement-bnr.scss b/website/source/assets/stylesheets/_announcement-bnr.scss new file mode 100755 index 000000000..6e3253039 --- /dev/null +++ b/website/source/assets/stylesheets/_announcement-bnr.scss @@ -0,0 +1,142 @@ +// +// announcement bnr +// -------------------------------------------------- + +$enterprise-bnr-font-weight: 300; +$enterprise-bnr-consul-color: #B52A55; +$enterprise-color-dark-white: #A9B1B5; + +body{ + // when _announcment-bnr.erb (ie. Consul Enterprise Announcment) is being used in layout we need to push down content to accommodate + // add this class to body + &.-displaying-bnr{ + #header{ + > .container{ + padding-top: 8px; + -webkit-transform: translateY(32px); + -ms-transform: translateY(32px); + transform: translateY(32px); + } + } + + #jumbotron { + .container{ + .jumbo-logo-wrap{ + margin-top: 160px; + } + } + } + + &.page-sub{ + #header{ + > .container{ + padding-bottom: 32px; + } + } + } + } +} + + +#announcement-bnr { + height: 40px; + flex-shrink: 0; + background-color: #000; + + &.-absolute{ + position: absolute; + top: 0; + left: 0; + width: 100%; + z-index: 9999; + } + + a,p{ + font-size: 14px; + color: $enterprise-color-dark-white; + font-family: $header-font-family; + font-weight: $enterprise-bnr-font-weight; + font-size: 13px; + line-height: 40px; + margin-bottom: 0; + } + + .link-highlight{ + display: inline-block; + margin-left: 3px; + color: lighten($purple, 10%); + font-weight: 400; + -webkit-transform: translateY(1px); + -ms-transform: translateY(1px); + transform: translateY(1px); + } + + .enterprise-logo{ + position: relative; + top: 4px; + + &:hover{ + text-decoration: none; + + svg{ + rect{ + fill: $enterprise-color-dark-white; + } + } + } + + svg{ + width: 156px; + height: 18px; + fill: $white; + margin-right: 4px; + margin-left: 3px; + + rect{ + @include transition(all .1s ease-in); + } + } + } +} + +.hcaret{ + display: inline-block; + -moz-transform: translate(0, -1px) rotate(135deg); + -webkit-transform: translate(0, -1px) rotate(135deg); + transform: translate(0, -1px) rotate(135deg); + width: 7px; + height: 7px; + border-top: 1px solid lighten($purple, 10%); + border-left: 1px solid lighten($purple, 10%); + @include transition(all .1s ease-in); +} + +@media (max-width: 768px) { + #announcement-bnr { + .tagline{ + display: none; + } + } +} + +@media (max-width: 320px) { + #announcement-bnr { + a,p{ + font-size: 12px; + } + + .link-highlight{ + display: inline-block; + margin-left: 1px; + } + + .enterprise-logo svg{ + width: 128px; + margin-left: 2px; + } + + .hcaret{ + display: none; + } + } +} diff --git a/website/source/assets/stylesheets/_variables.scss b/website/source/assets/stylesheets/_variables.scss index 1a1b0ff07..768ff74ab 100755 --- a/website/source/assets/stylesheets/_variables.scss +++ b/website/source/assets/stylesheets/_variables.scss @@ -11,7 +11,7 @@ $header-height: 90px; $jumbotron-color: #fff; $btn-border-radius: 4px; $el-border-radius: 6px; -$negative-hero-margin: -80px; +$negative-hero-margin: -70px; // colors // ------------------------- diff --git a/website/source/assets/stylesheets/application.scss b/website/source/assets/stylesheets/application.scss index 165f2a01f..1a039a39c 100755 --- a/website/source/assets/stylesheets/application.scss +++ b/website/source/assets/stylesheets/application.scss @@ -22,6 +22,7 @@ @import 'hashicorp-shared/_hashicorp-sidebar'; // Components +@import '_announcement-bnr'; @import '_header'; @import '_footer'; @import '_jumbotron'; diff --git a/website/source/layouts/_meta.erb b/website/source/layouts/_meta.erb index 191e585b1..6acbdaa51 100644 --- a/website/source/layouts/_meta.erb +++ b/website/source/layouts/_meta.erb @@ -30,7 +30,7 @@ <%= yield_content :head %> - " class="page-<%= current_page.data.page_title ? "#{current_page.data.page_title} layout-#{current_page.data.layout} page-sub" : "home layout-#{current_page.data.layout}" %>"> + " class="page-<%= current_page.data.page_title ? "#{current_page.data.page_title} layout-#{current_page.data.layout} page-sub" : "home layout-#{current_page.data.layout}" %> -displaying-bnr">