Fix fonts and arrangement

This commit is contained in:
Seth Vargo 2016-10-09 14:33:16 +08:00
parent 19cfd137a2
commit 038d131ec0
No known key found for this signature in database
GPG Key ID: 905A90C2949E8787
2 changed files with 70 additions and 99 deletions

View File

@ -2,22 +2,15 @@
// Docs
// --------------------------------------------------
body.layout-atlas,
body.layout-consul,
body.layout-dnsimple,
body.layout-dme,
body.layout-cloudflare,
body.layout-cloudstack,
body.layout-google,
body.layout-heroku,
body.layout-mailgun,
body.layout-digitalocean,
body.layout-aws,
$docs-font-size: 16px;
body.layout-docs,
body.layout-inner,
body.layout-downloads,
body.layout-intro{
//background: $light-black image-url('sidebar-wire.png') left 62px no-repeat;
font-size: $docs-font-size - 2;
>.container{
.col-md-8[role=main]{
min-height: 800px;
@ -51,61 +44,32 @@ body.layout-intro{
> a{
padding: 10px 8px;
font-size: 15px;
font-size: 13px;
color: $blue-dark;
&:before{
@include bez-1-transition();
}
&:hover{
background-color: transparent !important;
&:before{
@include bez-1-transition();
}
}
}
}
$parent-active-state: -14px;
$parent-default-state: -10px;
$parent-default-state: -14px;
$child-active-state: -4px;
$child-default-state: 0px;
$child-default-state: -4px;
//first teir li
> li {
margin: 0 0 0 10px;
&.active {
>a{
color: $green-dark;
font-weight: 600;
border-right: 1px solid $green-faint;
&:hover{
&:before{
left: $parent-default-state;
}
}
&:before{
@include rotate(90deg);
opacity: 1;
}
}
.nav {
display: block;
}
}
> a {
-webkit-font-smoothing: antialiased;
&:hover{
color: #000;
&:before{
left: $parent-active-state;
opacity: 1;
}
}
@ -122,6 +86,20 @@ body.layout-intro{
@include img-retina("caret-light.png", "caret-light@2x.png", 6px, 9px);
}
}
&.active {
>a{
color: $green-dark;
&:before{
opacity: 1;
}
}
.nav {
display: block;
}
}
}
//nested ul.nav
@ -130,26 +108,39 @@ body.layout-intro{
padding-top: 10px;
padding-bottom: 10px;
margin-bottom: 15px;
border-right: 1px solid $green-faint;
border-bottom: 1px solid $green-faint;
> li{
margin-left: 10px;
> a {
&:before{
content: '';
position: absolute;
width: 8px;
height: 12px;
top: 10px;
left: $child-default-state;
overflow: hidden;
background: image-url("caret-light.png") 0 0 no-repeat;
opacity: .3;
@include img-retina("caret-light.png", "caret-light@2x.png", 6px, 9px);
}
&:hover {
color: #000;
&:before {
opacity: 1;
}
}
}
&.active{
> a{
color: $green-dark;
font-weight: 600;
&:hover{
&:before{
left: $child-default-state;
}
}
&:before{
//background: url(triangle-sprite.png) 0 0 no-repeat;
//@include img-retina("triangle-sprite.png", "triangle-sprite@2x.png", 5px, 19px);
opacity: 1;
}
}
}
@ -157,25 +148,6 @@ body.layout-intro{
> a{
-webkit-font-smoothing: antialiased;
padding: 6px 15px;
&:hover{
&:before{
left: $child-active-state;
}
}
&:before{
opacity: .75;
content: '';
position: absolute;
width: 5px;
height: 7px;
top: 12px;
left: $child-default-state;
overflow: hidden;
//background: url(triangle-sprite.png) 0 -13px no-repeat;
//@include img-retina("triangle-sprite.png", "triangle-sprite@2x.png", 5px, 19px);
}
}
}
}
@ -202,16 +174,17 @@ body.layout-intro{
p, li, .alert {
color: $blue-dark;
font-size: 18px;
font-size: $docs-font-size;
font-family: $font-family-open-sans;
font-weight: $font-weight-reg;
line-height: 1.84em;
margin: 0 0 18px;
margin: 0 0 $docs-font-size;
-webkit-font-smoothing: antialiased;
}
pre {
margin: 0 0 18px;
font-size: ($docs-font-size - 3);
margin: 0 0 $docs-font-size;
// This will force the code to scroll horizontally on small screens
// instead of wrapping.
@ -223,14 +196,10 @@ body.layout-intro{
a{
color: $green-dark;
border-bottom: 1px solid $green-dark;
@include transition(all 300ms ease-in);
text-decoration: none;
&:hover{
color: $blue-dark;
border-bottom: 2px solid $blue-dark;
text-decoration: none;
@include transition(all 300ms ease-in);
text-decoration: underline;
}
}
@ -243,7 +212,7 @@ body.layout-intro{
h1, .h1, h2, .h2, h3, .h3, h4, .h4{
color: $gray-dark;
margin-top: 54px;
margin-bottom: 18px;
margin-bottom: $docs-font-size;
@include open-sb();
}

View File

@ -75,18 +75,6 @@
</ul>
</li>
<li<%= sidebar_current("docs-upgrade") %>>
<a href="/docs/upgrade/index.html">Upgrading</a>
<ul class="nav">
<li<%= sidebar_current("docs-upgrade-upgrading") %>>
<a href="/docs/upgrade/index.html">Upgrading Nomad</a>
</li>
<li<%= sidebar_current("docs-upgrade-specific") %>>
<a href="/docs/upgrade/upgrade-specific.html">Specific Version Details</a>
</li>
</ul>
</li>
<li<%= sidebar_current("docs-drivers") %>>
<a href="/docs/drivers/index.html">Task Drivers</a>
<ul class="nav">
@ -205,6 +193,8 @@
</ul>
</li>
<hr>
<li<%= sidebar_current("docs-http") %>>
<a href="/docs/http/index.html">HTTP API</a>
</li>
@ -230,8 +220,20 @@
</ul>
</li>
<li<%= sidebar_current("docs-upgrade") %>>
<a href="/docs/upgrade/index.html">Upgrading</a>
<ul class="nav">
<li<%= sidebar_current("docs-upgrade-upgrading") %>>
<a href="/docs/upgrade/index.html">Upgrading Nomad</a>
</li>
<li<%= sidebar_current("docs-upgrade-specific") %>>
<a href="/docs/upgrade/upgrade-specific.html">Specific Version Details</a>
</li>
</ul>
</li>
<li<%= sidebar_current("docs-faq") %>>
<a href="/docs/faq.html">Frequently Asked Questions</a>
<a href="/docs/faq.html">FAQ</a>
</li>
</ul>
</div>