Neatened up masthead & added a blog description

This commit is contained in:
Barry Clark 2014-04-30 09:18:14 -04:00
parent bf24977d08
commit a7bbdb4cef
3 changed files with 17 additions and 12 deletions

View file

@ -23,6 +23,7 @@
<header class="masthead"> <header class="masthead">
<a href="/" class="site-name"><img src="{{ site.avatar }}" class="avatar" /></a> <a href="/" class="site-name"><img src="{{ site.avatar }}" class="avatar" /></a>
<a href="/" class="site-name">{{ site.name }}</a> <a href="/" class="site-name">{{ site.name }}</a>
<br><br>
<p class="site-description">{{ site.description }}</p> <p class="site-description">{{ site.description }}</p>
<nav> <nav>

View file

@ -17,7 +17,7 @@ html {
} }
body { body {
max-width: 680px; max-width: 740px;
margin: 0 auto; margin: 0 auto;
background: $white; background: $white;
@ -146,9 +146,9 @@ img {
.avatar { .avatar {
float: left; float: left;
width: 35px; width: 70px;
margin-right: 10px; margin-right: 15px;
border-radius: 5px; border-radius: 5px;
} }
@ -157,7 +157,7 @@ img {
font-family: $helveticaNeue; font-family: $helveticaNeue;
font-weight: 300; font-weight: 300;
font-size: 24px; font-size: 31px;
letter-spacing: 1px; letter-spacing: 1px;
@include mobile { @include mobile {
font-size: 22px; font-size: 22px;
@ -173,12 +173,14 @@ img {
.site-description { .site-description {
float: left; float: left;
font-size: 14px; font-size: 16px;
display: none; margin: 0;
margin-top: -5px;
} }
nav { nav {
float: right; float: right;
margin-top: -25px; // @TODO - containers for nav and content blocks in header
font-family: $helveticaNeue; font-family: $helveticaNeue;
font-size: 18px; font-size: 18px;

View file

@ -318,7 +318,7 @@ html {
font-size: 100%; } font-size: 100%; }
body { body {
max-width: 680px; max-width: 740px;
margin: 0 auto; margin: 0 auto;
background: white; background: white;
font: 18px/1.4 Helvetica, Arial, sans-serif; font: 18px/1.4 Helvetica, Arial, sans-serif;
@ -414,15 +414,15 @@ img {
.avatar { .avatar {
float: left; float: left;
width: 35px; width: 70px;
margin-right: 10px; margin-right: 15px;
border-radius: 5px; } border-radius: 5px; }
.site-name { .site-name {
float: left; float: left;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 300; font-weight: 300;
font-size: 24px; font-size: 31px;
letter-spacing: 1px; letter-spacing: 1px;
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
@ -435,11 +435,13 @@ img {
.site-description { .site-description {
float: left; float: left;
font-size: 14px; font-size: 16px;
display: none; } margin: 0;
margin-top: -5px; }
nav { nav {
float: right; float: right;
margin-top: -25px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 18px; } font-size: 18px; }
@media screen and (max-width: 520px) { @media screen and (max-width: 520px) {