steffen/website
1
0
Fork 0
Code Actions Packages Releases Activity

Make typography refinements

Browse Source
This commit is contained in:
Michael Rose
2016-03-30 22:20:55 -04:00
parent 8a58559144
commit 7a41a04dcc
12 changed files with 69 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
assets/_scss/_archive.scss
View File

@ -41,6 +41,7 @@
}
.archive__item-excerpt {
margin-top: 0;
font-size: $type-size-6;
& + p {

6
assets/_scss/_base.scss
View File

@ -7,7 +7,7 @@ body {
padding: 0;
color: $text-color;
font-family: $serif;
line-height: 1.45;
line-height: 1.5;
background-color: $background-color;
&.overflow--hidden {
@ -20,6 +20,7 @@ h1, h2, h3, h4, h5, h6 {
margin: 1.414em 0 0.5em;
line-height: 1.2;
font-family: $sans-serif;
font-weight: bold;
}
h1 {
@ -99,8 +100,7 @@ blockquote {
cite {
font-family: $sans-serif;
font-size: $type-size-6;
font-style: normal;
font-style: italic;
&:before {
content: "\2014";

2
assets/_scss/_buttons.scss
View File

@ -148,6 +148,6 @@
/* small button */
&--small {
font-size: $type-size-7;
font-size: $type-size-6;
}
}

6
assets/_scss/_footer.scss
View File

@ -7,6 +7,7 @@
@include clearfix;
margin-top: 3em;
padding: 0 2em 3em;
color: mix(#fff, $gray, 25%);
@include breakpoint($large) {
padding-left: 1em;
@ -27,6 +28,9 @@
}
.page__footer-copyright {
font-family: $sans-serif;
font-size: $type-size-7;
@include breakpoint($large) {
@include prefix(2 of 12);
}
@ -34,8 +38,6 @@
@include breakpoint($x-large) {
@include prefix(2.5 of 12);
}
font-size: $type-size-6;
}
.page__footer-follow {

14
assets/_scss/_navigation.scss
View File

@ -188,10 +188,10 @@
position: absolute;
height: 100%;
right: 0;
padding: 0 10px;
padding: 0 8px;
border: 0;
outline: none;
background-color: #000;
background-color: $primary-color;
color: #fff;
cursor: pointer;
}
@ -306,11 +306,11 @@
========================================================================== */
.nav__list {
font-size: 1.5rem;
font-size: 1.25rem;
a {
display: block;
padding: 4px 0;
padding: 0.125em 0;
&:hover {
text-decoration: underline;
@ -325,7 +325,7 @@
.nav__title {
margin: 0;
padding: 10px 20px;
padding: 0.5em 1em;
font-family: $sans-serif-narrow;
font-size: $type-size-5;
font-weight: bold;
@ -334,8 +334,8 @@
.nav__sub-title {
display: block;
margin: 10px 0;
padding: 10px 0;
margin: 0.5em 0;
padding: 0.5em 0;
font-family: $sans-serif-narrow;
font-size: $type-size-5;
font-weight: bold;

15
assets/_scss/_page.scss
View File

@ -42,8 +42,6 @@
.page__title {
margin-top: 0;
font-family: $serif;
font-weight: normal;
line-height: 1;
& + .page__meta {
margin-top: -0.5em;
@ -75,11 +73,24 @@
dt {
margin-top: 1em;
font-family: $sans-serif;
font-weight: bold;
}
dd {
margin-left: 1em;
font-family: $sans-serif;
font-size: $type-size-6;
}
.small {
font-size: $type-size-6;
}
/* blockquote citations */
blockquote + .small {
margin-top: -1.5em;
padding-left: 1.25rem;
}
}

23
assets/_scss/_sidebar.scss
View File

@ -9,6 +9,7 @@
.sidebar {
@include clearfix();
margin-bottom: 1em;
color: mix(#fff, $gray, 25%);
@include breakpoint($large) {
@include span(2 of 12);
@ -23,23 +24,27 @@
font-family: $sans-serif-narrow;
}
h3 {
font-size: $type-size-4;
}
h4 {
font-size: $type-size-4;
h3, h4 {
font-size: $type-size-5;
}
p, li {
font-family: $sans-serif;
font-size: $type-size-6;
line-height: 1.45;
line-height: 1.5;
}
img {
width: 100%;
}
a {
color: mix(#fff, $gray, 25%);
&:hover {
color: $link-color-hover;
}
}
}
.sidebar__right {
@ -109,10 +114,6 @@
.sidebar .author__name {
font-family: $sans-serif;
font-size: $type-size-5;
@include breakpoint($large) {
font-size: $type-size-4;
}
}
.author__bio {

7
assets/_scss/_tables.scss
View File

@ -7,7 +7,7 @@ table {
font-family: $sans-serif;
font-size: $type-size-6;
border-collapse: collapse;
border-bottom: 2px solid $border-color;
border: 2px solid $border-color;
& + table {
margin-top: 1em;
@ -15,6 +15,7 @@ table {
}
thead {
background-color: $lighter-gray;
border-bottom: 2px solid $border-color;
}
@ -22,11 +23,13 @@ th {
padding: 0.5em;
font-weight: bold;
text-align: left;
border-right: 2px solid $border-color;
}
td {
border-bottom: 1px solid $border-color;
padding: 0.5em;
border-bottom: 2px solid $border-color;
border-right: 2px solid $border-color;
}
tr, td, th {

14
assets/_scss/_utilities.scss
View File

@ -160,6 +160,10 @@ body:hover .visually-hidden button {
// social icons
.social-icons {
.fa {
color: #000;
}
.fa-behance,
.fa-behance-square {
color: $behance-color;
@ -268,7 +272,7 @@ body:hover .visually-hidden button {
Navicons
========================================================================== */
$navicon-width : 32px;
$navicon-width : 28px;
$navicon-height : 4px;
.navicon {
@ -357,7 +361,14 @@ $navicon-height : 4px;
Footnotes
========================================================================== */
.footnote {
color: mix(#fff, $gray, 25%);
text-decoration: none;
}
.footnotes {
color: mix(#fff, $gray, 25%);
ol, li, p {
margin-bottom: 0;
font-size: $type-size-6;
@ -365,6 +376,7 @@ $navicon-height : 4px;
}
a.reversefootnote {
color: $gray;
text-decoration: none;
&:hover {

14
assets/_scss/_variables.scss
View File

@ -29,14 +29,13 @@ $calisto : "Calisto MT", serif;
$garamond : Garamond, serif;
/* type scale */
$type-size-1 : 3.998em;
$type-size-2 : 2.827em;
$type-size-3 : 1.999em;
$type-size-4 : 1.414em;
$type-size-1 : 2.441em;
$type-size-2 : 1.953em;
$type-size-3 : 1.563em;
$type-size-4 : 1.25em;
$type-size-5 : 1em;
$type-size-6 : 0.707em;
$type-size-7 : 0.5em;
$type-size-8 : 0.354em;
$type-size-6 : 0.8em;
$type-size-7 : 0.7em;
/*
@ -51,6 +50,7 @@ $lighter-gray : mix(#fff, $gray, 90%);
$body-color : #fff;
$background-color : #f5f5f5;
$code-background-color : #fff;
$code-background-color-dark : #1b1a24;
$text-color : #333332;
$border-color : $lighter-gray;
$base-color : #343434;

2
assets/css/main.css
View File

File diff suppressed because one or more lines are too long