Unify layout partials

This commit is contained in:
Seth Vargo 2017-03-03 11:51:49 -05:00
parent f5ffa229f4
commit a7f6b3b7f1
No known key found for this signature in database
GPG key ID: C921994F9C27E0FF
9 changed files with 257 additions and 223 deletions

View file

@ -6,3 +6,61 @@ activate :hashicorp do |h|
h.github_slug = "hashicorp/vault" h.github_slug = "hashicorp/vault"
h.website_root = "website" h.website_root = "website"
end end
helpers do
# Get the title for the page.
#
# @param [Middleman::Page] page
#
# @return [String]
def title_for(page)
if page && page.data.page_title
return "#{page.data.page_title} - Vault by HashiCorp"
end
"Vault by HashiCorp"
end
# Get the description for the page
#
# @param [Middleman::Page] page
#
# @return [String]
def description_for(page)
return escape_html(page.data.description || "")
end
# This helps by setting the "active" class for sidebar nav elements
# if the YAML frontmatter matches the expected value.
def sidebar_current(expected)
current = current_page.data.sidebar_current || ""
if current.start_with?(expected)
return " class=\"active\""
else
return ""
end
end
# Returns the id for this page.
# @return [String]
def body_id_for(page)
if name = page.data.sidebar_current && !name.blank?
return "page-#{name.strip}"
end
return "page-home"
end
# Returns the list of classes for this page.
# @return [String]
def body_classes_for(page)
classes = []
if page && page.data.layout
classes << "layout-#{page.data.layout}"
end
classes << "-displaying-bnr"
return classes.join(" ")
end
end

View file

@ -1,12 +0,0 @@
module SidebarHelpers
# This helps by setting the "active" class for sidebar nav elements
# if the YAML frontmatter matches the expected value.
def sidebar_current(expected)
current = current_page.data.sidebar_current || ""
if current.start_with?(expected)
return " class=\"active\""
else
return ""
end
end
end

View file

