Update labels, and colors, and things

This commit is contained in:
Michael Rose 2016-03-22 22:59:39 -04:00
parent f029ce6e25
commit 0feeb21821
15 changed files with 212 additions and 69 deletions

View file

@ -249,6 +249,7 @@ author:
steam :
tumblr :
twitter : *twitter
vine :
weibo :
xing :
youtube :

View file

@ -17,7 +17,7 @@ en: &DEFAULT_EN
date_label : "Last Updated:"
comments_label : "Leave a Comment"
related_label : "You May Also Enjoy"
follow_label : "Follow "
follow_label : "Follow:"
feed_label : "Feed"
powered_by : "Powered by"
en_US:

View file

@ -19,7 +19,7 @@
<div class="author__urls-wrapper">
<button class="btn btn--inverse">Follow</button>
<ul class="author__urls">
<ul class="author__urls social-icons">
{% if author.uri %}
<li><a href="{{ author.uri }}" target="_blank"><i class="fa fa-fw fa-globe"></i>Website</a></li>
{% endif %}
@ -54,7 +54,7 @@
<li><a href="http://stackoverflow.com/users/{{ author.stackoverflow }}" target="_blank"><i class="fa fa-fw fa-stack-overflow"></i> Stackoverflow</a></li>
{% endif %}
{% if author.lastfm %}
<li><a href="http://lastfm.com/user/{{ author.lastfm }}" target="_blank"><i class="fa fa-fw fa-music"></i> Last.fm</a></li>
<li><a href="http://lastfm.com/user/{{ author.lastfm }}" target="_blank"><i class="fa fa-fw fa-lastfm-square"></i> Last.fm</a></li>
{% endif %}
{% if author.dribbble %}
<li><a href="http://dribbble.com/{{ author.dribbble }}" target="_blank"><i class="fa fa-fw fa-dribbble"></i> Dribbble</a></li>
@ -83,6 +83,9 @@
{% if author.codepen %}
<li><a href="http://codepen.io/{{ author.codepen }}" target="_blank"><i class="fa fa-fw fa-codepen"></i> CodePen</a></li>
{% endif %}
{% if author.vine %}
<li><a href="https://vine.co/u/{{ author.vine }}" target="_blank"><i class="fa fa-fw fa-vine"></i> Vine</a></li>
{% endif %}
</ul>
</div>
</div>

View file

@ -15,7 +15,7 @@
{% endif %}
<div class="page__footer-follow">
<ul>
<ul class="social-icons">
{% if site.data.ui-text[site.locale].follow_label %}
<li><strong>{{ site.data.ui-text[site.locale].follow_label }}</strong></li>
{% endif %}

View file

