Merge pull request #7716 from hashicorp/mw.add-alert-banner

website: add alert banner
This commit is contained in:
Brandon Romano 2020-04-28 09:45:20 -07:00 committed by GitHub
commit e53b5d2d10
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 38 additions and 0 deletions

View File

@ -0,0 +1,29 @@
.alert-bar {
color: white;
position: relative;
background: linear-gradient(90deg, #ca2171 1.56%, #8e134a 100%);
display: flex;
justify-content: center;
& a {
text-decoration: none;
display: inline-flex;
color: white;
padding: 14px 15px;
&:hover {
text-decoration: none;
}
& p {
padding: 0;
margin: 0;
}
& .link {
margin-left: 30px;
text-decoration: underline;
font-weight: 500;
}
}
}

View File

@ -26,6 +26,7 @@
@import '_global';
// Components
@import '_alert-bar';
@import '_header';
@import '_footer';
@import '_inner';

View File

@ -0,0 +1,6 @@
<div class="alert-bar g-type-body-small">
<a href="https://www.hashicorp.com/products/consul/service-on-azure">
<p>HashiCorp Consul Service on Azure Public Beta Available Now</p>
<span class="link">Learn More</span>
</a>
</div>

View File

@ -47,6 +47,8 @@
<body id="<%= body_id_for(current_page) %>" class="<%= body_classes_for(current_page) %>">
<%= partial("layouts/_alert-bar") %>
<%= mega_nav :consul %>
<div id="header" class="navigation navbar-static-top hidden-print">