luxolus
/
open-consul
2
0
Fork 0
Code Issues 1 Pull Requests Packages Releases Wiki Activity

add announcement banner for Consul Enterprise launch

This commit is contained in:
captainill 2016-03-03 12:23:30 -08:00
parent c33fb53781
commit 95337b7211
8 changed files with 185 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ui/styles/_variables.scss
View File

@ -12,7 +12,7 @@ $red-darker: #b03c44;
$tan: #f0f0e5;
$consul-gray: #909090;
$consul-footer-gray: #d7d4d7;
$purple-dark: #69499a;
$purple-dark: #69499a;
$purple: lighten($purple-dark, 20%);
$light-purple: #f7f3f9;

3
website/Gemfile.lock
View File

@ -188,6 +188,3 @@ PLATFORMS
DEPENDENCIES
middleman-hashicorp!
BUNDLED WITH
1.10.6

109
website/source/assets/stylesheets/_announcement-bnr.scss Executable file
View File

@ -0,0 +1,109 @@
//
// announcement bnr
// --------------------------------------------------
$enterprise-bnr-font-weight: 300;
$enterprise-bnr-consul-color: #B52A55;
$enterprise-color-dark-white: #A9B1B5;
#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($enterprise-bnr-consul-color, 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: 140px;
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($enterprise-bnr-consul-color, 10%);
border-left: 1px solid lighten($enterprise-bnr-consul-color, 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;
}
}
}

10
website/source/assets/stylesheets/_header.scss
View File

