/**
* Site header */
.site-header {
border-top: 5px solid $grey-color-dark; border-bottom: 1px solid $grey-color-light; //min-height: 56px; // Positioning context for the mobile navigation icon position: fixed; width: 100%; background-color: #fff; .site-title { font-size: 26px; font-weight: 300; line-height: 56px; letter-spacing: -1px; margin-bottom: 0; float: left; color: $grey-color-dark; &:hover { color: $grey-color; } } .nav { float: right; line-height: 56px; font-size: 16px; .nav-icon { display: none; } ul { margin: 0; padding: 0; list-style: none; li { display: inline; } } .nav-list { line-height: inherit; } .nav-item { color: $text-color; // Gaps between nav items, but not on the last one &:not(:last-child) { margin-right: 10px; } } @include media-query($on-palm) { position: absolute; top: 9px; right: $spacing-unit / 2; background-color: $background-color; border: 1px solid $grey-color-light; border-radius: 5px; text-align: right; .nav-icon { display: block; float: right; width: 36px; height: 26px; line-height: 0; padding-top: 10px; text-align: center; > svg { width: 18px; height: 15px; path { fill: $grey-color-dark; } } } .trigger { clear: both; display: none; } &:hover .trigger { display: block; padding-bottom: 5px; } ul { margin: 0; padding: 0; list-style: none; li { display: block; } } .nav-list { line-height: inherit; } .nav-item { display: block; padding: 5px 10px; &:not(:last-child) { margin-right: 0; } margin-left: 20px; } } }
}
.site-body {
min-height: 500px; padding-top: 62px;
}
/**
* Site footer */
.site-footer {
border-top: 1px solid $grey-color-light; padding: $spacing-unit 0; .copyright { text-align: center; }
}
/**
* Page */
.page {
.page-header { margin: $spacing-unit 0; .page-title { font-size: 32px; } } .page-content { margin-bottom: $spacing-unit; .post-list { margin-left: 0; list-style: none; } }
}
/**
* Post */
.post {
.post-header { margin: $spacing-unit 0; .post-title { font-size: 28px; letter-spacing: -1px; line-height: 1; display: inline-block; @include media-query($on-laptop) { font-size: 26px; } } .post-meta { margin-left: 5px; font-size: $small-font-size; color: $grey-color; display: inline-block; } } .post-content { margin-bottom: $spacing-unit; h2 { font-size: 26px; @include media-query($on-laptop) { font-size: 22px; } } h3 { font-size: 24px; @include media-query($on-laptop) { font-size: 20px; } } h4 { font-size: 22px; @include media-query($on-laptop) { font-size: 18px; } } }
}
.comments {
border-top: 1px solid $grey-color-light; padding: $spacing-unit 0;
}