@ -143,11 +143,11 @@ $sidebar-icon-height: 20px;
} }
.sidebar-image { .sidebar-image {
padding-top: 24px; background-image: image-url('logo-header.svg');
img { background-position: center center;
display: block; background-repeat: no-repeat;
margin: 0 auto; height: 72px;
} margin-top: 24px;
} }
@ -250,17 +250,6 @@ $sidebar-icon-height: 20px;
min-width: $sidebar-width; min-width: $sidebar-width;
width: $sidebar-width; width: $sidebar-width;
} }
.sidebar .sidebar-header {
//height: $sidebar-width * 9/16; // 16:9 header dimension
}
.sidebar .sidebar-image {
/* img {
width: $sidebar-width/4 - $sidebar-padding;
height: $sidebar-width/4 - $sidebar-padding;
} */
}
} }
.sidebar-overlay { .sidebar-overlay {

View file

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

View file

@ -1,87 +0,0 @@
<div id="footer" class="navigation">
<div class="container">
<div class="row">
<div class="col-md-offset-1 col-md-10 col-xs-12">
<% if current_page.url != '/' %>
<div class="edit-page-link"><a href="<%= github_url :current_page %>">Edit this page</a></div>
<% end %>
<div class="footer-links">
<ul class="main-links nav navbar-nav">
<li><a href="/intro/index.html">Intro</a></li>
<li><a href="/docs/index.html">Docs</a></li>
<li><a href="/community.html">Community</a></li>
<li><a href="/security.html">Security</a></li>
</ul>
<ul class="external-links nav navbar-nav">
<li class="first download">
<a href="/downloads.html"><%= partial "layouts/svg/svg-download" %>Download</a>
</li>
<li class="github">
<a href="https://github.com/hashicorp/vault"><%= partial "layouts/svg/svg-github" %>GitHub</a>
</li>
</ul>
</ div>
<div class="footer-hashi pull-right">
<div class="">
<a class="hashicorp-project" href="https://www.hashicorp.com">
<span class="project-text">A </span>
<%= partial "layouts/svg/svg-by-hashicorp" %>
<span class="project-text">Project</span>
<%= partial "layouts/svg/svg-hashicorp-logo" %>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-62364009-1', 'vaultproject.io');
ga('require', 'linkid');
ga('send', 'pageview');
</script>
<script type="text/javascript">
adroll_adv_id = "6QAAFJDIWBG3DJBDRJ7BEX";
adroll_pix_id = "PYT5HSNKNRDS7LMUR5B6YG";
(function () {
var oldonload = window.onload;
window.onload = function(){
__adroll_loaded=true;
var scr = document.createElement("script");
var host = (("https:" == document.location.protocol) ? "https://s.adroll.com" : "http://a.adroll.com");
scr.setAttribute('async', 'true');
scr.type = "text/javascript";
scr.src = host + "/j/roundtrip.js";
((document.getElementsByTagName('head') || [null])[0] ||
document.getElementsByTagName('script')[0].parentNode).appendChild(scr);
if(oldonload){oldonload()}};
}());
</script>
<%= javascript_include_tag "application" %>
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Product",
"name": "Vault",
"alternateName": "Vault by HashiCorp",
"manufacturer": "HashiCorp",
"url": "https://www.vaultproject.io",
"logo": "<%= File.join(base_url, image_path("logo_large.png")) %>",
"sameAs": [
"https://github.com/hashicorp/vault"
]
}
</script>
</body>
</html>

View file

@ -1,38 +0,0 @@
<div id="header" class="navigation <%= current_page.data.page_title == "home" ? "" : "navbar-static-top" %>">
<div class="container">
<div class="row">
<div class="col-md-offset-1 col-md-10 col-xs-12">
<div class="navbar-header">
<div class="navbar-brand">
<a class="logo" href="/">Vault</a>
<a class="by-hashicorp" href="https://hashicorp.com/"><span class="svg-wrap">by</span><%= partial "layouts/svg/svg-by-hashicorp" %><%= partial "layouts/svg/svg-hashicorp-logo" %>Hashicorp</a>
</div>
<button class="navbar-toggle" type="button">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="buttons hidden-xs">
<nav class="navigation-links" role="navigation">
<ul class="external-links nav navbar-nav navbar-right">
<li class="first download">
<a href="/downloads.html"><%= partial "layouts/svg/svg-download" %>Download</a>
</li>
<li class="github">
<a href="https://github.com/hashicorp/vault"><%= partial "layouts/svg/svg-github" %>GitHub</a>
</li>
</ul>
<ul class="main-links nav navbar-nav navbar-right">
<li class="first li-under"><a href="/intro/index.html">Intro</a></li>
<li class="li-under"><a href="/docs/index.html">Docs</a></li>
<li class="li-under"><a href="/community.html">Community</a></li>
<li class="li-under"><a href="https://www.hashicorp.com/vault.html?utm_source=oss&utm_medium=header-nav&utm_campaign=vault">Enterprise</a></li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</div>

View file

@ -1,25 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="<%= current_page.data.description %>">
<link rel="shortcut icon" href="<%= image_path('favicon.png') %>">
<title><%= [current_page.data.page_title, "Vault by HashiCorp"].compact.join(" - ") %></title>
<%= stylesheet_link_tag "application" %>
<!--[if lt IE 9]>
<%= javascript_include_tag "html5shiv", "respond.min" %>
<![endif]-->
<!-- Typekit script to import Klavika font -->
<script src="https://use.typekit.net/wxf7mfi.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>
<%= yield_content :head %>
</head>
<body id="page-<%= current_page.data.page_title ? "#{current_page.data.page_title}" : "home" %>" 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}" %>">

View file

@ -3,24 +3,21 @@
<!-- Material sidebar --> <!-- Material sidebar -->
<aside id="sidebar" class="sidebar sidebar-default sidebar-fixed-right" role="navigation"> <aside id="sidebar" class="sidebar sidebar-default sidebar-fixed-right" role="navigation">
<!-- Sidebar header --> <div class="sidebar-header header-cover">
<div class="sidebar-header header-cover"> <div class="sidebar-image"></div>
<!-- Sidebar brand image --> </div>
<div class="sidebar-image">
<img src="<%= image_path('logo-icon-large@2x.png') %>" width="112px" height="72px">
</div>
</div>
<ul class="main nav sidebar-nav"> <ul class="main nav sidebar-nav">
<li class="first"><a href="/intro/index.html">Intro</a></li> <li class="first"><a href="/intro/index.html">Intro</a></li>
<li class=""><a href="/docs/index.html">Docs</a></li> <li class=""><a href="/docs/index.html">Docs</a></li>
<li class=""><a href="/community.html">Community</a></li> <li class=""><a href="/community.html">Community</a></li>
<li class=""><a href="https://www.hashicorp.com/vault.html?utm_source=oss&utm_medium=header-nav&utm_campaign=vault">Enterprise</a></li> <li class=""><a href="https://www.hashicorp.com/vault.html?utm_source=oss&utm_medium=header-nav&utm_campaign=vault">Enterprise</a></li>
</ul> </ul>
<div class="divider"></div>
<!-- Sidebar navigation 2--> <div class="divider"></div>
<ul class="external nav sidebar-nav">
<li class="first"><a class="" href="/downloads.html"><%= partial "layouts/svg/svg-download" %>Download</a></li> <ul class="external nav sidebar-nav">
<li class=""><a class="" href="https://github.com/hashicorp/vault"><%= partial "layouts/svg/svg-github" %>GitHub</a></li> <li class="first"><a class="" href="/downloads.html"><%= partial "layouts/svg/svg-download" %>Download</a></li>
</ul> <li class=""><a class="" href="https://github.com/hashicorp/vault"><%= partial "layouts/svg/svg-github" %>GitHub</a></li>
</ul>
</aside> </aside>

View file

@ -1,10 +1,180 @@
<%= partial "layouts/meta" %> <!DOCTYPE html>
<%= partial "layouts/announcement-bnr" %> <html lang="en">
<%= partial "layouts/header" %> <head>
<%= partial "layouts/sidebar" %> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="<%= description_for(current_page) %>">
<%= yield %> <link rel="shortcut icon" href="<%= image_path('favicon.png') %>">
<%= partial "ember_templates" %> <title><%= title_for(current_page) %></title>
<%= partial "ember_steps" %>
<%= partial "layouts/footer" %> <%= stylesheet_link_tag "application" %>
<!--[if lt IE 9]>
<%= javascript_include_tag "html5shiv", "respond.min" %>
<![endif]-->
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-NR2SD7C');</script>
<!-- Typekit script to import Klavika font -->
<script src="https://use.typekit.net/wxf7mfi.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>
<%= yield_content :head %>
</head>
<body id="<%= body_id_for(current_page) %>" class="<%= body_classes_for(current_page) %>">
<div id="announcement-bnr">
<div class="container">
<div class="row">
<div class="col-md-offset-1 col-md-10 col-xs-12">
<p>
Announcing
<a class="enterprise-logo" href="https://www.hashicorp.com/vault.html?utm_source=oss&utm_medium=top-banner&utm_campaign=vault">
<%= partial "layouts/svg/svg-enterprise" %>
</a>
<span class="tagline">Secure Infrastructure Automation.</span>
<a class="link-blue" href="https://www.hashicorp.com/vault.html?utm_source=oss&utm_medium=top-banner&utm_campaign=vault">
Find out more <span class="hcaret"></span>
</a>
</p>
</div>
</div>
</div>
</div>
<div id="header" class="navigation navbar-static-top">
<div class="container">
<div class="row">
<div class="col-md-offset-1 col-md-10 col-xs-12">
<div class="navbar-header">
<div class="navbar-brand">
<a class="logo" href="/">Vault</a>
<a class="by-hashicorp" href="https://hashicorp.com/"><span class="svg-wrap">by</span><%= partial "layouts/svg/svg-by-hashicorp" %><%= partial "layouts/svg/svg-hashicorp-logo" %>Hashicorp</a>
</div>
<button class="navbar-toggle" type="button">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="buttons hidden-xs">
<nav class="navigation-links" role="navigation">
<ul class="external-links nav navbar-nav navbar-right">
<li class="first download">
<a href="/downloads.html"><%= partial "layouts/svg/svg-download" %>Download</a>
</li>
<li class="github">
<a href="https://github.com/hashicorp/vault"><%= partial "layouts/svg/svg-github" %>GitHub</a>
</li>
</ul>
<ul class="main-links nav navbar-nav navbar-right">
<li class="first li-under"><a href="/intro/index.html">Intro</a></li>
<li class="li-under"><a href="/docs/index.html">Docs</a></li>
<li class="li-under"><a href="/community.html">Community</a></li>
<li class="li-under"><a href="https://www.hashicorp.com/vault.html?utm_source=oss&utm_medium=header-nav&utm_campaign=vault">Enterprise</a></li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</div>
<%= partial "layouts/sidebar" %>
<%= yield %>
<%= partial "ember_templates" %>
<%= partial "ember_steps" %>
<div id="footer" class="navigation">
<div class="container">
<div class="row">
<div class="col-md-offset-1 col-md-10 col-xs-12">
<% if current_page.url != '/' %>
<div class="edit-page-link"><a href="<%= github_url :current_page %>">Edit this page</a></div>
<% end %>
<div class="footer-links">
<ul class="main-links nav navbar-nav">
<li><a href="/intro/index.html">Intro</a></li>
<li><a href="/docs/index.html">Docs</a></li>
<li><a href="/community.html">Community</a></li>
<li><a href="/security.html">Security</a></li>
</ul>
<ul class="external-links nav navbar-nav">
<li class="first download">
<a href="/downloads.html"><%= partial "layouts/svg/svg-download" %>Download</a>
</li>
<li class="github">
<a href="https://github.com/hashicorp/vault"><%= partial "layouts/svg/svg-github" %>GitHub</a>
</li>
</ul>
</div>
<div class="footer-hashi pull-right">
<a class="hashicorp-project" href="https://www.hashicorp.com">
<span class="project-text">A </span>
<%= partial "layouts/svg/svg-by-hashicorp" %>
<span class="project-text">Project</span>
<%= partial "layouts/svg/svg-hashicorp-logo" %>
</a>
</div>
</div>
</div>
</div>
</div>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-62364009-1', 'vaultproject.io');
ga('require', 'linkid');
ga('send', 'pageview');
</script>
<script type="text/javascript">
adroll_adv_id = "6QAAFJDIWBG3DJBDRJ7BEX";
adroll_pix_id = "PYT5HSNKNRDS7LMUR5B6YG";
(function () {
var oldonload = window.onload;
window.onload = function(){
__adroll_loaded=true;
var scr = document.createElement("script");
var host = (("https:" == document.location.protocol) ? "https://s.adroll.com" : "http://a.adroll.com");
scr.setAttribute('async', 'true');
scr.type = "text/javascript";
scr.src = host + "/j/roundtrip.js";
((document.getElementsByTagName('head') || [null])[0] ||
document.getElementsByTagName('script')[0].parentNode).appendChild(scr);
if(oldonload){oldonload()}};
}());
</script>
<%= javascript_include_tag "application" %>
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Product",
"name": "Vault",
"alternateName": "Vault by HashiCorp",
"manufacturer": "HashiCorp",
"url": "https://www.vaultproject.io",
"logo": "<%= File.join(base_url, image_path("logo_large.png")) %>",
"sameAs": [
"https://github.com/hashicorp/vault"
]
}
</script>
</body>
</html>