This commit is contained in:
captainill 2015-11-10 12:19:17 -08:00
parent d03ec61103
commit 71decbc638
5 changed files with 120 additions and 77 deletions

View File

@ -38,7 +38,7 @@
}
.docs-content{
padding: 40px 0;
padding: 40px 0 60px;
}
}
}

View File

@ -172,7 +172,7 @@ header .header {
.docs-content {
flex-direction: column;
padding: $docs-top-margin 80px;
padding: $docs-top-margin 120px;
display: block;
code {

View File

@ -1,70 +1,86 @@
footer {
height: $nav-height;
max-height: $nav-height;
background-color: $black !important;
padding: 0;
margin: 0;
text-transform: uppercase;
color: $white;
font-family: $sans;
@include respond-to(mobile) {
margin-right: -20px;
margin-left: -20px;
#footer{
background-color: $black;
padding: 20px 0;
&.white{
background-color: $black;
.footer-links{
li > a {
@include project-footer-a-subpage-style();
}
}
}
.footer-links{
li > a {
@include project-footer-a-style();
}
}
.hashicorp-project{
margin-top: 24px;
}
.pull-right{
padding-right: 15px;
}
}
.edit-page-link{
position: absolute;
top: -150px;
right: 30px;;
a{
text-transform: uppercase;
color: $black;
font-size: 13px;
}
}
@media (min-width: 1500px) {
.edit-page-link{
top: -56px;
}
}
@media (max-width: 992px) {
.footer-links {
display: block;
text-align: center;
ul{
margin-top: 40px;
@include respond-to(mobile) {
margin-left: $baseline;
margin-top: $baseline;
display: inline-block;;
float: none !important;
}
li {
display: inline;
margin-right: 50px;
@include respond-to(mobile) {
margin-right: 20px;
display: list-item;
}
}
.hashi-logo {
background: image-url('logo_footer.png') no-repeat center top;
height: 40px;
width: 40px;
background-size: 37px 40px;
text-indent: -999999px;
display: inline-block;
margin-top: -10px;
margin-right: 0;
@include respond-to(mobile) {
margin-top: -50px;
margin-right: $baseline;
}
}
}
.active {
color: $green;
}
button {
margin-top: 20px;
}
}
.page-wrap {
min-height: 100%;
/* equal to footer height */
margin-bottom: -($nav-height);
}
.page-wrap:after {
content: "";
.footer-hashi{
display: block;
float: none !important;
}
}
}
.page-wrap:after {
/* .push must be the same height as footer */
height: $nav-height;
@media (max-width: 414px) {
#footer{
ul{
display: block;
li{
display: block;
float: none;
}
&.external-links{
li{
svg{
position: relative;
left: 0;
top: 2px;
margin-top: 0;
margin-right: 4px;
}
}
}
}
}
}

View File

@ -47,6 +47,16 @@
@include project-a-style();
}
}
.main-links {
li > a {
color: $white;
&:hover{
color: $green;
}
}
}
}
@media (max-width: 768px) {

View File

@ -57,29 +57,46 @@
<%= yield %>
<div class="clearfix"></div>
<footer id="footer" class="dark-background">
<footer id="footer" class="navigation dark-background white">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<ul>
<li class="packer"><a href="/">Packer</a></li>
<li>
A <a href="http://www.hashicorp.com/">HashiCorp</a> project.
</li>
<div class="col-xs-12">
<% # current_page.path does not have an extension, but
# current_page.source_file does. Also, we don't want to show
# this on the homepage.
if current_page.url != "/"
current_page_source = current_page.path + \
current_page.source_file.split(current_page.path)[1] %>
<li>
<a href="https://github.com/mitchellh/packer/blob/master/website/source/<%= current_page_source %>">Edit this page</a>
</li>
<% if current_page.url != '/' %>
<div class="edit-page-link"><a href="https://github.com/mitchellh/packer/blob/master/website/source/<%= current_page_source %>">Edit this page</a></div>
<% end %>
<a href="http://www.hashicorp.com">
<li class="pull-right hashi-logo">&nbps;</li>
</a>
<% end %>
<div class="footer-links">
<ul class="main-links white 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>
</ul>
<ul class="external-links white 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/micthellh/packer"><%= partial "layouts/svg/svg-github" %>GitHub</a>
</li>
</ul>
</ div>
<div class="footer-hashi pull-right">
<div class="">
<a class="hashicorp-project white" 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>