diff options
| -rw-r--r-- | _config.yml | 5 | ||||
| -rw-r--r-- | _includes/site.scss | 101 | ||||
| -rw-r--r-- | _layouts/blog.html | 2 | ||||
| -rw-r--r-- | index.html | 2 |
4 files changed, 80 insertions, 30 deletions
diff --git a/_config.yml b/_config.yml index 26be7f0..e1c35a6 100644 --- a/_config.yml +++ b/_config.yml @@ -15,6 +15,7 @@ keywords: - ben burwell - software engineer - developer - - web applications -description: "I like to make awesome things with code. Software engineer, student, hacker. Passionate about kerning and coffee." + - cryptography + - lighting design +description: "I make things." excerpt_separator: <!--more--> diff --git a/_includes/site.scss b/_includes/site.scss index 7114029..4d804ac 100644 --- a/_includes/site.scss +++ b/_includes/site.scss @@ -1,10 +1,12 @@ -$dark-gray: #444; -$medium-gray: #888; +$background-color: #091f2e; +$base-text-color: #33859E; +$muted-text-color: #245361; $light-gray: #ddd; -$primary-color: #FF6639; -$link-color: #476AE0; +$heading-color: #d26937; +$link-color: #c23127; +$emphasis-color: #99d1ce; -$base-font-size: 22px; +$base-font-size: 20px; $monospace: monospace; $container-width: 1200px; @@ -16,15 +18,16 @@ $container-width: 1200px; } .muted { - color: $medium-gray; + color: $muted-text-color; } body { font-family: $monospace; - color: $dark-gray; + color: $base-text-color; font-size: $base-font-size; padding: 5rem 0 0 0; margin: 0; + background-color: $background-color; } header { @@ -36,9 +39,22 @@ header { padding: 0; margin: 0; text-align: center; - background-color: rgba(255, 255, 255, 0.9); + background-color: $background-color; z-index: 10; - border-bottom: 1px solid $light-gray; + //border-bottom: 1px solid $light-gray; + + a.nav-up { + display: block; + color: $base-text-color; + padding: 1rem; + font-size: 1.5rem; + font-weight: bold; + + &:hover, + &:focus { + color: $link-color; + } + } } footer { @@ -51,18 +67,33 @@ section { padding-left: 5rem; } -h1 { +h1, +h2 { @include container; - color: $primary-color; - font-size: 2rem; + color: $heading-color; font-weight: bold; + + a { + color: $heading-color; + } +} + +h1 { + font-size: 2rem; +} + +h1::before { + display: inline; + content: '# '; } h2 { - @include container; - color: $primary-color; font-size: 1.5rem; - font-weight: bold; +} + +h2::before { + display: inline; + content: '## '; } table { @@ -75,7 +106,8 @@ td { p { @include container; - line-height: 2rem; + line-height: 3rem; + margin-bottom: 3rem; } ol, ul { @@ -83,7 +115,7 @@ ol, ul { } li { - margin-left: 2rem; + margin-left: 4rem; margin-right: 2rem; padding: 1rem; } @@ -95,11 +127,11 @@ pre { } kbd { - color: $primary-color; + color: $emphasis-color; } code { - color: $medium-gray; + color: $emphasis-color; } hr { @@ -126,11 +158,14 @@ blockquote { } a { - color: $dark-gray; + color: $base-text-color; text-decoration: underline; - &:hover { - color: $primary-color; - border-bottom-color: $primary-color; + + &:hover, + &:focus { + color: $link-color; + border-bottom-color: $link-color; + outline: none; } } @@ -154,7 +189,7 @@ aside { margin-left: 1rem; } a { - color: $medium-gray; + color: $muted-text-color; } } @@ -186,8 +221,8 @@ aside { .highlight { margin: 0; - padding: 1rem; - background-color: $dark-gray; + padding: 0 2rem; + font-size: 1rem; } .highlight pre { @@ -201,3 +236,17 @@ aside { .footer-link:last-of-type::after { content: ''; } + +.highlight { + .s { + color: #2aa889; + } + + .nt { + color: #edb443; + } + + .na { + color: $muted-text-color; + } +} diff --git a/_layouts/blog.html b/_layouts/blog.html index e245dc1..21ff3e7 100644 --- a/_layouts/blog.html +++ b/_layouts/blog.html @@ -2,7 +2,7 @@ layout: master --- <header> - <h1><a href="../">../</a></h1> + <a class="nav-up" href="../">../</a> </header> <main> {{ content }} @@ -1,6 +1,6 @@ --- layout: master -title: Ben Burwell - Software Engineer +title: "Ben Burwell: code + crypto + coffee + kerning" --- <div class="home"> |