@ -19,6 +19,16 @@ body.page-sub{
}
#header {
// when _announcment-bnr.erb (ie. Consul Enterprise Announcment) is being used in layout we need to push down content to accomodate
// add this class
&.-displaying-bnr{
> .container{
-webkit-transform: translateY(32px);
-ms-transform: translateY(32px);
transform: translateY(32px);
}
}
.navbar-brand {
.logo{
width: $project-logo-width;

1
website/source/assets/stylesheets/application.scss
View File

@ -24,6 +24,7 @@
@import 'hashicorp-shared/_hashicorp-sidebar';
// Components
@import '_announcement-bnr';
@import "_header";
@import '_footer';
@import "_jumbotron";

18
website/source/layouts/_announcement-bnr.erb Normal file
View File

@ -0,0 +1,18 @@
<div id="announcement-bnr" class="-absolute">
<div class="container">
<div class="row">
<div class="col-xs-12">
<p>
Announcing
<a class="enterprise-logo" href="https://www.hashicorp.com/consul.html?utm_source=oss&utm_medium=top-banner&utm_campaign=vault">
<%= partial "layouts/svg/svg-enterprise" %>
</a>
<span class="tagline">Scalable and Resilient Microservice Infrastructure.</span>
<a class="link-highlight" href="https://www.hashicorp.com/consul.html?utm_source=oss&utm_medium=top-banner&utm_campaign=vault">
Find out more <span class="hcaret"></span>
</a>
</p>
</div>
</div>
</div>
</div>

5
website/source/layouts/_header.erb
View File

@ -25,8 +25,9 @@
</head>
<body 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}" %>">
<div id="header" class="navigation <%= current_page.data.page_title == "home" ? "" : "navbar-static-top" %>">
<div class="container">
<div id="header" class="-displaying-bnr navigation <%= current_page.data.page_title == "home" ? "" : "navbar-static-top" %>">
<%= partial "layouts/announcement-bnr" %>
<div class="container">
<div class="row">
<div class="col-xs-12">
<div class="navbar-header">

43
website/source/layouts/svg/_svg-enterprise.erb Normal file
View File

@ -0,0 +1,43 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 124.1 16" xml:space="preserve" enable-background="new 0 0 124.1 16">
<style type="text/css">
.st0{fill:#FFFFFF;}
</style>
<g>
<g>
<path class="st0" d="M20.8 5.7c0-1.7 1-2.7 3.3-2.7 0.9 0 1.8 0.1 2.5 0.3l-0.2 1.5c-0.8-0.1-1.6-0.2-2.3-0.2C23 4.6 22.6 5 22.6 6v3.6c0 1 0.4 1.4 1.6 1.4 0.6 0 1.5-0.1 2.3-0.2l0.2 1.5c-0.8 0.2-1.7 0.3-2.5 0.3 -2.3 0-3.3-1-3.3-2.7V5.7z"/>
<path class="st0" d="M30.8 12.6c-2.3 0-3-1.3-3-2.7V8.2c0-1.4 0.6-2.7 3-2.7 2.3 0 3 1.3 3 2.7v1.7C33.8 11.3 33.1 12.6 30.8 12.6zM30.8 7c-0.9 0-1.3 0.4-1.3 1.2V10c0 0.8 0.4 1.2 1.3 1.2 0.9 0 1.3-0.4 1.3-1.2V8.1C32.1 7.4 31.7 7 30.8 7z"/>
<path class="st0" d="M39.5 12.5V7.7c0-0.4-0.2-0.5-0.5-0.5 -0.4 0-1.2 0.3-1.8 0.6v4.7h-1.7V5.6h1.3l0.2 0.6c0.9-0.4 1.9-0.7 2.7-0.7 1.1 0 1.5 0.8 1.5 2v4.9H39.5z"/>
<path class="st0" d="M45.2 12.6c-0.7 0-1.7-0.2-2.4-0.4l0.2-1.3c0.6 0.2 1.3 0.3 2 0.3 0.8 0 0.9-0.2 0.9-0.7 0-0.4-0.1-0.6-1.2-0.9 -1.7-0.4-1.9-0.8-1.9-2.1 0-1.4 0.6-2 2.5-2 0.6 0 1.5 0.1 2 0.2l-0.2 1.4C46.8 7 46 6.9 45.4 6.9c-0.7 0-0.9 0.2-0.9 0.6 0 0.5 0 0.6 1 0.8 1.9 0.5 2.1 0.8 2.1 2.2C47.6 11.8 47.2 12.6 45.2 12.6z"/>
<path class="st0" d="M50.9 5.6v4.8c0 0.4 0.2 0.5 0.5 0.5 0.4 0 1.2-0.3 1.8-0.6V5.6H55v6.8h-1.3l-0.2-0.6c-0.9 0.4-1.9 0.7-2.7 0.7 -1.1 0-1.5-0.8-1.5-2V5.6H50.9z"/>
<path class="st0" d="M56.9 12.5V2.9l1.7-0.2v9.8H56.9z"/>
<path class="st0" d="M63.8 3.1h5.5v1.1H65v2.9h4v1.1h-4v3.2h4.3v1.1h-5.5V3.1z"/>
<path class="st0" d="M75.4 12.5V7.2c0-0.4-0.2-0.6-0.7-0.6 -0.5 0-1.6 0.3-2.3 0.7v5.2h-1.2V5.6h1l0.1 0.6c0.8-0.4 1.9-0.7 2.7-0.7 1.1 0 1.5 0.7 1.5 1.7v5.2H75.4z"/>
<path class="st0" d="M82.3 12.3c-0.4 0.2-0.9 0.3-1.4 0.3 -1.1 0-1.7-0.4-1.7-1.6V6.6h-1.2v-1h1.2V4l1.2-0.2v1.8h1.9l-0.1 1h-1.8v4.2c0 0.5 0.1 0.8 0.7 0.8 0.3 0 0.7-0.1 1.1-0.2L82.3 12.3z"/>
<path class="st0" d="M86.3 11.6c0.7 0 1.4-0.1 2.2-0.3l0.2 0.9c-0.6 0.2-1.6 0.4-2.4 0.4 -2 0-2.7-1-2.7-2.5V8c0-1.4 0.6-2.5 2.7-2.5 2 0 2.6 1.2 2.6 2.6v1.4h-4.1v0.6C84.7 11.2 85 11.6 86.3 11.6zM84.7 8.5h2.9V8c0-1-0.3-1.5-1.4-1.5 -1.1 0-1.5 0.5-1.5 1.5V8.5z"/>
<path class="st0" d="M93.7 6.6c-0.6 0.3-1.4 0.8-1.9 1.2v4.7h-1.2V5.6h1l0.1 1c0.5-0.4 1.2-0.8 1.9-1.1L93.7 6.6z"/>
<path class="st0" d="M100.3 10.4c0 1.4-0.6 2.2-2.2 2.2 -0.6 0-1.4-0.1-1.9-0.2v2.8l-1.2 0.2V5.6h1L96 6.3c0.6-0.4 1.4-0.8 2.3-0.8 1.3 0 2 0.7 2 2.1V10.4zM96.1 11.4c0.6 0.1 1.4 0.2 1.9 0.2 0.8 0 1.1-0.4 1.1-1.2V7.6c0-0.7-0.2-1.1-1.1-1.1 -0.7 0-1.4 0.4-1.9 0.8V11.4z"/>
<path class="st0" d="M105.4 6.6c-0.6 0.3-1.4 0.8-1.9 1.2v4.7h-1.2V5.6h1l0.1 1c0.5-0.4 1.2-0.8 1.9-1.1L105.4 6.6z"/>
<path class="st0" d="M106.6 4.5V2.9h1.2v1.7H106.6zM106.6 12.5V5.6h1.2v6.8H106.6z"/>
<path class="st0" d="M111.9 12.6c-0.7 0-1.6-0.2-2.2-0.4l0.2-0.9c0.6 0.2 1.4 0.3 1.9 0.3 1.1 0 1.3-0.2 1.3-0.9s-0.1-0.8-1.4-1.1c-1.7-0.4-1.8-0.8-1.8-2.2 0-1.3 0.6-1.8 2.4-1.8 0.7 0 1.4 0.1 1.9 0.2l-0.1 1c-0.6-0.1-1.3-0.2-1.9-0.2 -1 0-1.1 0.2-1.1 0.9 0 0.8 0 0.9 1.2 1.2 2 0.5 2.1 0.7 2.1 2.1C114.2 12 113.8 12.6 111.9 12.6z"/>
<path class="st0" d="M118.6 11.6c0.7 0 1.4-0.1 2.2-0.3l0.2 0.9c-0.6 0.2-1.6 0.4-2.4 0.4 -2 0-2.7-1-2.7-2.5V8c0-1.4 0.6-2.5 2.7-2.5 2 0 2.6 1.2 2.6 2.6v1.4h-4.1v0.6C116.9 11.2 117.2 11.6 118.6 11.6zM116.9 8.5h2.9V8c0-1-0.3-1.5-1.4-1.5 -1.1 0-1.5 0.5-1.5 1.5V8.5z"/>
<path class="st0" d="M122.9 10.8h1.2v1.6h-1.2V10.8z"/>
</g>
<g>
<rect x="98.8" y="14.6" class="st0" width="23.2" height="1"/>
<rect x="20.6" y="14.6" class="st0" width="71.2" height="1"/>
</g>
<g>
<path class="st0" d="M13.9 9.5L13.9 9.5 13.9 9.5c-0.1 0.3-0.4 0.5-0.8 0.5l0 0c-0.3-0.1-0.5-0.4-0.5-0.8l0 0c0.1-0.3 0.4-0.5 0.8-0.5l0 0C13.8 8.8 14 9.1 13.9 9.5L13.9 9.5C13.9 9.4 13.9 9.5 13.9 9.5z"/>
<path class="st0" d="M13.5 7.4c-0.3 0.1-0.7-0.1-0.8-0.5l0 0c-0.1-0.3 0.1-0.7 0.5-0.8l0 0c0.3-0.1 0.7 0.1 0.8 0.5l0 0c0 0.1 0 0.2 0 0.3l0 0C13.9 7.1 13.7 7.3 13.5 7.4z"/>
<path id="XMLID_12_" class="st0" d="M11.2 8.6c-0.4 0-0.6-0.3-0.6-0.6l0 0c0-0.4 0.3-0.6 0.6-0.6l0 0c0.4 0 0.6 0.3 0.6 0.6l0 0 0 0 0 0C11.9 8.3 11.6 8.6 11.2 8.6z"/>
<path id="XMLID_11_" class="st0" d="M8 9.7C7.1 9.7 6.3 8.9 6.3 8l0 0C6.3 7.1 7 6.3 8 6.3l0 0c0.9 0 1.7 0.7 1.7 1.7l0 0 0 0 0 0C9.7 8.9 8.9 9.7 8 9.7z"/>
<path id="XMLID_10_" class="st0" d="M8 16c-1.1 0-2.1-0.2-3.1-0.6 -1-0.4-1.8-1-2.5-1.7 -0.7-0.7-1.3-1.6-1.7-2.5C0.2 10.1 0 9.1 0 8s0.2-2.1 0.6-3.1c0.4-1 1-1.8 1.7-2.5C3.1 1.6 3.9 1 4.9 0.6 5.9 0.2 6.9 0 8 0c0.9 0 1.8 0.1 2.6 0.4 0.8 0.3 1.6 0.7 2.3 1.2 0.2 0.2 0.3 0.5 0.1 0.7 -0.2 0.2-0.5 0.3-0.7 0.1C11 1.5 9.5 1 8 1c-1.9 0-3.6 0.7-4.9 2 -1.3 1.3-2 3.1-2 4.9 0 1.9 0.7 3.6 2 4.9 1.3 1.3 3.1 2 4.9 2 1.5 0 3-0.5 4.2-1.4 0.2-0.2 0.6-0.1 0.7 0.1s0.1 0.6-0.1 0.7c-0.7 0.5-1.4 0.9-2.3 1.2C9.8 15.9 8.9 16 8 16z"/>
<path class="st0" d="M16.1 9.4C16 9.7 15.7 10 15.4 9.9l0 0c-0.3-0.1-0.6-0.4-0.5-0.7l0 0c0.1-0.3 0.4-0.6 0.7-0.5l0 0C15.9 8.7 16.1 9 16.1 9.4L16.1 9.4C16.1 9.4 16.1 9.4 16.1 9.4z"/>
<path class="st0" d="M15.6 7.4c-0.3 0.1-0.7-0.2-0.7-0.5l0 0c-0.1-0.3 0.2-0.7 0.5-0.7l0 0c0.3-0.1 0.7 0.2 0.7 0.5l0 0 0 0 0 0c0 0.1 0 0.1 0 0.2l0 0C16.1 7.1 15.9 7.3 15.6 7.4z"/>
<path class="st0" d="M15 12L15 12 15 12c-0.2 0.3-0.6 0.4-0.9 0.2l0 0c-0.3-0.2-0.4-0.6-0.2-0.9l0 0c0.2-0.3 0.6-0.4 0.9-0.2l0 0c0.2 0.1 0.3 0.4 0.3 0.6l0 0C15 11.8 15 11.9 15 12z"/>
<path class="st0" d="M14.7 4.9C14.4 5.1 14 5 13.8 4.6l0 0c-0.2-0.3-0.1-0.7 0.2-0.9l0 0C14.4 3.6 14.8 3.7 15 4l0 0 0 0 0 0C15 4.1 15.1 4.3 15 4.4l0 0C15 4.6 14.9 4.8 14.7 4.9z"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 5.5 KiB