@ -164,8 +164,8 @@ li code,
figcaption code {
padding-top: 0.1rem;
padding-bottom: 0.1rem;
background: mix(#fff, $light-gray, 40%);
border: 1px solid $light-gray;
background: mix(#fff, $lighter-gray, 20%);
border: 1px solid $lighter-gray;
border-radius: $border-radius;
&:before, &:after {

View file

@ -49,12 +49,13 @@
/* for dark backgrounds */
&--inverse {
color: currentColor !important;
border: 1px solid currentColor !important; // override
color: $gray !important;
border: 1px solid $light-gray !important; // override
background-color: #fff;
&:hover {
background-color: mix(#000, #fff, 20%);
color: #fff !important;
border-color: $gray;
}
}

View file

@ -55,8 +55,10 @@
li {
display: inline-block;
padding-top: 5px;
padding-bottom: 5px;
font-family: $sans-serif-narrow;
font-size: 16px;
font-size: 14px;
text-transform: uppercase;
}
@ -66,6 +68,7 @@
}
a {
padding-right: 10px;
font-weight: bold;
}
}

View file

@ -64,10 +64,4 @@
list-style-type: none;
font-size: 16px;
white-space: nowrap;
a {
&:hover {
color: $gray;
}
}
}

View file

@ -75,8 +75,14 @@
a {
display: block;
padding: 10px 20px;
margin: 0 20px;
padding: 10px 0;
color: $gray;
text-decoration: none;
&:hover {
color: #000;
}
}
button {
@ -99,17 +105,27 @@
&:first-child {
font-weight: bold;
a {
padding-left: 0;
margin-left: 0;
}
}
&:last-child {
a {
padding-right: 0;
margin-right: 0;
}
}
}
a {
border-bottom: 4px solid transparent;
&:hover {
color: #000;
border-bottom-color: $border-color;
}
}
}
.hidden-links {
@ -124,7 +140,14 @@
box-shadow: 0 0 10px rgba(#000, 0.25);
a {
margin: 0;
padding: 10px 20px;
font-size: 0.8em;
&:hover {
color: #000;
background: $border-color;
}
}
&:before {
@ -156,6 +179,7 @@
li {
display: block;
border-bottom: 1px solid $border-color;
&:last-child {
border-bottom: none;
}

View file

@ -52,7 +52,7 @@
}
code {
background-color: mix(#fff, $notice-color, 70%)
background-color: mix(#fff, $notice-color, 95%)
}
}

View file

@ -214,6 +214,8 @@
display: block;
margin-bottom: 5px;
padding-right: 5px;
padding-top: 2px;
padding-bottom: 2px;
font-size: 14px;
text-decoration: none;
white-space: nowrap;

View file

@ -36,7 +36,7 @@
&:hover {
color: #000;
background: $border-color;
background: $lighter-gray;
}
}

View file

@ -153,6 +153,112 @@ body:hover .visually-hidden button {
vertical-align: middle;
}
// social icons
.social-icons {
.fa-behance,
.fa-behance-square {
color: $behance-color;
}
.fa-dribbble {
color: $dribbble-color;
}
.fa-facebook,
.fa-facebook-square {
color: $facebook-color;
}
.fa-twitter,
.fa-twitter-square {
color: $twitter-color;
}
.fa-flickr {
color: $flickr-color;
}
.fa-foursquare {
color: $foursquare-color;
}
.fa-github,
.fa-github-alt,
.fa-github-square {
color: $github-color;
}
.fa-google-plus,
.fa-google-plus-square {
color: $google-plus-color;
}
.fa-instagram {
color: $instagram-color;
}
.fa-lastfm,
.fa-lastfm-square {
color: $lastfm-color;
}
.fa-linkedin,
.fa-linkedin-square {
color: $linkedin-color;
}
.fa-pinterest,
.fa-pinterest-p,
.fa-pinterest-square {
color: $pinterest-color;
}
.fa-rss,
.fa-rss-square {
color: $rss-color;
}
.fa-soundcloud {
color: $soundcloud-color;
}
.fa-stack-exchange,
.fa-stack-overflow {
color: $stackoverflow-color;
}
.fa-tumblr,
.fa-tumblr-square {
color: $tumblr-color;
}
.fa-twitter,
.fa-twitter-square {
color: $twitter-color;
}
.fa-vimeo,
.fa-vimeo-square {
color: $vimeo-color;
}
.fa-vine {
color: $vine-color;
}
.fa-youtube,
.fa-youtube-square,
.fa-youtube-play {
color: $youtube-color;
}
.fa-xing,
.fa-xing-square {
color: $xing-color;
}
}
/*
Navicons

View file

@ -6,73 +6,82 @@
Typography
========================================================================== */
$doc-font-size : 16;
$doc-line-height : 26;
$paragraph-indent : false !default;
$indent-var : 0rem + ($doc-line-height / $doc-font-size);
$doc-font-size : 16;
$doc-line-height : 26;
$paragraph-indent : false !default;
$indent-var : 0rem + ($doc-line-height / $doc-font-size);
/* system typefaces */
$serif : Georgia, Times, serif;
$sans-serif : -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
$monospace : Monaco, Consolas, "Lucida Console", monospace;
$serif : Georgia, Times, serif;
$sans-serif : -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, sans-serif;
$monospace : Monaco, Consolas, "Lucida Console", monospace;
/* sans serif typefaces */
$sans-serif-narrow : $sans-serif;
$helvetica : Helvetica, "Helvetica Neue", Arial, sans-serif;
$sans-serif-narrow : $sans-serif;
$helvetica : Helvetica, "Helvetica Neue", Arial, sans-serif;
/* serif typefaces */
$georgia : Georgia, serif;
$times : Times, serif;
$bodoni : "Bodoni MT", serif;
$calisto : "Calisto MT", serif;
$garamond : Garamond, serif;
$georgia : Georgia, serif;
$times : Times, serif;
$bodoni : "Bodoni MT", serif;
$calisto : "Calisto MT", serif;
$garamond : Garamond, serif;
/*
Colors
========================================================================== */
$gray : #4c4c4c;
$dark-gray : #191413;
$light-gray : #e2e2e2;
$lighter-gray : #f9f9f9;
$gray : #4c4c4c;
$dark-gray : #191413;
$light-gray : mix(#fff, $gray, 70%);
$lighter-gray : mix(#fff, $gray, 90%);
$body-color : #fff;
$background-color : #fff;
$text-color : #333332;
$border-color : $light-gray;
$base-color : #343434;
$comp-color : spin($base-color, 180);
$accent-color : #000;
$body-color : #fff;
$background-color : #fff;
$text-color : #333332;
$border-color : $lighter-gray;
$base-color : #343434;
$comp-color : spin($base-color, 180);
$accent-color : #000;
/* buttons */
$primary-color : #000;
$success-color : #5cb85c;
$warning-color : #dd8338;
$danger-color : #C64537;
$info-color : #308cbc;
$primary-color : #000;
$success-color : #5cb85c;
$warning-color : #dd8338;
$danger-color : #C64537;
$info-color : #308cbc;
/* brands */
$facebook-color : #3b5998;
$flickr-color : #ff0084;
$foursquare-color : #0cbadf;
$google-plus-color : #dd4b39;
$instagram-color : #4e433c;
$linkedin-color : #4875b4;
$pinterest-color : #cb2027;
$rss-color : #fa9b39;
$tumblr-color : #2c4762;
$twitter-color : #55acee;
$vimeo-color : #1ab7ea;
$youtube-color : #ff3333;
$behance-color : #1769FF;
$dribbble-color : #ea4c89;
$facebook-color : #3b5998;
$flickr-color : #ff0084;
$foursquare-color : #0072b1;
$github-color : #171516;
$google-plus-color : #dd4b39;
$instagram-color : #517fa4;
$lastfm-color : #d51007;
$linkedin-color : #007bb6;
$pinterest-color : #cb2027;
$rss-color : #fa9b39;
$soundcloud-color : #ff3300;
$stackoverflow-color : #fe7a15;
$tumblr-color : #32506d;
$twitter-color : #55acee;
$vimeo-color : #1ab7ea;
$vine-color : #00bf8f;
$youtube-color : #bb0000;
$xing-color : #006567;
/* links */
$link-color : #343434;
$link-color-hover : darken($link-color, 10);
$link-color-visited : lighten($link-color-hover, 20);
$link-color-focus : darken($link-color-visited, 10);
$link-color : #343434;
$link-color-hover : darken($link-color, 10);
$link-color-visited : lighten($link-color-hover, 20);
$link-color-focus : darken($link-color-visited, 10);
$border-radius : 4px;
$border-radius : 4px;
/*

File diff suppressed because one or more lines are too long