Merge pull request #2075 from jackmu95/fix-styleguide-trigger-positioning

fix(footer): Improve styleguide trigger positioning
This commit is contained in:
Alex Wolfe 2016-09-23 11:09:17 -07:00 committed by GitHub
commit 4bb79953be
2 changed files with 23 additions and 19 deletions

View File

@ -52,6 +52,6 @@ else
li <a href="https://angular.cn/">中文版</a>
footer(class="background-midnight")
small.text-caption Powered by Google ©2010-2016. Code licensed under an <a href="/license" class="text-snow">MIT-style License</a>. Documentation licensed under <a class="text-snow" href="http://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.
a(aria-label="View Style Guide" href=styleguide title="Style Guide" class="styleguide-trigger text-snow")
small.text-caption Powered by Google ©2010-2016. Code licensed under an <a href="/license">MIT-style License</a>. Documentation licensed under <a href="http://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.
a(aria-label="View Style Guide" href=styleguide title="Style Guide" class="styleguide-trigger")
span.icon-favorite

View File

@ -80,30 +80,34 @@
footer {
text-align: left;
padding: ($unit * 2) ($unit * 6);
position: relative;
@include respond-to('mobile') {
text-align: center;
}
a {
color: $snow;
}
.styleguide-trigger {
box-sizing: border-box;
position: absolute;
display: inline-block;
bottom: $unit * 2;
right: $unit * 2;
font-size: 14px;
line-height: 24px;
height: 24px;
margin: 0;
padding: 0 ($unit * 3);
opacity: .24;
transition: all .3s;
color: $darkgrey;
text-decoration: none;
float: right;
transition: color .3s;
@include respond-to('mobile') {
display: block;
margin-top: $unit;
font-size: 18px;
float: none;
}
&:hover {
background: $blue-grey-700;
text-decoration: none;
color: $red-600;
}
.icon-favorite {
display: inline-block;
line-height: 24px;
line-height: 20px;
}
}
}