diff --git a/sass/base/_layout.scss b/sass/base/_layout.scss index c347af1..f9f3a41 100644 --- a/sass/base/_layout.scss +++ b/sass/base/_layout.scss @@ -14,6 +14,10 @@ $sidebar-width-wide: 300px !default; $indented-lists: false !default; +$header-font-size: 1em !default; +$header-padding-top: 1.5em !default; +$header-padding-bottom: 1.5em !default; + .group { @include pie-clearfix; } @mixin collapse-sidebar { @@ -32,7 +36,10 @@ $indented-lists: false !default; &.thirds section { width: 30%; margin-left: 5%; - &.first { margin-left: 0; } + &.first { + margin-left: 0; + clear: both; + } } } @@ -41,7 +48,7 @@ body { max-width: $max-width; position: relative; margin: 0 auto; - > header, > nav, > footer, #content > article, #content > div > article, #content > div > section, nav.pagination { + > header, > nav, > footer, #content > article, #content > div > article, #content > div > section { @extend .group; padding-left: $pad-min; padding-right: $pad-min; @@ -58,10 +65,27 @@ body { padding-right: $pad-wide; } } + div.pagination { + @extend .group; + margin-left: $pad-min; + margin-right: $pad-min; + @media only screen and (min-width: 480px) { + margin-left: $pad-narrow; + margin-right: $pad-narrow; + } + @media only screen and (min-width: 768px) { + margin-left: $pad-medium; + margin-right: $pad-medium; + } + @media only screen and (min-width: 992px) { + margin-left: $pad-wide; + margin-right: $pad-wide; + } + } > header { - font-size: 1em; - padding-top: 1.5em; - padding-bottom: 1.5em; + font-size: $header-font-size; + padding-top: $header-padding-top; + padding-bottom: $header-padding-bottom; } } @@ -95,14 +119,14 @@ body.sidebar-footer { } @media only screen and (min-width: 550px) { - body > header { font-size: 1em; } + body > header { font-size: $header-font-size; } } @media only screen and (min-width: 750px) { aside.sidebar { @include collapse-sidebar; } } @media only screen and (min-width: 768px) { body { -webkit-text-size-adjust: auto; } - body > header { font-size: 1.2em; } + body > header { font-size: $header-font-size * 1.2; } #main { @extend .group; padding: 0; @@ -139,7 +163,7 @@ body.sidebar-footer { } @media only screen and (min-width: 992px) { - body > header { font-size: 1.3em; } + body > header { font-size: $header-font-size * 1.3; } #content { margin-right: $sidebar-width-wide; } #content { > div, > article { diff --git a/sass/base/_solarized.scss b/sass/base/_solarized.scss index 30cceb8..45d8fc5 100644 --- a/sass/base/_solarized.scss +++ b/sass/base/_solarized.scss @@ -18,17 +18,29 @@ $solar-green: #859900 !default; $solarized: dark !default; @if $solarized == light { - $base03: #fdf6e3; - $base02: #eee8d5; - $base01: #93a1a1; - $base00: #839496; - $base0: #657b83; - $base1: #586e75; - $base2: #073642; - $base3: #002b36; + + $_base03: $base03; + $_base02: $base02; + $_base01: $base01; + $_base00: $base00; + $_base0: $base0; + $_base1: $base1; + $_base2: $base2; + $_base3: $base3; + + $base03: $_base3; + $base02: $_base2; + $base01: $_base1; + $base00: $_base0; + $base0: $_base00; + $base1: $_base01; + $base2: $_base02; + $base3: $_base03; } /* non highlighted code colors */ $pre-bg: $base03 !default; -$pre-border: $base02 !default; +$pre-border: darken($base02, 5) !default; $pre-color: $base1 !default; + + diff --git a/sass/base/_theme.scss b/sass/base/_theme.scss index e5539b1..62e0689 100644 --- a/sass/base/_theme.scss +++ b/sass/base/_theme.scss @@ -23,6 +23,8 @@ $type-border: #ddd !default; /* Navigation */ $nav-bg: #ccc !default; +$nav-bg-front: image-url('noise.png') !default; +$nav-bg-back: linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11)) !default; $nav-color: darken($nav-bg, 38) !default; $nav-color-hover: darken($nav-color, 25) !default; $nav-placeholder: desaturate(darken($nav-bg, 10), 15) !default; @@ -46,6 +48,8 @@ $twitter-status-link: lighten($sidebar-link-color-subdued, 15) !default; $footer-color: #888 !default; $footer-bg: #ccc !default; +$footer-bg-front: image-url('noise.png') !default; +$footer-bg-back: linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11)) !default; $footer-color: darken($footer-bg, 38) !default; $footer-color-hover: darken($footer-color, 10) !default; $footer-border-top: lighten($footer-bg, 15) !default; diff --git a/sass/base/_typography.scss b/sass/base/_typography.scss index ef83065..b68753f 100644 --- a/sass/base/_typography.scss +++ b/sass/base/_typography.scss @@ -1,21 +1,30 @@ $blockquote: $type-border !default; -$mono: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; +$sans: "PT Sans", "Helvetica Neue", Arial, sans-serif !default; +$serif: "PT Serif", Georgia, Times, "Times New Roman", serif !default; +$mono: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace !default; +$heading-font-family: "PT Serif", "Georgia", "Helvetica Neue", Arial, sans-serif !default; +$header-title-font-family: $heading-font-family !default; +$header-subtitle-font-family: $heading-font-family !default; // Fonts .heading { - font-family: "PT Serif", "Georgia", "Helvetica Neue", Arial, sans-serif; + font-family: $heading-font-family; } -.sans { font-family: "PT Sans", "Helvetica Neue", Arial, sans-serif; } -.serif { font-family: "PT Serif", Georgia, Times, "Times New Roman", serif; } +.sans { font-family: $sans; } +.serif { font-family: $serif; } .mono { font-family: $mono; } body > header h1 { font-size: 2.2em; @extend .heading; + font-family: $header-title-font-family; font-weight: normal; line-height: 1.2em; margin-bottom: 0.6667em; } +body > header h2 { + font-family: $header-subtitle-font-family; +} body { line-height: 1.5em; @@ -56,12 +65,12 @@ h6, section h5, section section h4, section section section h3 { p, blockquote, ul, ol { margin-bottom: 1.5em; } ul { list-style-type: disc; - ul { list-style-type: circle; - ul { list-style-type: square; }}} + ul { list-style-type: circle; margin-bottom: 0px; + ul { list-style-type: square; margin-bottom: 0px; }}} ol { list-style-type: decimal; - ol { list-style-type: lower-alpha; - ol { list-style-type: lower-roman; }}} + ol { list-style-type: lower-alpha; margin-bottom: 0px; + ol { list-style-type: lower-roman; margin-bottom: 0px; }}} ul, ol { &, ul, ol { margin-left: 1.3em; }} @@ -115,7 +124,8 @@ blockquote { } } -.has-pullquote:before { +.pullquote-right:before, +.pullquote-left:before { /* Reset metrics. */ padding: 0; border: none; @@ -134,6 +144,13 @@ blockquote { font-size: 1.4em; line-height: 1.45em; } + +.pullquote-left:before { + /* Make left pullquotes align properly. */ + float: left; + margin: .5em 1.5em 1em 0; +} + /* @extend this to force long lines of continuous text to wrap */ .force-wrap { white-space: -moz-pre-wrap; diff --git a/sass/custom/_fonts.scss b/sass/custom/_fonts.scss new file mode 100644 index 0000000..1a6b2a0 --- /dev/null +++ b/sass/custom/_fonts.scss @@ -0,0 +1,10 @@ +// Here you can easily change font faces which are used in your site. +// To give it a try, uncomment some of the lines below rebuild your blog, and see how it works. your sites's. +// If you love to use Web Fonts, you also need to add some lines to source/_includes/custom/head.html + +//$sans: "Optima", sans-serif; +//$serif: "Baskerville", serif; +//$mono: "Courier", monospace; +//$heading-font-family: "Verdana", sans-serif; +//$header-title-font-family: "Futura", sans-serif; +//$header-subtitle-font-family: "Futura", sans-serif; diff --git a/sass/partials/_blog.scss b/sass/partials/_blog.scss index 88c71e9..d3ba48a 100644 --- a/sass/partials/_blog.scss +++ b/sass/partials/_blog.scss @@ -74,6 +74,8 @@ article { p.meta { margin-bottom: .8em; font-size: .85em; + clear: both; + overflow: hidden; } .byline + time:before, time +time:before, .comments:before, .byline ~ .categories:before { @extend .separator; @@ -121,14 +123,12 @@ article + article { display: inline-block; } -#content nav.pagination { +#content div.pagination { text-align: center; font-size: .95em; - div { - position: relative; - background: $img-border top left repeat-x; - padding: {top: 1.5em; bottom: 1.5em;} - } + position: relative; + background: $img-border top left repeat-x; + padding: {top: 1.5em; bottom: 1.5em;} a { text-decoration: none; color: $text-color-light; diff --git a/sass/partials/_footer.scss b/sass/partials/_footer.scss index e750342..3741122 100644 --- a/sass/partials/_footer.scss +++ b/sass/partials/_footer.scss @@ -4,7 +4,7 @@ body > footer { color: $footer-color; text-shadow: lighten($footer-bg, 5) 0 1px; background-color: $footer-bg; - @include background(image-url('noise.png'), linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11))); + @include background($footer-bg-front, $footer-bg-back); border-top: 1px solid $footer-border-top; position: relative; padding-top: 1em; diff --git a/sass/partials/_navigation.scss b/sass/partials/_navigation.scss index c05819a..68a15ce 100644 --- a/sass/partials/_navigation.scss +++ b/sass/partials/_navigation.scss @@ -1,7 +1,7 @@ body > nav { position: relative; background-color: $nav-bg; - @include background(image-url('noise.png'), linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11))); + @include background($nav-bg-front, $nav-bg-back); border: { top: 1px solid $nav-border-top; bottom: 1px solid $nav-border-bottom; } diff --git a/sass/partials/_sidebar.scss b/sass/partials/_sidebar.scss index ac790e0..eec540b 100644 --- a/sass/partials/_sidebar.scss +++ b/sass/partials/_sidebar.scss @@ -1,4 +1,5 @@ @import "sidebar/base"; @import "sidebar/twitter"; +@import "sidebar/googleplus"; @import "sidebar/pinboard"; @import "sidebar/delicious"; diff --git a/sass/partials/_syntax.scss b/sass/partials/_syntax.scss index 5a58c93..77ac8d7 100644 --- a/sass/partials/_syntax.scss +++ b/sass/partials/_syntax.scss @@ -21,17 +21,19 @@ } border: 1px solid $pre-border !important; } +figure.code, .gist-file, pre { + @include box-shadow(rgba(#000, .06) 0 0 10px); + .highlight pre { @include box-shadow(none); } +} + html .gist .gist-file { margin-bottom: 1.8em; position: relative; border: none; padding-top: image-height("code_bg.png") !important; .gist-syntax { - @if $solarized == dark { - border-bottom: 1px solid $base03 !important; - } @else if $solarized == light { - border-bottom: 0px; - } + border-bottom: 0 !important; + background: none !important; .gist-highlight{ background: $base03 !important; pre { @@ -46,6 +48,7 @@ html .gist .gist-file { font-size: .7em !important; @if $solarized == light { background: lighten($base03, 2) $noise-bg; + border: 1px solid $pre-border !important; border-top: 1px solid lighten($base03, 2) !important; } @else { background: $base02 $noise-bg; @@ -89,7 +92,8 @@ h3.filename { p, li { code { @extend .mono; - white-space: pre; + display: inline-block; + white-space: no-wrap; background: #fff; font-size: .8em; line-height: 1.5em; @@ -246,3 +250,4 @@ figure.code { text-shadow: #cbcccc 0 1px 0; padding-left: 3em; } + diff --git a/sass/partials/sidebar/_googleplus.scss b/sass/partials/sidebar/_googleplus.scss new file mode 100644 index 0000000..c2a693e --- /dev/null +++ b/sass/partials/sidebar/_googleplus.scss @@ -0,0 +1,26 @@ +.googleplus { + h1 { + -moz-box-shadow: none !important; + -webkit-box-shadow: none !important; + -o-box-shadow: none !important; + box-shadow: none !important; + border-bottom: 0px none !important; + } + a { + text-decoration: none; + white-space: normal !important; + line-height: 32px; + + img { + float: left; + margin-right: 0.5em; + border: 0 none; + } + } +} + +.googleplus-hidden { + position: absolute; + top: -1000em; + left: -1000em; +} diff --git a/sass/screen.scss b/sass/screen.scss index f08da4c..1899f60 100644 --- a/sass/screen.scss +++ b/sass/screen.scss @@ -3,6 +3,7 @@ @include reset-html5; @import "custom/colors"; +@import "custom/fonts"; @import "custom/layout"; @import "base"; @import "partials"; diff --git a/source/_includes/after_footer.html b/source/_includes/after_footer.html index 80a481e..08b8e34 100644 --- a/source/_includes/after_footer.html +++ b/source/_includes/after_footer.html @@ -1,5 +1,5 @@ {% include disqus.html %} +{% include facebook_like.html %} {% include google_plus_one.html %} {% include twitter_sharing.html %} -{% include google_analytics.html %} {% include custom/after_footer.html %} diff --git a/source/_includes/article.html b/source/_includes/article.html index 79e2652..9db0745 100644 --- a/source/_includes/article.html +++ b/source/_includes/article.html @@ -1,9 +1,9 @@ {% unless page.no_header %}
{% if index %} -

{{ post.title | titlecase }}

+

{% if site.titlecase %}{{ post.title | titlecase }}{% else %}{{ post.title }}{% endif %}

{% else %} -

{{ page.title | titlecase }}

+

{% if site.titlecase %}{{ page.title | titlecase }}{% else %}{{ page.title }}{% endif %}

{% endif %} {% unless page.meta == false %}

diff --git a/source/_includes/asides/delicious.html b/source/_includes/asides/delicious.html index 8c75b82..115cdcb 100644 --- a/source/_includes/asides/delicious.html +++ b/source/_includes/asides/delicious.html @@ -2,7 +2,7 @@

On Delicious

- +

My Delicious Bookmarks »

{% endif %} \ No newline at end of file diff --git a/source/_includes/asides/googleplus.html b/source/_includes/asides/googleplus.html new file mode 100644 index 0000000..00a0aa8 --- /dev/null +++ b/source/_includes/asides/googleplus.html @@ -0,0 +1,11 @@ +{% if site.googleplus_user %} +
+

+ + + Google+ + +

+
+{% endif %} + diff --git a/source/_includes/custom/category_feed.xml b/source/_includes/custom/category_feed.xml new file mode 100644 index 0000000..f47c553 --- /dev/null +++ b/source/_includes/custom/category_feed.xml @@ -0,0 +1,27 @@ +--- +layout: nil +--- + + + + <![CDATA[{{ page.title }} | {{ site.title }}]]> + + + {{ site.time | date_to_xmlschema }} + {{ site.url }}/ + + + {% if site.email %}{% endif %} + + Octopress + + {% for post in site.categories[page.category] limit: 5 %} + + <![CDATA[{{ post.title | cdata_escape }}]]> + + {{ post.date | date_to_xmlschema }} + {{ site.url }}{{ post.id }} + + + {% endfor %} + diff --git a/source/_includes/disqus.html b/source/_includes/disqus.html index 4b91353..eb30877 100644 --- a/source/_includes/disqus.html +++ b/source/_includes/disqus.html @@ -1,19 +1,18 @@ {% comment %} Load script if disquss comments are enabled and `page.comments` is either empty (index) or set to true {% endcomment %} {% if site.disqus_short_name and page.comments != false %} +{% endif %} diff --git a/source/_includes/head.html b/source/_includes/head.html index fd7e236..0fdc401 100644 --- a/source/_includes/head.html +++ b/source/_includes/head.html @@ -8,7 +8,7 @@ {% capture description %}{% if page.description %}{{ page.description }}{% else %}{{ content | raw_content }}{% endif %}{% endcapture %} - + {% if page.keywords %}{% endif %} @@ -16,7 +16,7 @@ - {% capture canonical %}{{ site.url }}{% if site.permalink contains '.html' %}{{ page.url }}{% else %}{{ page.url | remove:'index.html' }}{% endif %}{% endcapture %} + {% capture canonical %}{{ site.url }}{% if site.permalink contains '.html' %}{{ page.url }}{% else %}{{ page.url | remove:'index.html' | strip_slash }}{% endif %}{% endcapture %} @@ -25,4 +25,5 @@ {% include custom/head.html %} + {% include google_analytics.html %} diff --git a/source/_includes/post/date.html b/source/_includes/post/date.html index dbfa67a..ecf1ad7 100644 --- a/source/_includes/post/date.html +++ b/source/_includes/post/date.html @@ -1,12 +1,15 @@ {% capture date %}{{ page.date }}{{ post.date }}{% endcapture %} +{% capture date_formatted %}{{ page.date_formatted }}{{ post.date_formatted }}{% endcapture %} {% capture has_date %}{{ date | size }}{% endcapture %} + {% capture updated %}{{ page.updated }}{{ post.updated }}{% endcapture %} +{% capture updated_formatted %}{{ page.updated_formatted }}{{ post.updated_formatted }}{% endcapture %} {% capture was_updated %}{{ updated | size }}{% endcapture %} {% if has_date != '0' %} - {% capture time %}{% endcapture %} + {% capture time %}{% endcapture %} {% endif %} {% if was_updated != '0' %} - {% capture updated %}{% endcapture %} -{% else %}{% assign updated = false %}{% endif %} + {% capture updated %}{% endcapture %} +{% else %}{% assign updated = false %}{% endif %} \ No newline at end of file diff --git a/source/_includes/post/sharing.html b/source/_includes/post/sharing.html index f0f9b9d..e32500d 100644 --- a/source/_includes/post/sharing.html +++ b/source/_includes/post/sharing.html @@ -5,4 +5,7 @@ {% if site.google_plus_one %}
{% endif %} + {% if site.facebook_like %} +
+ {% endif %} diff --git a/source/_layouts/page.html b/source/_layouts/page.html index 4edd3ed..8ba6ec9 100644 --- a/source/_layouts/page.html +++ b/source/_layouts/page.html @@ -6,7 +6,7 @@ layout: default
{% if page.title %}
-

{{ page.title | titlecase }}

+

{% if site.titlecase %}{{ page.title | titlecase }}{% else %}{{ page.title }}{% endif %}

{% if page.date %}

{% include post/date.html %}{{ time }}

{% endif %}
{% endif %} diff --git a/source/_layouts/post.html b/source/_layouts/post.html index 3b1208d..d3c42e3 100644 --- a/source/_layouts/post.html +++ b/source/_layouts/post.html @@ -15,6 +15,14 @@ single: true {% unless page.sharing == false %} {% include post/sharing.html %} {% endunless %} +

+ {% if page.previous.url %} + « {{page.previous.title}} + {% endif %} + {% if page.next.url %} + {{page.next.title}} » + {% endif %} +

{% if site.disqus_short_name and page.comments == true %} diff --git a/source/atom.xml b/source/atom.xml index 693f397..83af3f8 100644 --- a/source/atom.xml +++ b/source/atom.xml @@ -4,25 +4,24 @@ layout: nil - {{ site.title }} + <![CDATA[{{ site.title }}]]> {{ site.time | date_to_xmlschema }} {{ site.url }}/ - {{ site.author }} - {% if site.email %} - {{ site.email }} - {% endif %} + + {% if site.email %}{% endif %} + Octopress {% for post in site.posts limit: 20 %} - {{ post.title }} + <![CDATA[{{ post.title | cdata_escape }}]]> {{ post.date | date_to_xmlschema }} {{ site.url }}{{ post.id }} - {{ post.content | expand_urls: site.url | xml_escape }} + {% endfor %} diff --git a/source/index.html b/source/index.html index e2eb621..a114e5a 100644 --- a/source/index.html +++ b/source/index.html @@ -10,17 +10,15 @@ layout: default {% include article.html %} {% endfor %} - +