diff --git a/_src/_assets/styl/_kremalicious/code.styl b/_src/_assets/styl/_kremalicious/code.styl index afc673be..a0fe0d61 100644 --- a/_src/_assets/styl/_kremalicious/code.styl +++ b/_src/_assets/styl/_kremalicious/code.styl @@ -36,6 +36,8 @@ pre line-height: $line-height color: $code-color background-color: $code-bg + margin-left: -($spacer) + margin-right: -($spacer) // make 'em scrollable overflow: scroll diff --git a/_src/_assets/styl/_kremalicious/content-photo.styl b/_src/_assets/styl/_kremalicious/content-photo.styl index 3433a5e1..0f36549c 100644 --- a/_src/_assets/styl/_kremalicious/content-photo.styl +++ b/_src/_assets/styl/_kremalicious/content-photo.styl @@ -69,6 +69,12 @@ .photo-link display: block + &, + &:hover, + &:focus, + &:active + box-shadow: none + &:hover img border-color: $link-color diff --git a/_src/_assets/styl/_kremalicious/content-related.styl b/_src/_assets/styl/_kremalicious/content-related.styl index dc2b0b66..d3654191 100644 --- a/_src/_assets/styl/_kremalicious/content-related.styl +++ b/_src/_assets/styl/_kremalicious/content-related.styl @@ -18,13 +18,13 @@ @extend .media-frame .post-title - @extend .h5, .transition + @extend .h5, .transition, .text-dimmed margin-top: ($spacer / 3) margin-bottom: 0 padding: 0 2px .post-title-link - @extend .transition + @extend .transition, .link--nounderline display: block &:hover, diff --git a/_src/_assets/styl/_kremalicious/content.styl b/_src/_assets/styl/_kremalicious/content.styl index aa166168..44c1348a 100644 --- a/_src/_assets/styl/_kremalicious/content.styl +++ b/_src/_assets/styl/_kremalicious/content.styl @@ -57,6 +57,9 @@ margin-top: 0 margin-bottom: $spacer + a + @extend .link--nounderline + .format-link & @extend .h3 @@ -123,6 +126,9 @@ @extend .small margin-top: ($spacer*2) + a + @extend .link--nounderline + .byline, .time, .tags, @@ -150,7 +156,7 @@ margin-bottom: ($spacer/2) .category - @extend .h6, .textcenter, .mini + @extend .h6, .textcenter, .mini, .link--nounderline color: $text-color line-height: 1 text-transform: uppercase @@ -171,6 +177,7 @@ color: #fff .tag + @extend .link--nounderline color: $text-color margin-right: 5px diff --git a/_src/_assets/styl/_kremalicious/footer.styl b/_src/_assets/styl/_kremalicious/footer.styl index 1989f881..8fba6879 100644 --- a/_src/_assets/styl/_kremalicious/footer.styl +++ b/_src/_assets/styl/_kremalicious/footer.styl @@ -16,6 +16,9 @@ color: $text-color-light line-height: $spacer + a + @extend .link--nounderline + .footer-description @extend .h5 a @@ -44,7 +47,7 @@ margin: 0 .link - @extend .textcenter + @extend .textcenter, .link--nounderline width: 42px padding: $padding-small-vertical margin: 0 diff --git a/_src/_assets/styl/_kremalicious/header.styl b/_src/_assets/styl/_kremalicious/header.styl index 51d73c1d..5f336ca2 100644 --- a/_src/_assets/styl/_kremalicious/header.styl +++ b/_src/_assets/styl/_kremalicious/header.styl @@ -58,7 +58,7 @@ @extend .logo .header__logo - @extend .ir + @extend .ir, .link--nounderline // repeat logo // but display hover version @extend .logo diff --git a/_src/_assets/styl/_kremalicious/layout.styl b/_src/_assets/styl/_kremalicious/layout.styl index dfb19452..f6397264 100644 --- a/_src/_assets/styl/_kremalicious/layout.styl +++ b/_src/_assets/styl/_kremalicious/layout.styl @@ -35,7 +35,10 @@ border-bottom: 1px solid rgba(255,255,255,.7) box-shadow: 0 1px 4px alpha($brand-dark, .1), 0 -1px 4px alpha($brand-dark, .2) - transform: translate3d(0,-($spacer*7.2),0) + transform: translate3d(0,-($spacer*7.7),0) + + @media $screen-xs + transform: translate3d(0,-($spacer*7.2),0) @media $screen-sm transform: translate3d(0,-($spacer*5),0) diff --git a/_src/_assets/styl/_kremalicious/media.styl b/_src/_assets/styl/_kremalicious/media.styl index 08a873fa..e9f6e843 100644 --- a/_src/_assets/styl/_kremalicious/media.styl +++ b/_src/_assets/styl/_kremalicious/media.styl @@ -44,6 +44,10 @@ img.aligncenter .media-frame @extend .transition - border: 2px solid transparent + border-top: 2px solid transparent + border-bottom: 2px solid transparent border-radius: $border-radius-base box-shadow: 0 1px 3px alpha($brand-grey,.2) + + @media $screen-sm + border: 2px solid transparent diff --git a/_src/_assets/styl/_kremalicious/navigation.styl b/_src/_assets/styl/_kremalicious/navigation.styl index 8ea623d0..beca6efe 100644 --- a/_src/_assets/styl/_kremalicious/navigation.styl +++ b/_src/_assets/styl/_kremalicious/navigation.styl @@ -63,7 +63,7 @@ opacity: 1 .nav-link - @extend .category + @extend .link--nounderline, .category font-size: $font-size-small text-shadow: 0 1px 0 rgba(#fff, .5) padding: $padding-base-horizontal @@ -85,6 +85,7 @@ margin-bottom: -5px .paginator__link + @extend .link--nounderline width: 2rem height: 2rem line-height: 1.7 diff --git a/_src/_assets/styl/_kremalicious/tagcloud.styl b/_src/_assets/styl/_kremalicious/tagcloud.styl index ad49cc1e..3c535136 100644 --- a/_src/_assets/styl/_kremalicious/tagcloud.styl +++ b/_src/_assets/styl/_kremalicious/tagcloud.styl @@ -1,3 +1,4 @@ .tagcloud__tag + @extend .link--nounderline padding: .3rem .5rem diff --git a/_src/_assets/styl/_kremalicious/typography.styl b/_src/_assets/styl/_kremalicious/typography.styl index a8f7def4..12640f31 100644 --- a/_src/_assets/styl/_kremalicious/typography.styl +++ b/_src/_assets/styl/_kremalicious/typography.styl @@ -10,7 +10,10 @@ // Body reset html - font-size: $font-size-root + font-size: $font-size-root-xs + + @media $screen-xs + font-size: $font-size-root @media $screen-lg font-size: $font-size-root-lg @@ -117,25 +120,35 @@ h6, .h6 // Links ///////////////////////////////////// -a +a, +.link color: $link-color text-decoration: none - transition: color .2s ease-in-out + transition: .2s ease-in-out + box-shadow: 0 1px 0 rgba($link-color, 40%) &:hover, &:focus outline: 0 color: $link-color-hover + box-shadow: 0 1px 0 rgba($link-color-hover, 70%) &:active transition: none color: darken($link-color, 30%) + box-shadow: 0 1px 0 darken($link-color, 30%) h1 &, h2 &, h3 & color: $headings-color +.link--nounderline + &, + &:hover, + &:focus, + &:active + box-shadow: none // Lists ///////////////////////////////////// @@ -233,7 +246,9 @@ hr margin-bottom: ($spacer*2) .large - font-size: $font-size-large + font-size: $font-size-large-xs + @media $screen-xs + font-size: $font-size-large .small font-size: $font-size-small diff --git a/_src/_assets/styl/_kremalicious/variables.styl b/_src/_assets/styl/_kremalicious/variables.styl index dbdb5362..2faefccc 100644 --- a/_src/_assets/styl/_kremalicious/variables.styl +++ b/_src/_assets/styl/_kremalicious/variables.styl @@ -40,10 +40,12 @@ $text-color-light = $brand-grey-light // Typography ///////////////////////////////////// +$font-size-root-xs = 16px $font-size-root = 18px $font-size-root-lg = 20px $font-size-base = 1rem +$font-size-large-xs = 1.15rem $font-size-large = 1.45rem $font-size-small = 0.8rem $font-size-mini = 0.6rem diff --git a/_src/tag.html b/_src/tag.html index 61747ae1..cd9d65bf 100644 --- a/_src/tag.html +++ b/_src/tag.html @@ -12,7 +12,7 @@ title: tags
{% for tag in site.tags %} - + {{ tag | first }}