From c9511316157a76d026d298074ab47f07410beee1 Mon Sep 17 00:00:00 2001 From: Junv Date: Mon, 14 Jan 2013 21:45:52 +0800 Subject: [PATCH] dfd --- .themes/slash | 1 + sass/_base.scss | 5 +- sass/_parts.scss | 5 +- sass/base/_color.scss | 15 +- sass/base/_font.scss | 26 +- sass/base/_layout.scss | 49 +- sass/base/_typography.scss | 137 +---- sass/base/_utilities.scss | 41 +- sass/custom/_color.scss | 7 + sass/parts/_archive.scss | 179 +++---- sass/parts/_article.scss | 409 +++++--------- sass/parts/_comment.scss | 10 +- sass/parts/_footer.scss | 50 +- sass/parts/_header.scss | 411 ++++++++++++++- sass/parts/_index.scss | 43 ++ sass/parts/_post.scss | 43 ++ sass/parts/_syntax.scss | 674 ++++++++++++------------ sass/parts/_twitter.scss | 49 ++ sass/plugins/_fancybox.scss | 12 +- sass/screen.scss | 2 + source/_includes/after_footer.html | 5 +- source/_includes/archive_post.html | 17 +- source/_includes/article.html | 58 +- source/_includes/banner.html | 15 + source/_includes/custom/footer.html | 7 +- source/_includes/custom/navigation.html | 4 +- source/_includes/fancybox.html | 18 +- source/_includes/footer.html | 21 +- source/_includes/google_analytics.html | 20 +- source/_includes/head.html | 6 +- source/_includes/header.html | 58 +- source/_includes/navigation.html | 16 +- source/_includes/post/categories.html | 14 +- source/_includes/post/date.html | 16 +- source/_includes/post/sharing.html | 6 +- source/_layouts/category_index.html | 10 +- source/_layouts/default.html | 3 + source/_layouts/page.html | 16 +- source/_layouts/post.html | 11 +- source/blog/archives/index.html | 10 +- source/images/loading_gray.gif | Bin 0 -> 8787 bytes source/images/loading_pacman.gif | Bin 0 -> 1928 bytes source/images/social/coderwall.png | Bin 0 -> 2983 bytes source/images/social/delicious.png | Bin 0 -> 1064 bytes source/images/social/linkedin.png | Bin 0 -> 1371 bytes source/images/social/pinboard.png | Bin 0 -> 445 bytes source/index.html | 12 +- source/javascripts/slash.js | 62 +++ source/javascripts/twitter.js | 152 +++--- 49 files changed, 1510 insertions(+), 1215 deletions(-) create mode 160000 .themes/slash create mode 100644 sass/custom/_color.scss create mode 100644 sass/parts/_index.scss create mode 100644 sass/parts/_post.scss create mode 100644 sass/parts/_twitter.scss create mode 100644 source/_includes/banner.html create mode 100644 source/images/loading_gray.gif create mode 100644 source/images/loading_pacman.gif create mode 100644 source/images/social/coderwall.png create mode 100644 source/images/social/delicious.png create mode 100644 source/images/social/linkedin.png create mode 100644 source/images/social/pinboard.png create mode 100644 source/javascripts/slash.js diff --git a/.themes/slash b/.themes/slash new file mode 160000 index 00000000..2cc927dd --- /dev/null +++ b/.themes/slash @@ -0,0 +1 @@ +Subproject commit 2cc927dd8c198e7fa0de977e9143c317be16b08b diff --git a/sass/_base.scss b/sass/_base.scss index a8fcb864..77f309ce 100644 --- a/sass/_base.scss +++ b/sass/_base.scss @@ -1,4 +1,5 @@ @import "base/color"; @import "base/font"; -@import "base/utilities"; -@import "base/layout"; \ No newline at end of file +@import "base/layout"; +@import "base/typography"; +@import "base/utilities"; \ No newline at end of file diff --git a/sass/_parts.scss b/sass/_parts.scss index ffa92a32..b7ee304e 100644 --- a/sass/_parts.scss +++ b/sass/_parts.scss @@ -1,8 +1,9 @@ @import "parts/header"; -@import "parts/pagination"; +@import "parts/index"; @import "parts/article"; +@import "parts/post"; @import "parts/archive"; @import "parts/comment"; @import "parts/footer"; @import "parts/syntax"; -@import "parts/phasebeam"; \ No newline at end of file +@import "parts/twitter"; \ No newline at end of file diff --git a/sass/base/_color.scss b/sass/base/_color.scss index a9c7654b..8dae36f3 100644 --- a/sass/base/_color.scss +++ b/sass/base/_color.scss @@ -1,8 +1,7 @@ -$color-background: #000; -$color-font: #333; -$color-meta: #999; -$color-border: #ccc; -$color-main01: rgb(157, 97, 207); -$color-main02: rgb(40, 20, 105); -$color-main03: rgb(0, 150, 240); -$color-main04: rgb(0, 26, 77); \ No newline at end of file +$color-background: #eee !default; +$color-main: #258fb8 !default; +$color-gray01: #666 !default; +$color-gray02: #999 !default; +$color-gray03: #ccc !default; +$color-gray04: #ddd !default; +$color-gray05: #fff !default; \ No newline at end of file diff --git a/sass/base/_font.scss b/sass/base/_font.scss index a7f76bd3..907e4064 100644 --- a/sass/base/_font.scss +++ b/sass/base/_font.scss @@ -1,21 +1,17 @@ -$font-main: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif; -$font-title: "Pontano Sans", "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, sans-serif; -$font-mono: Menlo, Monaco, Andale Mono, Lucida console, Courier New, monospace; -$font-serif: "Georgia", serif; - -@import url(http://fonts.googleapis.com/css?family=Pontano+Sans); +$font-default: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif; +$font-mono: Menlo, Monaco, "Andale Mono", "lucida console", "Courier New", monospace; $font-icon: FontAwesome; $font-icon-path: "/font/fontawesome-webfont"; @font-face { - font-family: 'FontAwesome'; - src: url('#{$font-icon-path}.eot'); - src: url('#{$font-icon-path}.eot?#iefix') format('embedded-opentype'), - url('#{$font-icon-path}.woff') format('woff'), - url('#{$font-icon-path}.ttf') format('truetype'), - url('#{$font-icon-path}.svgz#FontAwesomeRegular') format('svg'), - url('#{$font-icon-path}.svg#FontAwesomeRegular') format('svg'); - font-weight: normal; - font-style: normal; + font-family: 'FontAwesome'; + src: url('#{$font-icon-path}.eot'); + src: url('#{$font-icon-path}.eot?#iefix') format('embedded-opentype'), + url('#{$font-icon-path}.woff') format('woff'), + url('#{$font-icon-path}.ttf') format('truetype'), + url('#{$font-icon-path}.svgz#FontAwesomeRegular') format('svg'), + url('#{$font-icon-path}.svg#FontAwesomeRegular') format('svg'); + font-weight: normal; + font-style: normal; } \ No newline at end of file diff --git a/sass/base/_layout.scss b/sass/base/_layout.scss index a6784a21..22e58046 100644 --- a/sass/base/_layout.scss +++ b/sass/base/_layout.scss @@ -1,40 +1,49 @@ +$max-width: 1000px; + *{ - margin: 0; - padding: 0; + margin: 0; + padding: 0; } body{ - background: $color-background; - font: 300 14px $font-main; - text-shadow: 0 0 1px transparent; + font-family: $font-default; + font-weight: 300; + font-size: 14px; + background: $color-background; + color: $color-gray01; + @media screen and (max-width: 1040px){ + margin: 0 20px; + } + @media screen and (max-width: 600px){ + font-size: 13px; + } } h1{ - font-size: 2em; + font-size: 1.8em; } h2{ - font-size: 1.6em; + font-size: 1.5em; } h3{ - font-size: 1.3em; + font-size: 1.3em; } a{ - color: $color-main01; - text-decoration: none; -} -strong{ - font-weight: bold; + text-decoration: none; + outline-width: 0; + color: $color-main; } .alignleft{ - float: left; + float: left; } .alignright{ - float: right; + float: right; } .clearfix{ - @include pie-clearfix; + @include pie-clearfix; } .inner{ - margin: 0 auto; - position: relative; - width: 1000px; - z-index: 0; + width: $max-width; + margin: 0 auto; + @media screen and (max-width: 1040px){ + width: 100%; + } } \ No newline at end of file diff --git a/sass/base/_typography.scss b/sass/base/_typography.scss index b68753fa..57f5e1f5 100644 --- a/sass/base/_typography.scss +++ b/sass/base/_typography.scss @@ -1,129 +1,3 @@ -$blockquote: $type-border !default; -$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: $heading-font-family; -} -.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; - color: $text-color; - @extend .serif; -} -h1 { - font-size: 2.2em; - line-height: 1.2em; -} - -@media only screen and (min-width: 992px) { - body { font-size: 1.15em; } - h1 { font-size: 2.6em; line-height: 1.2em; } -} - -#{headings()}{ - @extend .heading; - text-rendering: optimizelegibility; - margin-bottom: 1em; - font-weight: bold; -} -h2, section h1 { - font-size: 1.5em; -} -h3, section h2, section section h1 { - font-size: 1.3em; -} -h4, section h3, section section h2, section section section h1 { - font-size: 1em; -} -h5, section h4, section section h3 { - font-size: .9em; -} -h6, section h5, section section h4, section section section h3 { - font-size: .8em; -} -p, blockquote, ul, ol { margin-bottom: 1.5em; } - -ul { list-style-type: disc; - 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; margin-bottom: 0px; - ol { list-style-type: lower-roman; margin-bottom: 0px; }}} - -ul, ol { &, ul, ol { margin-left: 1.3em; }} - -strong { font-weight: bold; } - -em { font-style: italic; } - -sup, sub { font-size: 0.8em; position: relative; display: inline-block; } -sup { top: -.5em; } -sub { bottom: -.5em; } - -q { font-style: italic; - &:before { content: "\201C"; } - &:after { content: "\201D"; } -} - -em, dfn { font-style: italic; } - -strong, dfn { font-weight: bold; } - -del, s { text-decoration: line-through; } - -abbr, acronym { border-bottom: 1px dotted; cursor: help; } - -pre, code, tt { @extend .mono; } - -sub, sup { line-height: 0; } - -hr { margin-bottom: 0.2em; } - -small { font-size: .8em; } - -big { font-size: 1.2em; } - -blockquote { - $bq-margin: 1.2em; - font-style: italic; - position: relative; - font-size: 1.2em; - line-height: 1.5em; - padding-left: 1em; - border-left: 4px solid rgba($text-color-light, .5); - cite { - font-style: italic; - a { color: $text-color-light !important; word-wrap: break-word; } - &:before { content: '\2014'; padding:{right: .3em; left: .3em;} color: $text-color-light; } - } - @media only screen and (min-width: 992px) { - padding-left: 1.5em; - border-left-width: 4px; - } -} - .pullquote-right:before, .pullquote-left:before { /* Reset metrics. */ @@ -149,13 +23,4 @@ blockquote { /* 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; - white-space: -pre-wrap; - white-space: -o-pre-wrap; - white-space: pre-wrap; - word-wrap: break-word; -} +} \ No newline at end of file diff --git a/sass/base/_utilities.scss b/sass/base/_utilities.scss index 24b6af0f..63aae7a0 100644 --- a/sass/base/_utilities.scss +++ b/sass/base/_utilities.scss @@ -1,23 +1,24 @@ -@mixin square($size){ - width: $size; - height: $size; +@mixin square($property){ + width: $property; + height: $property; +} +@mixin user-select($select){ + -moz-user-select: $select; + -khtml-user-select: $select; + -webkit-user-select: $select; + -o-user-select: $select; + user-select: $select; +} +@mixin border-shadow($top: $color-gray05, $bottom: $color-gray04){ + border-top: 1px solid $top; + border-bottom: 1px solid $bottom; } @mixin center($width, $height){ - position: absolute; - top: 50%; - left: 50%; - margin-left: -1/2 * $width; - margin-top: -1/2 * $height; -} -@mixin hide-text{ - text-indent: 100%; - white-space: nowrap; - overflow: hidden; -} -@mixin user-select($prop){ - -moz-user-select: $prop; - -khtml-user-select: $prop; - -webkit-user-select: $prop; - -o-user-select: $prop; - user-select: $prop; + position: absolute; + top: 50%; + left: 50%; + margin-left: $width/(-2); + margin-top: $height/(-2); + width: $width; + height: $height; } \ No newline at end of file diff --git a/sass/custom/_color.scss b/sass/custom/_color.scss new file mode 100644 index 00000000..7e3c604a --- /dev/null +++ b/sass/custom/_color.scss @@ -0,0 +1,7 @@ +// $color-background: #eee; +// $color-main: #258fb8; +// $color-gray01: #666; +// $color-gray02: #999; +// $color-gray03: #ccc; +// $color-gray04: #ddd; +// $color-gray05: #fff; \ No newline at end of file diff --git a/sass/parts/_archive.scss b/sass/parts/_archive.scss index b5116de3..af8f7641 100644 --- a/sass/parts/_archive.scss +++ b/sass/parts/_archive.scss @@ -1,110 +1,73 @@ -#archive-header{ - height: 2em; - margin-bottom: 50px; - h1{ - color: rgba(255,255,255,0.7); - font-family: $font-title; - font-weight: normal; - line-height: 1; - } - .search{ - input[type="text"]{ - background: rgba(0,0,0,0.3); - border: none; - color: rgba(255,255,255,0.7); - font: 0.9em $font-title; - padding: 7px 12px; - width: 150px; - } - } -} .archives{ - background: #fff; - border: 1px solid #ddd; - color: $color-font; - margin-bottom: 50px; - box-shadow: 0 0 16px rgba(0,0,0,0.3); - text-align: justify; - position: relative; - @include border-radius(3px); - &:before{ - content: ""; - position: absolute; - top: 0; - left: 0; - width: $meta-width; - height: 100%; - @include background(linear-gradient(left, #ddd, #fff)); - } - .year{ - color: $color-meta; - font: 2em $font-title; - position: absolute; - top: 15px; - left: 20px; - } - article{ - border-left: 1px solid $color-border; - margin-left: $meta-width + 20*2px; - padding: 15px 20px; - position: relative; - &:before{ - content: ""; - position: absolute; - bottom: -6px; - left: -5px; - width: 7px; - height: 7px; - border: 1px solid $color-border; - background: #fff; - z-index: 1; - @include transform(rotate(45deg)); - } - &:last-of-type{ - &:before{ - display: none; - } - } - .title{ - font-family: $font-title; - font-weight: normal; - line-height: 1.1; - a{ - color: $color-font; - } - } - footer{ - color: $color-meta; - font-size: 0.9em; - line-height: 1.6em; - margin-top: 5px; - a{ - color: $color-meta; - &:hover{ - color: darken($color-meta, 20%); - } - } - time{ - &:before{ - content: "\f073"; - font-family: $font-icon; - padding-right: 10px; - } - } - .tags{ - display: inline-block; - margin-left: 25px; - &:before{ - content: "\f02c"; - font-family: $font-icon; - padding-right: 10px; - } - } - } - } -} -.archive{ - box-shadow: none; - border: none; - margin-bottom: 0; + position: relative; + &:last-of-type{ + &:before{ + content: ""; + position: absolute; + bottom: 0; + width: 200px; + border-top: 1px solid $color-gray04; + } + } + .year{ + line-height: 35px; + width: 200px; + position: absolute; + top: 0; + padding-top: 15px; + border-top: 1px solid #fff; + &:before{ + content: ""; + position: absolute; + top: -2px; + width: 100%; + border-top: 1px solid $color-gray04; + } + @media screen and (max-width: 600px){ + position: relative; + width: 100%; + } + } + article{ + margin-left: 200px; + padding: 15px 0; + @media screen and (max-width: 600px){ + margin-left: 0; + &:first-of-type{ + border-top: none; + padding-top: 30px; + } + } + .title{ + margin-bottom: 0; + } + .meta{ + color: $color-gray02; + font-size: 0.9em; + line-height: 2; + margin-top: 15px; + @media screen and (max-width: 600px){ + display: none; + } + span{ + margin-right: 30px; + @include inline-block; + &:before{ + color: $color-gray03; + font: 1.3em $font-icon; + padding-right: 10px; + } + } + a{ + color: $color-gray02; + @include transition(0.3s); + &:hover{ + color: $color-gray01; + } + } + .date:before{content: "\f073";} + .tags:before{content: "\f02c";} + .comments:before{content: "\f075";} + } + } } \ No newline at end of file diff --git a/sass/parts/_article.scss b/sass/parts/_article.scss index 43b0bfdd..77b97128 100644 --- a/sass/parts/_article.scss +++ b/sass/parts/_article.scss @@ -1,274 +1,141 @@ -$meta-width: 120px; - article{ - background: #fff; - border: 1px solid #ddd; - color: $color-font; - margin-bottom: 50px; - box-shadow: 0 0 16px rgba(0,0,0,0.3); - text-align: justify; - position: relative; - @include border-radius(3px); - header{ - font-family: $font-title; - padding: 15px 20px; - position: relative; - .title{ - font-weight: normal; - line-height: 1.1; - a{ - color: $color-font; - } - } - time{ - color: $color-meta; - position: absolute; - top: 15px; - left: -$meta-width - 20px; - z-index: 1; - @include user-select(none); - .day{ - font-size: 2em; - } - .month{ - &:before{ - content: " / " - } - } - } - } - .entry-content{ - line-height: 1.6; - padding: 15px 20px 15px; - margin-top: -15px; - p, blockquote, ul, ol, dl, table, iframe, h1, h2, .video-container, .sharing{ - margin-top: 15px; - } - ul, ol, dl{ - margin-left: 20px; - ul, ol, dl{ - margin-top: 0; - } - } - strong{ - font-weight: bold; - } - em{ - font-style: italic; - } - a{ - &:hover{ - text-decoration: underline; - } - } - h1, h2, h3, h4, h5, h6{ - font-family: $font-title; - font-weight: normal; - line-height: 1.1; - } - h1, h2{ - border-top: 1px solid lighten($color-border, 10%); - padding-top: 15px; - } - h3, h4, h5, h6{ - margin-top: 25px; - } - img, video{ - max-width: 100%; - height: auto; - } - blockquote{ - border-top: 1px solid lighten($color-border, 10%); - border-bottom: 1px solid lighten($color-border, 10%); - color: #666; - font-style: italic; - font-size: 1.2em; - font-family: $font-serif; - padding: 10px 25px 25px; - position: relative; - text-align: center; - &:before, &:after{ - position: absolute; - color: $color-border; - line-height: 1; - font-size: 50px; - } - &:before{ - content: "“"; - top: 3px; - left: 0; - } - &:after{ - content: "„"; - bottom: 8px; - right: 0; - } - footer{ - font-size: 0.8em; - color: $color-meta; - line-height: 1.1; - margin-top: 20px; - cite{ - &:before{ - content: "—"; - color: #ccc; - padding: 0 0.5em; - } - } - a{ - color: $color-meta; - text-decoration: underline; - &:hover{ - color: $color-font; - } - } - } - } - iframe{ - border: none; - } - .caption{ - color: $color-meta; - display: block; - font-size: 0.9em; - margin-top: 5px; - &:before{ - font-family: $font-icon; - content: "\f040"; - padding-right: 10px; - } - } - .video-container{ - position: relative; - padding-bottom: 56.25%; - padding-top: 30px; - height: 0; - overflow: hidden; - iframe{ - margin-top: 0; - } - iframe, object, embed{ - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - } - } - .sharing{ - border-top: 1px solid lighten($color-border, 10%); - padding-top: 15px; - iframe{ - margin-top: 0; - } - } - [class^="pullquote"]{ - float: right; - width: 45%; - display: block; - margin: 0.5em 0 1em 1.5em; - color: #666; - font-size: 1.2em; - font-style: italic; - font-family: $font-serif; - position: relative; - padding-left: 35px; - &:before{ - position: absolute; - color: $color-border; - line-height: 1; - font-size: 50px; - top: 0; - content: "“"; - left: 0; - } - } - .pullquote-left{ - float: left; - margin: 0.5em 1.5em 1em 0; - } - } + border-bottom: 1px solid $color-gray04; + border-top: 1px solid $color-gray05; + padding: 30px 0; + position: relative; + @media screen and (max-width: 800px){ + padding-bottom: 15px; + } + @media screen and (max-width: 600px){ + padding: 15px 0; + } + h2.title{ + font-size: 1.8em; + font-weight: 300; + line-height: 35px; + margin-bottom: 20px; + a{ + color: $color-gray01; + } + } + .entry-content{ + line-height: 2; + text-align: justify; + a{ + &:hover{ + text-decoration: underline; + } + } + .more-link{ + display: block; + margin-top: 16px; + padding-left: 30px; + position: relative; + &:before{ + content: "\f061"; + font: 1.3em $font-icon; + line-height: 1.6em; + position: absolute; + left: 0; + } + } + p, blockquote, ul, ol, dl, table, iframe, h1, h2, h3, h4, h5, h6, .video-container{ + margin-top: 10px; + } + ul, ol, dl{ + margin-left: 20px; + ul, ol, dl{ + margin-top: 0; + } + } + strong{ + font-weight: bold; + } + em{ + font-style: italic; + } + p{ + margin-top: 10px; + } + h2{ + font-weight: 300; + border-bottom: 1px solid $color-gray04; + position: relative; + &:before{ + content: ""; + position: absolute; + bottom: -2px; + border-bottom: 1px solid $color-gray05; + width: 100%; + } + } + img, video{ + max-width: 100%; + height: auto; + } + blockquote{ + background: $color-gray04; + border-left: 5px solid $color-gray03; + padding: 15px 20px; + margin-top: 10px; + & > p:first-of-type{ + margin-top: 0; + } + } + iframe{ + border: none; + } + table{ + background: $color-gray04; + border: 1px solid $color-gray03; + border-spacing: 0; + margin-top: 10px; + th{ + background: $color-gray03; + padding: 0 15px; + } + td{ + text-align: center; + } + tr{ + &:nth-of-type(2n){ + background: #d5d5d5; + } + } + } + .caption{ + display: block; + font-size: 0.9em; + color: $color-gray02; + padding-left: 25px; + position: relative; + &:before{ + content: "\f040"; + color: $color-gray03; + font: 1.3em $font-icon; + line-height: 1.6em; + position: absolute; + left: 0; + } + } + .video-container{ + position: relative; + padding-bottom: 56.25%; + padding-top: 30px; + height: 0; + overflow: hidden; + iframe, object, embed{ + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + margin-top: 0; + } + } + } } - -.post{ - &:before{ - content: ""; - position: absolute; - top: 0; - left: 0; - width: $meta-width; - height: 100%; - @include background(linear-gradient(left, #ddd, #fff)); - } - header, .entry-content{ - border-left: 1px solid $color-border; - margin-left: $meta-width + 20*2px; - } - .entry-content{ - min-height: 130px; - position: relative; - &:before{ - content: ""; - position: absolute; - top: 15px; - left: -5px; - width: 7px; - height: 7px; - border: 1px solid $color-border; - background: #fff; - @include transform(rotate(45deg)); - } - .meta{ - color: $color-meta; - font-size: 0.9em; - position: absolute; - top: 30px; - left: -$meta-width - 20px; - width: $meta-width; - z-index: 1; - a{ - color: $color-meta; - display: block; - &:hover{ - color: darken($color-meta, 20%); - } - } - .tags{ - line-height: 1.6em; - a{ - &:before{ - content: "\f02b"; - font-family: $font-icon; - padding-right: 10px; - } - &:hover{ - text-decoration: none; - } - } - } - .comment{ - margin-top: 20px; - &:before{ - content: "\f075"; - font-family: $font-icon; - padding-right: 8px; - } - &:hover{ - text-decoration: none; - } - } - } - } -} - -.page{ - &:before{ - content: ""; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 60px; - @include background(linear-gradient(top, #ddd, #fff)); - } +.share{ + padding: 15px 0; + @include border-shadow(); } \ No newline at end of file diff --git a/sass/parts/_comment.scss b/sass/parts/_comment.scss index 3458ff04..05fa5989 100644 --- a/sass/parts/_comment.scss +++ b/sass/parts/_comment.scss @@ -1,4 +1,10 @@ #comment{ - position: relative; - margin: 30px 20px 0; + padding: 30px 0; + @include border-shadow(); + h2.title{ + font-size: 25px; + font-weight: 300; + line-height: 35px; + margin-bottom: 20px; + } } \ No newline at end of file diff --git a/sass/parts/_footer.scss b/sass/parts/_footer.scss index 0c0d19ae..6d478462 100644 --- a/sass/parts/_footer.scss +++ b/sass/parts/_footer.scss @@ -1,46 +1,6 @@ -@import "social/*.png"; -#footer{ - color: rgba(255, 255, 255, 0.7); - font-size: 0.9em; - line-height: 1.6; - margin-bottom: 50px; - a{ - color: #fff; - &:hover{ - text-decoration: underline; - } - } - .social{ - a{ - display: inline-block; - opacity: 0.7; - width: 16px; - height: 16px; - margin-left: 10px; - float: left; - @include hide-text; - @include transition(0.3s); - &:hover{ - opacity: 1; - } - &.facebook{ - @include social-sprite(facebook); - } - &.google{ - @include social-sprite(google); - } - &.github{ - @include social-sprite(github); - } - &.twitter{ - @include social-sprite(twitter); - } - &.rss{ - @include social-sprite(rss); - } - &.pinterest{ - @include social-sprite(pinterest); - } - } - } +footer{ + padding: 15px 0; + border-top: 1px solid $color-gray05; + text-align: center; + font-size: 0.9em; } \ No newline at end of file diff --git a/sass/parts/_header.scss b/sass/parts/_header.scss index bcb60b5c..50ece116 100644 --- a/sass/parts/_header.scss +++ b/sass/parts/_header.scss @@ -1,26 +1,395 @@ -$nav-height: 64 + 3*2px; +$header-height: 30px; #header{ - height: $nav-height; - padding: 50px 0; - nav{ - font: 1.5em $font-title; - line-height: $nav-height; - ul{ - list-style: none; - text-align: center; - li{ - margin: 0 50px; - display: inline-block; - } - a{ - color: #fff; - opacity: 0.7; - @include transition(0.3s); + height: $header-height; + padding: 30px 0; + border-bottom: 1px solid $color-gray04; + line-height: $header-height; + @media screen and (max-width: 1040px){ + height: auto; + position: relative; + padding-bottom: 10px; + } + a{ + color: $color-gray01; + @include transition(color 0.3s); + &:hover{ + color: $color-main; + } + } + h1{ + float: left; + font-weight: 300; + font-size: 30px; + @media screen and (max-width: 1040px){ + float: none; + } + } +} +#main-nav{ + float: left; + margin-left: 30px; + @media screen and (max-width: 1040px){ + float: none; + margin-left: 0; + margin-top: 15px; + } + >ul{ + @media screen and (max-width: 600px){ + display: none; + } + >li{ + margin-left: 50px; + @include inline-block; + @media screen and (max-width: 1040px){ + margin-left: 0; + margin-right: 50px; + &:last-of-type{ + margin-right: 0; + } + } + &:hover{ + >a{ + color: $color-main; + } + } + >a{ + padding: 38px 0; + margin-top: -38px; + &:after{ + content: "\f078"; + color: $color-gray03; + font: 12px $font-icon; + padding-left: 10px; + } + &:only-child{ + &:after{ + content: ""; + } + } + @media screen and (max-width: 1040px){ + padding: 18px 0; + } + } + } + ul{ + position: absolute; + top: 60px; + left: -15px; + z-index: 10; + white-space: nowrap; + background: $color-gray04; + border: 1px solid $color-gray03; + list-style: none; + display: none; + @media screen and (max-width: 1040px){ + top: 40px; + } + @include box-shadow(0 4px 8px rgba(0,0,0,0.1)); + @include border-radius(0 0 5px 5px); + ul{ + @include border-radius(0 5px 5px 5px); + } + li{ + @include border-shadow($color-background, $color-gray03); + &:hover{ + background: #d5d5d5; + } + &:first-of-type{ + border-top: none; + ul{ + @include border-radius(0 0 5px 5px); + } + } + &:last-of-type{ + border-bottom: none; + } + >a{ + display: block; + padding: 5px 15px; + &:after{ + content: "\f054"; + color: $color-gray02; + font: 12px $font-icon; + padding-left: 10px; + } + &:hover{ + color: $color-gray01; + } + &:only-child{ + &:after{ + content: ""; + } + } + } + } + ul{ + top: 0; + left: 100%; + } + } + li{ + position: relative; + &:hover{ + >ul{ + display: block; + } + } + } + } + select{ + display: none; + margin-bottom: 10px; + @media screen and (max-width: 600px){ + display: block; + } + } +} +#mobile-nav{ + display: none; + height: 37px; + position: relative; + @media screen and (max-width: 600px){ + display: block; + } + a{ + display: block; + } + .button{ + cursor: pointer; + } + .container{ + display: none; + } + .menu{ + position: relative; + width: 100%; + .button{ + background: #f2f2f2; + border: 1px solid $color-gray04; + color: #999; + padding: 0 60px 0 10px; + position: relative; + @include border-radius(5px); + &:hover{ + color: #999; + } + &.on{ + color: #666; + @include border-radius(5px 5px 5px 0); + &:before{ + content: "\f077"; + } + } + &:before{ + content: "\f078"; + color: $color-gray04; + font: 16px $font-icon; + line-height: 30px; + position: absolute; + top: 0; + right: 40px; + } + } + .container{ + background: #f2f2f2; + border: 1px solid #ddd; + border-top: none; + position: absolute; + top: 31px; + z-index: 1; + @include border-radius(0 0 5px 5px); + ul{ + list-style: none; + ul{ + margin-left: 20px; + } + } + a{ + padding: 0 10px; + } + } + } + .search{ + position: absolute; + top: 0; + right: 0; + .button{ + background: $color-gray04; + width: 30px; + height: 30px; + position: absolute; + top: 1px; + right: -1px; + @include border-radius(0 5px 5px 0); + &:before{ + content: "\f002"; + color: #f2f2f2; + font: 20px $font-icon; + line-height: 30px; + position: absolute; + top: 0; + left: 7px; + } + &.on{ + background: $color-gray03; + &:before{ + content: "\f00d"; + } + } + } + .container{ + position: absolute; + right: 51px; + z-index: 1; + } + input[type="text"]{ + background: #fff; + border: 1px solid $color-gray04; + border-right: none; + color: $color-gray02; + font: 13px $font-default; + height: 30px; + width: 100%; + padding: 0 10px; + @include border-radius(5px 0 0 5px); + } + } +} +#sub-nav{ + @media screen and (max-width: 1040px){ + position: absolute; + top: 30px; + right: 0; + } + @media screen and (max-width: 600px){ + display: none; + } + .search{ + float: left; + margin-top: 1px; + position: relative; + @media screen and (max-width: 1040px){ + float: none; + margin-top: 15px; + } + &:before{ + content: "\f002"; + color: $color-gray03; + font: 18px $font-icon; + line-height: 30px; + position: absolute; + top: 0; + right: 125px; + } + input[type="text"]{ + background: #f2f2f2; + color: $color-gray02; + border: 1px solid $color-gray04; + font: 13px $font-default; + padding: 6px 15px 6px 35px; + width: 100px; + @include transition(0.3s); + @include border-radius(15px); + &:focus, &:active{ + background: #fff; + border-top: 1px solid $color-gray03; + color: $color-gray01; + outline: none; + } + } + } + .social{ + float: left; + margin-right: 15px; + @media screen and (max-width: 1040px){ + float: none; + margin-right: 0; + a:last-of-type{ + margin-right: 0; + } + } + a{ + @include border-radius(50%); + @include inline-block; + text-indent: -9999px; + margin-right: 15px; + opacity: 0.5; + @include square(28px); + @include transition(0.3s); + &:hover{ + opacity: 1; + } + &.facebook{ + background: image-url('social/facebook.png') center no-repeat #3B5998; + border: 1px solid #3B5998; + &:hover{ + border: 1px solid darken(#3B5998, 10%); + } + } + &.google{ + background: image-url('social/google.png') center no-repeat #C83D20; + border: 1px solid #C83D20; + &:hover{ + border: 1px solid darken(#C83D20, 10%); + } + } + &.twitter{ + background: image-url('social/twitter.png') center no-repeat #55CFF8; + border: 1px solid #55CFF8; + &:hover{ + border: 1px solid darken(#55CFF8, 10%); + } + } + &.github{ + background: image-url('social/github.png') center no-repeat rgb(175,182,202); + border: 1px solid rgb(175,182,202); + &:hover{ + border: 1px solid darken(rgb(175,182,202), 10%); + } + } + &.coderwall{ + background: image-url('social/coderwall.png') center no-repeat rgb(58,114,159); + border: 1px solid rgb(58,114,159); + &:hover{ + border: 1px solid darken(rgb(58,114,159), 10%); + } + } + &.pinboard{ + background: image-url('social/pinboard.png') center no-repeat rgb(0,102,200); + border: 1px solid rgb(58,114,159); &:hover{ - opacity: 1; + border: 1px solid darken(rgb(0,102,255), 10%); } } - } - } -} \ No newline at end of file + &.linkedin{ + background: image-url('social/linkedin.png') center no-repeat #005A87; + border: 1px solid #005A87; + &:hover{ + border: 1px solid darken(#005A87, 10%); + } + } + &.pinterest{ + background: image-url('social/pinterest.png') center no-repeat rgb(190,64,55); + border: 1px solid rgb(190,64,55); + &:hover{ + border: 1px solid darken(rgb(190,64,55), 10%); + } + } + &.delicious{ + background: image-url('social/delicious.png') center no-repeat rgb(50,113,203); + border: 1px solid rgb(50,113,203); + &:hover{ + border: 1px solid darken(rgb(50,113,203), 10%); + } + } + &.rss{ + background: image-url('social/rss.png') center no-repeat #EF7522; + border: 1px solid #EF7522; + &:hover{ + border: 1px solid darken(#EF7522, 10%); + } + } + } + } +} diff --git a/sass/parts/_index.scss b/sass/parts/_index.scss new file mode 100644 index 00000000..833bf020 --- /dev/null +++ b/sass/parts/_index.scss @@ -0,0 +1,43 @@ +#pagenavi{ + padding: 20px 0; + height: 20px; + line-height: 20px; + position: relative; + @include border-shadow(); + a{ + &:hover{ + text-decoration: underline; + } + } + .prev, .next{ + position: absolute; + } + .prev{ + padding-left: 30px; + left: 0; + &:before{ + content: "\f060"; + font: 1.3em $font-icon; + position: absolute; + left: 0; + } + } + .next{ + padding-right: 30px; + right: 0; + &:before{ + content: "\f061"; + font: 1.3em $font-icon; + position: absolute; + right: 0; + } + } + .center{ + text-align: center; + width: 100%; + display: block; + @media screen and (max-width: 400px){ + display: none; + } + } +} \ No newline at end of file diff --git a/sass/parts/_post.scss b/sass/parts/_post.scss new file mode 100644 index 00000000..cfad01f8 --- /dev/null +++ b/sass/parts/_post.scss @@ -0,0 +1,43 @@ +.post{ + h2.title, .entry-content{ + margin-left: 200px; + @media screen and (max-width: 800px){ + margin-left: 0; + } + } + .meta{ + position: absolute; + top: 85px; + line-height: 2; + font-size: 0.9em; + color: $color-gray02; + width: 170px; + @media screen and (max-width: 800px){ + margin-top: 15px; + position: static; + width: auto; + } + a{ + @include link-colors($color-gray02, $color-gray01); + @include transition(0.3s); + } + .date, .tags, .comments{ + padding-left: 30px; + position: relative; + &:before{ + color: $color-gray03; + font: 1.3em $font-icon; + line-height: 1.6em; + position: absolute; + left: 0; + } + @media screen and (max-width: 800px){ + @include inline-block; + margin-right: 30px; + } + } + .date:before{content: "\f073";} + .tags:before{content: "\f02c";} + .comments:before{content: "\f075";} + } +} \ No newline at end of file diff --git a/sass/parts/_syntax.scss b/sass/parts/_syntax.scss index 7a1f8466..0a959882 100644 --- a/sass/parts/_syntax.scss +++ b/sass/parts/_syntax.scss @@ -38,350 +38,350 @@ $solarized: light !default; $base3: $_base03; } -$pre-bg: #eee; -$pre-border: lighten($color-border, 10%); +$pre-bg: $color-gray04; +$pre-border: $color-gray03; article{ - code, pre{ - background: $pre-bg; - border: 1px solid $pre-border; - font-family: $font-mono; - } - code{ - font-size: 0.9em; - padding: 1px 3px; - margin: 0 3px; - @include border-radius(5px); - } - pre{ - font-size: 1 / 0.9em; - line-height: 1.5; - margin-top: 15px; - padding: 5px 15px; - overflow-x: auto; - @include border-radius(5px); - code{ - background: none; - border: none; - padding: 0; - margin: 0; - @include border-radius(0); - } - } + code, pre{ + background: $pre-bg; + border: 1px solid $pre-border; + font-family: $font-mono; + } + code{ + font-size: 0.9em; + padding: 1px 3px; + margin: 0 3px; + @include border-radius(5px); + } + pre{ + font-size: 1 / 0.9em; + line-height: 1.5; + margin-top: 10px; + padding: 5px 15px; + overflow-x: auto; + @include border-radius(5px); + code{ + background: none; + border: none; + padding: 0; + margin: 0; + @include border-radius(0); + } + } } figure.code{ - background: $pre-bg; - border: 1px solid $pre-border; - margin-top: 15px; - padding: 5px 15px; - @include border-radius(5px); - figcaption{ - font-size: 0.9em; - position: relative; - span{ - margin: -5px -15px 0; - padding: 5px 15px; - display: block; - @include background(linear-gradient(top, $pre-border, $pre-bg)); - &:empty{ - display: none; - } - } - a{ - position: absolute; - top: 5px; - right: 0; - } - } - code, pre{ - background: none; - border: none; - padding: 0; - margin: 0; - @include border-radius(0); - } - .highlight{ - overflow-x: auto; - } - .line-numbers{ - border-right: 1px solid $pre-border; - font-family: $font-mono; - padding-right: 15px; - text-align: right; - } - table{ - border: none; - text-align: left; - margin-top: 0 !important; - td{ - text-align: left; - } - } - td.code{ - width: 100%; - padding-left: 15px; - overflow-x: auto; - } + background: $pre-bg; + border: 1px solid $pre-border; + margin-top: 10px; + padding: 5px 15px; + @include border-radius(5px); + figcaption{ + font-size: 0.9em; + position: relative; + span{ + margin: -5px -15px 0; + padding: 5px 15px; + display: block; + @include background(linear-gradient(top, $pre-border, $pre-bg)); + &:empty{ + display: none; + } + } + a{ + position: absolute; + top: 5px; + right: 0; + } + } + code, pre{ + background: none; + border: none; + padding: 0; + margin: 0; + @include border-radius(0); + } + .highlight{ + overflow-x: auto; + } + .line-numbers{ + border-right: 1px solid $pre-border; + font-family: $font-mono; + padding-right: 15px; + text-align: right; + } + table{ + border: none; + text-align: left; + margin-top: 0; + td{ + text-align: left; + } + } + td.code{ + width: 100%; + padding-left: 15px; + overflow-x: auto; + } } .entry-content .gist{ - background: $pre-bg; - color: $color-meta; - padding: 30px 15px 5px; - margin-top: 15px; - border: 1px solid $pre-border; - position: relative; - overflow: hidden; - @include border-radius(5px); - .gist-file{ - margin: 0; - .gist-data{ - background: none; - border: none; - pre{ - font: 0.9em $font-mono; - line-height: 1.5; - } - } - .gist-meta{ - font: 300 0.9em $color-font; - line-height: 1.5; - margin: 0 -16px -6px; - padding: 5px 15px; - @include background(linear-gradient(top, $pre-bg, $pre-border)); - a{ - color: $color-main01; - &:first-of-type{ - position: absolute; - top: 5px; - right: 15px; - z-index: 1; - } - &:nth-of-type(2){ - position: absolute; - top: 0; - left: 0; - padding: 5px 15px; - width: 100%; - @include background(linear-gradient(top, $pre-border, $pre-bg)); - } - } - } - } + background: $pre-bg; + color: $color-gray01; + padding: 30px 15px 5px; + margin-top: 10px; + border: 1px solid $pre-border; + position: relative; + overflow: hidden; + @include border-radius(5px); + .gist-file{ + margin: 0; + .gist-data{ + background: none; + border: none; + pre{ + font: 0.9em $font-mono; + line-height: 1.5; + } + } + .gist-meta{ + font: 300 0.9em $font-default; + line-height: 1.5; + margin: 0 -16px -6px; + padding: 5px 15px; + @include background(linear-gradient(top, $pre-bg, $pre-border)); + a{ + color: $color-main; + &:first-of-type{ + position: absolute; + top: 5px; + right: 15px; + z-index: 1; + } + &:nth-of-type(2){ + position: absolute; + top: 0; + left: 0; + padding: 5px 15px; + width: 100%; + @include background(linear-gradient(top, $pre-border, $pre-bg)); + } + } + } + } } figure.code, .gist-highlight{ - .c { - color:$base01 !important; - font-style: italic !important; - } - /* Comment */ - .cm { - color:$base01 !important; - font-style: italic !important; - } - /* Comment.Multiline */ - .cp { - color:$base01 !important; - font-style: italic !important; - } - /* Comment.Preproc */ - .c1 { - color:$base01 !important; - font-style: italic !important; - } - /* Comment.Single */ - .cs { - color:$base01 !important; - font-weight:bold !important; - font-style: italic !important; - } - /* Comment.Special */ - .err { - color:$solar-red !important; - background: none !important; - } - /* Error */ - .k { - color: $solar-orange !important; - } - /* Keyword */ - .o { - color:$base1 !important; - font-weight: bold !important; - } - /* Operator */ - .p { - color: $base1 !important; - } - /* Operator */ - .ow { - color:$solar-cyan !important; - font-weight: bold !important; - } - /* Operator.Word */ - .gd { - color:$base1 !important; - background-color:mix($solar-red,$base03,25%) !important; - display: inline-block; - } - /* Generic.Deleted */ - .gd .x { - color:$base1 !important; - background-color:mix($solar-red,$base03,35%) !important; - display: inline-block; - } - /* Generic.Deleted.Specific */ - .ge { - color:$base1 !important; - font-style: italic !important; - } - /* Generic.Emph */ - .gh { - color: $base01 !important; - } - /* Generic.Heading */ - .gi { - color:$base1 !important; - background-color:mix($solar-green,$base03,20%) !important; - display: inline-block; - } - /* Generic.Inserted */ - .gi .x { - color:$base1 !important; - background-color:mix($solar-green,$base03,40%) !important; - display: inline-block; - } - /* Generic.Inserted.Specific */ - .gs { - color:$base1 !important; - font-weight: bold !important; - } - /* Generic.Strong */ - .gu { - color: $solar-violet !important; - } - /* Generic.Subheading */ - .kc { - color:$solar-green !important; - font-weight: bold !important; - } - /* Keyword.Constant */ - .kd { - color: $solar-blue !important; - } - /* Keyword.Declaration */ - .kp { - color:$solar-orange !important; - font-weight: bold !important; - } - /* Keyword.Pseudo */ - .kr { - color:$solar-magenta !important; - font-weight: bold !important; - } - /* Keyword.Reserved */ - .kt { - color: $solar-cyan !important; - } - /* Keyword.Type */ - .n { - color:$solar-blue !important; - } - .na { - color: $solar-blue !important; - } - /* Name.Attribute */ - .nb { - color: $solar-green !important; - } - /* Name.Builtin */ - .nc { - color: $solar-magenta !important; - } - /* Name.Class */ - .no { - color: $solar-yellow !important; - } - /* Name.Constant */ - .nl { - color:$solar-green !important; - } - .ne { - color:$solar-blue !important; - font-weight: bold !important; - } - /* Name.Exception */ - .nf { - color:$solar-blue !important; - font-weight: bold !important; - } - /* Name.Function */ - .nn { - color: $solar-yellow !important; - } - /* Name.Namespace */ - .nt { - color:$solar-blue !important; - font-weight: bold !important; - } - /* Name.Tag */ - .nx { - color:$solar-yellow !Important; - } - .vg { - color: $solar-blue !important; - } - /* Name.Variable.Global */ - .vi { - color: $solar-blue !important; - } - /* Name.Variable.Instance */ - .nv { - color: $solar-blue !important; - } - /* Name.Variable */ - .mf { - color: $solar-cyan !important; - } - /* Literal.Number.Float */ - .m { - color: $solar-cyan !important; - } - /* Literal.Number */ - .mh { - color: $solar-cyan !important; - } - /* Literal.Number.Hex */ - .mi { - color: $solar-cyan !important; - } - /* Literal.Number.Integer */ - .s { - color: $solar-cyan !important; - } - /* Literal.String */ - .sd { - color: $solar-cyan !important; - } - /* Literal.String.Doc */ - .s2 { - color: $solar-cyan !important; - } - /* Literal.String.Double */ - .se { - color: $solar-red !important; - } - /* Literal.String.Escape */ - .si { - color: $solar-blue !important; - } - /* Literal.String.Interpol */ - .sr { - color: $solar-cyan !important; - } - /* Literal.String.Regex */ - .s1 { - color: $solar-cyan !important; - } - /* Literal.String.Single */ + .c { + color:$base01 !important; + font-style: italic !important; + } + /* Comment */ + .cm { + color:$base01 !important; + font-style: italic !important; + } + /* Comment.Multiline */ + .cp { + color:$base01 !important; + font-style: italic !important; + } + /* Comment.Preproc */ + .c1 { + color:$base01 !important; + font-style: italic !important; + } + /* Comment.Single */ + .cs { + color:$base01 !important; + font-weight:bold !important; + font-style: italic !important; + } + /* Comment.Special */ + .err { + color:$solar-red !important; + background: none !important; + } + /* Error */ + .k { + color: $solar-orange !important; + } + /* Keyword */ + .o { + color:$base1 !important; + font-weight: bold !important; + } + /* Operator */ + .p { + color: $base1 !important; + } + /* Operator */ + .ow { + color:$solar-cyan !important; + font-weight: bold !important; + } + /* Operator.Word */ + .gd { + color:$base1 !important; + background-color:mix($solar-red,$base03,25%) !important; + display: inline-block; + } + /* Generic.Deleted */ + .gd .x { + color:$base1 !important; + background-color:mix($solar-red,$base03,35%) !important; + display: inline-block; + } + /* Generic.Deleted.Specific */ + .ge { + color:$base1 !important; + font-style: italic !important; + } + /* Generic.Emph */ + .gh { + color: $base01 !important; + } + /* Generic.Heading */ + .gi { + color:$base1 !important; + background-color:mix($solar-green,$base03,20%) !important; + display: inline-block; + } + /* Generic.Inserted */ + .gi .x { + color:$base1 !important; + background-color:mix($solar-green,$base03,40%) !important; + display: inline-block; + } + /* Generic.Inserted.Specific */ + .gs { + color:$base1 !important; + font-weight: bold !important; + } + /* Generic.Strong */ + .gu { + color: $solar-violet !important; + } + /* Generic.Subheading */ + .kc { + color:$solar-green !important; + font-weight: bold !important; + } + /* Keyword.Constant */ + .kd { + color: $solar-blue !important; + } + /* Keyword.Declaration */ + .kp { + color:$solar-orange !important; + font-weight: bold !important; + } + /* Keyword.Pseudo */ + .kr { + color:$solar-magenta !important; + font-weight: bold !important; + } + /* Keyword.Reserved */ + .kt { + color: $solar-cyan !important; + } + /* Keyword.Type */ + .n { + color:$solar-blue !important; + } + .na { + color: $solar-blue !important; + } + /* Name.Attribute */ + .nb { + color: $solar-green !important; + } + /* Name.Builtin */ + .nc { + color: $solar-magenta !important; + } + /* Name.Class */ + .no { + color: $solar-yellow !important; + } + /* Name.Constant */ + .nl { + color:$solar-green !important; + } + .ne { + color:$solar-blue !important; + font-weight: bold !important; + } + /* Name.Exception */ + .nf { + color:$solar-blue !important; + font-weight: bold !important; + } + /* Name.Function */ + .nn { + color: $solar-yellow !important; + } + /* Name.Namespace */ + .nt { + color:$solar-blue !important; + font-weight: bold !important; + } + /* Name.Tag */ + .nx { + color:$solar-yellow !Important; + } + .vg { + color: $solar-blue !important; + } + /* Name.Variable.Global */ + .vi { + color: $solar-blue !important; + } + /* Name.Variable.Instance */ + .nv { + color: $solar-blue !important; + } + /* Name.Variable */ + .mf { + color: $solar-cyan !important; + } + /* Literal.Number.Float */ + .m { + color: $solar-cyan !important; + } + /* Literal.Number */ + .mh { + color: $solar-cyan !important; + } + /* Literal.Number.Hex */ + .mi { + color: $solar-cyan !important; + } + /* Literal.Number.Integer */ + .s { + color: $solar-cyan !important; + } + /* Literal.String */ + .sd { + color: $solar-cyan !important; + } + /* Literal.String.Doc */ + .s2 { + color: $solar-cyan !important; + } + /* Literal.String.Double */ + .se { + color: $solar-red !important; + } + /* Literal.String.Escape */ + .si { + color: $solar-blue !important; + } + /* Literal.String.Interpol */ + .sr { + color: $solar-cyan !important; + } + /* Literal.String.Regex */ + .s1 { + color: $solar-cyan !important; + } + /* Literal.String.Single */ } diff --git a/sass/parts/_twitter.scss b/sass/parts/_twitter.scss new file mode 100644 index 00000000..6a8e6a14 --- /dev/null +++ b/sass/parts/_twitter.scss @@ -0,0 +1,49 @@ +#banner{ + color: $color-gray02; + padding: 30px 0; + line-height: 30px; + text-align: center; + position: relative; + display: none; + @include border-shadow(); + &:hover{ + a{ + color: $color-main; + } + } + a{ + color: $color-gray02; + @include transition(0.3s); + &:hover{ + text-decoration: underline; + } + } + small{ + position: absolute; + right: 0; + bottom: 0; + } + .loading{ + background: image-url('loading_pacman.gif') center no-repeat; + text-indent: -9999px; + } + .container{ + height: 30px; + overflow: hidden; + position: relative; + display: none; + .feed{ + list-style: none; + position: absolute; + top: 0; + width: 100%; + li{ + position: relative; + small{ + position: absolute; + right: 0; + } + } + } + } +} \ No newline at end of file diff --git a/sass/plugins/_fancybox.scss b/sass/plugins/_fancybox.scss index 9dfb6f92..20a94377 100644 --- a/sass/plugins/_fancybox.scss +++ b/sass/plugins/_fancybox.scss @@ -19,9 +19,7 @@ background: #f9f9f9; color: #444; text-shadow: none; - -webkit-border-radius: 4px; - -moz-border-radius: 4px; - border-radius: 4px; + @include border-radius(4px); } .fancybox-opened { @@ -29,9 +27,7 @@ } .fancybox-opened .fancybox-skin { - -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); - -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); - box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); + @include box-shadow(0 10px 25px rgba(0, 0, 0, 0.5)); } .fancybox-outer, .fancybox-inner { @@ -203,14 +199,12 @@ padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); - -webkit-border-radius: 15px; - -moz-border-radius: 15px; - border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; + @include border-radius(15px); } .fancybox-title-outside-wrap { diff --git a/sass/screen.scss b/sass/screen.scss index 96025e39..1f83d49a 100644 --- a/sass/screen.scss +++ b/sass/screen.scss @@ -1,5 +1,7 @@ @import "compass"; +@import "custom/color"; + @import "base"; @import "parts"; @import "plugins"; \ No newline at end of file diff --git a/source/_includes/after_footer.html b/source/_includes/after_footer.html index 8246c1f3..09d93b76 100644 --- a/source/_includes/after_footer.html +++ b/source/_includes/after_footer.html @@ -1,4 +1,5 @@ -{% include fancybox.html %} -{% include phasebeam.html %} + +{% include fancybox.html %} {% include disqus.html %} +{% include google_analytics.html %} {% include custom/after_footer.html %} \ No newline at end of file diff --git a/source/_includes/archive_post.html b/source/_includes/archive_post.html index c47dc424..65e923f1 100644 --- a/source/_includes/archive_post.html +++ b/source/_includes/archive_post.html @@ -5,12 +5,15 @@ {% unless forloop.first %} {% endunless %} -
{{ date | date: "%Y" }}
+

{{ date | date: "%Y" }}

{% endunless %} -
-

{{ post.title }}

-
- -
{{ post.categories | category_links }}
-
+
+

{{post.title}}

+
+ {{ date | date: "%b %e" }} + {% include post/categories.html %} + {% if site.disqus_short_name and post.comments == true and site.disqus_show_comment_count == true %} + Comments + {% endif %} +
\ No newline at end of file diff --git a/source/_includes/article.html b/source/_includes/article.html index aee6efb1..13861563 100644 --- a/source/_includes/article.html +++ b/source/_includes/article.html @@ -1,32 +1,26 @@ -
- {% if index %} -

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

- {% else %} -

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

- {% endif %} - {% if post or page.single %}{% include post/date.html %}{% endif %} -
-
- {% if index %} - {{ content | excerpt }} - {% else %} - {{ content }} - {% unless index %} - {% include post/sharing.html %} - {% endunless %} - {% endif %} - {% if post or page.single %} -
- {% include post/categories.html %} - {% if site.disqus_short_name and site.disqus_show_comment_count == true %} - {% if post.comments == true %} - Comments - {% endif %} - {% if page.comments == true %} - Comments - {% endif %} - {% endif %} -
- {% endif %} -
-{% include post/comment.html %} \ No newline at end of file +{% if index %} +

+ {% if post.external-url %} + + {% else %} + + {% endif %} + {% if site.titlecase %}{{ post.title | titlecase }}{% else %}{{ post.title }}{% endif %} +

+
+ {{ content | excerpt }} + {% capture excerpted %}{{ content | has_excerpt }}{% endcapture %} + {% if excerpted == 'true' %}{{ site.excerpt_link }}{% endif %} +
+{% else %} +

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

+
{{ content }}
+{% endif %} + +
+
{% include post/date.html %}{{ time }}
+
{% include post/categories.html %}
+ {% if site.disqus_short_name and site.disqus_show_comment_count == true %} + Comments + {% endif %} +
\ No newline at end of file diff --git a/source/_includes/banner.html b/source/_includes/banner.html new file mode 100644 index 00000000..af38f032 --- /dev/null +++ b/source/_includes/banner.html @@ -0,0 +1,15 @@ +{% if site.twitter_user and site.twitter_tweet_count > 0 %} + + + +{% endif %} \ No newline at end of file diff --git a/source/_includes/custom/footer.html b/source/_includes/custom/footer.html index 2a654ea5..d6b4a362 100644 --- a/source/_includes/custom/footer.html +++ b/source/_includes/custom/footer.html @@ -1 +1,6 @@ -

© {{ site.time | date: "%Y" }} {{ site.author }}

\ No newline at end of file +Copyright © {{ site.time | date: "%Y" }} +{% if site.author %} + {{ site.author }} +{% else %} + {{ site.title }} +{% endif %} diff --git a/source/_includes/custom/navigation.html b/source/_includes/custom/navigation.html index b207ca4a..f16a7a2a 100644 --- a/source/_includes/custom/navigation.html +++ b/source/_includes/custom/navigation.html @@ -1,7 +1,7 @@ \ No newline at end of file diff --git a/source/_includes/fancybox.html b/source/_includes/fancybox.html index 0529d671..fd5bcfdb 100644 --- a/source/_includes/fancybox.html +++ b/source/_includes/fancybox.html @@ -1,18 +1,6 @@ \ No newline at end of file diff --git a/source/_includes/footer.html b/source/_includes/footer.html index 72e2c3df..aa810747 100644 --- a/source/_includes/footer.html +++ b/source/_includes/footer.html @@ -1,20 +1 @@ - -{% include custom/footer.html %} -
\ No newline at end of file +{% include custom/footer.html %} \ No newline at end of file diff --git a/source/_includes/google_analytics.html b/source/_includes/google_analytics.html index 4d4d5969..2950c768 100644 --- a/source/_includes/google_analytics.html +++ b/source/_includes/google_analytics.html @@ -1,13 +1,13 @@ {% if site.google_analytics_tracking_id %} - + (function() { + var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; + ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; + var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); + })(); + {% endif %} diff --git a/source/_includes/head.html b/source/_includes/head.html index 16d74d6f..2adee9f3 100644 --- a/source/_includes/head.html +++ b/source/_includes/head.html @@ -2,19 +2,19 @@ - {% if page.title %}{{ page.title }} | {% endif %}{{ site.title }} + {% if page.title %}{{ page.title }} - {% endif %}{{ site.title }} {% capture description %}{% if page.description %}{{ page.description }}{% else %}{{ content | raw_content }}{% endif %}{% endcapture %} {% if page.keywords %}{% endif %} + - - {% include google_analytics.html %} + {% include custom/head.html %} \ No newline at end of file diff --git a/source/_includes/header.html b/source/_includes/header.html index f2961830..5fb456ae 100644 --- a/source/_includes/header.html +++ b/source/_includes/header.html @@ -1,2 +1,56 @@ - -{% include custom/header.html %} \ No newline at end of file +

{{ site.title }}

+ + + +{% include custom/header.html %} diff --git a/source/_includes/navigation.html b/source/_includes/navigation.html index 2f0e6280..888042ea 100644 --- a/source/_includes/navigation.html +++ b/source/_includes/navigation.html @@ -1,15 +1 @@ -
    -
  • RSS
  • - {% if site.subscribe_email %} -
  • Email
  • - {% endif %} -
- {% if site.simple_search %} -
-
- - -
-
- {% endif %} -{% include custom/navigation.html %} +{% include custom/navigation.html %} \ No newline at end of file diff --git a/source/_includes/post/categories.html b/source/_includes/post/categories.html index 9763a528..8c1c81f7 100644 --- a/source/_includes/post/categories.html +++ b/source/_includes/post/categories.html @@ -1,6 +1,8 @@ -{% capture category %}{% if post %}{{ post.categories | category_links | replace:', ','' }}{% else %}{{ page.categories | category_links | replace:', ','' }}{% endif %}{% endcapture %} -{% capture has_category %}{% if post %}{{ post.categories | category_links | size }}{% else %}{{ page.categories | category_links | size }}{% endif %}{% endcapture %} - -{% unless has_category == '0' %} -
{{ category }}
-{% endunless %} \ No newline at end of file +{% capture category %}{% if post %}{{ post.categories | category_links | size }}{% else %}{{ page.categories | category_links | size }}{% endif %}{% endcapture %} +{% unless category == '0' %} +{% if post %} + {{ post.categories | category_links }} +{% else %} + {{ page.categories | category_links }} +{% endif %} +{% endunless %} diff --git a/source/_includes/post/date.html b/source/_includes/post/date.html index fd27160a..ecf1ad71 100644 --- a/source/_includes/post/date.html +++ b/source/_includes/post/date.html @@ -6,14 +6,10 @@ {% capture updated_formatted %}{{ page.updated_formatted }}{{ post.updated_formatted }}{% endcapture %} {% capture was_updated %}{{ updated | size }}{% endcapture %} +{% if has_date != '0' %} + {% capture time %}{% endcapture %} +{% endif %} + {% if was_updated != '0' %} - -{% else %} - {% if has_date != '0' %} - - {% endif %} -{% endif %} \ No newline at end of file + {% 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 205664d2..735c992f 100644 --- a/source/_includes/post/sharing.html +++ b/source/_includes/post/sharing.html @@ -1,4 +1,4 @@ - diff --git a/source/_layouts/category_index.html b/source/_layouts/category_index.html index 228b6ab5..8ab5341a 100644 --- a/source/_layouts/category_index.html +++ b/source/_layouts/category_index.html @@ -2,14 +2,6 @@ layout: default --- -
-

{{ page.title }}

- -
- {% for post in site.categories[page.category] %} {% include archive_post.html %} -{% endfor %} \ No newline at end of file +{% endfor %} diff --git a/source/_layouts/default.html b/source/_layouts/default.html index 18f16dfa..a3fc49db 100644 --- a/source/_layouts/default.html +++ b/source/_layouts/default.html @@ -3,6 +3,9 @@ + {% unless page.banner == false %} + {% include banner.html %} + {% endunless %}
{{ content | expand_urls: root_url }}
{% include footer.html %}
{% include after_footer.html %} diff --git a/source/_layouts/page.html b/source/_layouts/page.html index 5f4baca5..5c1381dc 100644 --- a/source/_layouts/page.html +++ b/source/_layouts/page.html @@ -2,4 +2,18 @@ layout: default --- -
{% include article.html %}
\ No newline at end of file +
+ {% if page.title %} +

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

+ {% endif %} +
{{ content }}
+
+{% unless page.sharing == false %} + {% include post/sharing.html %} +{% endunless %} +{% if site.disqus_short_name and page.comments == true %} +
+

Comments

+
{% include post/disqus_thread.html %}
+
+{% endif %} diff --git a/source/_layouts/post.html b/source/_layouts/post.html index e43605f0..eed607e3 100644 --- a/source/_layouts/post.html +++ b/source/_layouts/post.html @@ -3,4 +3,13 @@ layout: default single: true --- -
{% include article.html %}
\ No newline at end of file +
{% include article.html %}
+{% unless page.sharing == false %} + {% include post/sharing.html %} +{% endunless %} +{% if site.disqus_short_name and page.comments == true %} +
+

Comments

+
{% include post/disqus_thread.html %}
+
+{% endif %} \ No newline at end of file diff --git a/source/blog/archives/index.html b/source/blog/archives/index.html index 0402bd6a..e4bc23ca 100644 --- a/source/blog/archives/index.html +++ b/source/blog/archives/index.html @@ -1,16 +1,8 @@ --- layout: default -title: Archives +title: Blog Archives --- -
-

Archives

- -
- {% for post in site.posts reverse %} {% include archive_post.html %} {% endfor %} \ No newline at end of file diff --git a/source/images/loading_gray.gif b/source/images/loading_gray.gif new file mode 100644 index 0000000000000000000000000000000000000000..945a2aa191fe5225dd7eae2ce2e3156ec44bd829 GIT binary patch literal 8787 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 literal 0 HcmV?d00001 diff --git a/source/images/loading_pacman.gif b/source/images/loading_pacman.gif new file mode 100644 index 0000000000000000000000000000000000000000..8f61add1d0235e755c7ad79f0033efa756bf4876 GIT binary patch literal 1928 zcmdUv-A_|z9LEo*=k)Egr7tUm0@C7EN=0O-Q`EU?K{0WQi(BFaS=J1eu{d>$$+kN^ zeNFVjjB`OxlYz8x7cG&>R$v=1LU>tADYU#4EVV$8^12&CwwrCgV#mt<1AZ4LPoC%d ze4o$vIlnv?FI_lUq0dILk!=Lo+S(c&9bI2vUtCQkqYI=Ga_JSC;z#x%GEH5vEc6N3aG~hfwJ`Nf< z1vK$^92{0wRzN&AHy4dYmzI{`3nxY*5pV_vScOSYf?#rT5&*yf24D+rAfB0-0dp`M z8yf>RkbxfAZ>9W8uKTJ^f4i<$@pb*}&lLL4_1|2-sjn@qzwzl!MENI%;1EgqH}PK8 z2Um6Hu2hwmmN7D5sw9~-`4bTqeFq^8Mw8iMkY-^5Ig$5z5o$F`I84Gu+cYH-DwA(_ z*tlXVPv~?Wwz6AX_CplMW9PH2DA#Laswqad?F|aS1{6aG-ksMp)ac30_ahm_eg}5 zUVd`Hb48I#kdco2a4&AIAe;5(E^aP|y@N}a^DKbtA`Xg8>=w84gw(`ocfMstxm~pC zxP{ScD>!P!2Kkv3-diT2kjC~SVRFh{*bokOl|QC@y~7l1kjOn|Mdx}s*3MO;tf@`# zk~rx#@kB3c^1o9M(c(&p`qyWZtFa%sva;H1%}?)I8E9L5*hX;5`9rqkDo1yZHwwGT3wKH0AT3 zIcj0~X{^|U&Lqy}8#@v-CkcJZ%o8O z8?~y1DQreMcI*GJp*Q}!Y-ULcJ7+I;PLlz+Il$fJ)<{W4Z+j7m4LT}xhZ_*wckb+Q zp1IMjD&!PXNW@+6jy7nS7?hvkoHzgGqlJemy{zAzG7^n%KkeA2-~PDbkD^b`E19BL zmG;YO(p{7HQ9iBJKUYahuYc>hm7z0V#;dOheEcN1{YWP&V6;KoSY=Ms^PL5C_d>Cglsc6=mCk0PwNZ5Tnr5oSNx z8U4k;7DNP1MxH1rdTbUy>5^ABAG=Hb{6141bzsf?I4`HXuJ4v!JaCUfGg8QSI`Y1} XbY^;j{nPENbnJcbw46@9+dK6S#>>V+ literal 0 HcmV?d00001 diff --git a/source/images/social/coderwall.png b/source/images/social/coderwall.png new file mode 100644 index 0000000000000000000000000000000000000000..48e32cfc331510b34e791f07d141b744df5db0a2 GIT binary patch literal 2983 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 literal 0 HcmV?d00001 diff --git a/source/images/social/delicious.png b/source/images/social/delicious.png new file mode 100644 index 0000000000000000000000000000000000000000..a936776bb3b0db6cc185700b16261e241eb2b398 GIT binary patch literal 1064 zcmaJ=TSyd97#=BW6_{ru!wRMu}Fl z3T;9SqioTj7?O5MDmn_n|6NtJ4%0DVk%+BLsnqYZeqW3B>sjfjCG-kvS&Z?hX5V?O|WQ z&oD8DrTu|eBhV*VCVYf7_WznOUjq~A@{rA1!uoc-mj#PnPRIHZt82`Ti~3Uk?B!Ylp0*+7m{3+ootz+WN)WnQ(*-(AUCxn zQK2F?C$HG5!d3}vt`(3C64qBz04piUwpD^SD#ABF!8yMuRl!uxKsVXI%uvD1M9IxIyg#@@$ndN=gc>^!3Zj z%k|2Q_413-^$jg8E%gnI^o@*kfhu&1EAvVcD|GXUm0>2hq!uR^WfqiV=I1GZOiWD5 zFD|nT4yNnK4YS zXI^nhVqS78Om8MauQ^`5R?bDKi6!|(A^G_^u*49MkzbNuoRMFk;2dnM;G3A7nFr#7 zVhZRkkV{jGGRsm^+=}vZ6~KXJm5F43X(`Zh12ac6M-vlAOG8I97Z*cA3v*Xf3nvpx zR}*t{V-r_rC8)*}Bu_&$ni9~c4|Ik;D1{)U7?=<+8G@Mb^bh2~b5Lp?Fu;p|`D4fT zE^Y<}#x_qE$B>F!OM>@$F*^#}yLmUJsjXo_>r^q#8itJ`^VNHoD%mx*X1q53!D82( znWJKuk;vuPh%65ok(s5( zKm0v%gZp`;-qeTLlePvYA5S=R%(5?dvw7;)87F6jIWM^X%%^8}_$0aMiVlk1rFKT= z@*P_eV^^!>e9&3&A@S`VaWAjHX`YM!Wyma-UHU}IEJ($o-*~g6zYqH&uhVyO%@(aw zDV!3yf34`(iBE(IzgM=Y82etaeem)}%hrV7Hoqq>;qRz?cBvt4J;TkDrW|j));^Ap zW7y04oo`yW##hxp-CLr*&*OJyid7ZbQt710zIN&_juYk!>SYB)>^|c@) zWWt`!_hvU8)v{WqE!DlQB!fKp2MalGdas4G4nZ5^!?tBI4>I>VHtW2;$}+ zXh%UPBL0XLe}J1qHU*(Wmxhv2DJAJ~cj0=?-RGcz7}GZR!aLl@-NXBRcZUD~7y8jBA6Q5q$RqNY+x0sv^OnGoW- zObaH)*l08w&3e6lXBfsh03eLL7#=W2_ATgmZqg^cwS)Qg$e%Z2&-F z7&^1rtjid?DAj`R`&Jl+r`cK%1hx?3mUDi#5`fV66ECnyDZM0w>@NkZ@?)kZSjDFX00000NkvXXu0mjfs7S&C literal 0 HcmV?d00001 diff --git a/source/index.html b/source/index.html index d87fe87a..8e298160 100644 --- a/source/index.html +++ b/source/index.html @@ -5,6 +5,14 @@ layout: default {% assign index = true %} {% for post in paginator.posts %} {% assign content = post.content %} -
{% include article.html %}
+
{% include article.html %}
{% endfor %} -{% include pagination.html %} \ No newline at end of file + \ No newline at end of file diff --git a/source/javascripts/slash.js b/source/javascripts/slash.js new file mode 100644 index 00000000..52885722 --- /dev/null +++ b/source/javascripts/slash.js @@ -0,0 +1,62 @@ +(function($){ + // Open external links in new window + var externalLinks = function(){ + var host = location.host; + + $('body').on('click', 'a', function(e){ + var href = this.href, + link = href.replace(/https?:\/\/([^\/]+)(.*)/, '$1'); + + if (link != '' && link != host && !$(this).hasClass('fancybox')){ + window.open(href); + e.preventDefault(); + } + }); + }; + + // Append caption after pictures + var appendCaption = function(){ + $('.entry-content').each(function(i){ + var _i = i; + $(this).find('img').each(function(){ + var alt = this.alt; + + if (alt != ''){ + $(this).after(''+alt+''); + } + + $(this).wrap(''); + }); + }); + }; + + externalLinks(); // Delete or comment this line to disable opening external links in new window + appendCaption(); // Delete or comment this line to disable caption + + var mobilenav = $('#mobile-nav'); + + $('html').click(function(){ + mobilenav.find('.on').each(function(){ + $(this).removeClass('on').next().hide(); + }); + }); + + mobilenav.on('click', '.menu .button', function(){ + if (!$(this).hasClass('on')){ + var width = $(this).width() + 42; + $(this).addClass('on').next().show().css({width: width}); + } else { + $(this).removeClass('on').next().hide(); + } + }).on('click', '.search .button', function(){ + if (!$(this).hasClass('on')){ + var width = mobilenav.width() - 51; + mobilenav.children('.menu').children().eq(0).removeClass('on').next().hide(); + $(this).addClass('on').next().show().css({width: width}).children().children().eq(0).focus(); + } else { + $(this).removeClass('on').next().hide().children().children().eq(0).val(''); + } + }).click(function(e){ + e.stopPropagation(); + }); +})(jQuery); \ No newline at end of file diff --git a/source/javascripts/twitter.js b/source/javascripts/twitter.js index 3e2dd0d7..00ecc365 100644 --- a/source/javascripts/twitter.js +++ b/source/javascripts/twitter.js @@ -1,78 +1,92 @@ -// JSON-P Twitter fetcher for Octopress -// (c) Brandon Mathis // MIT License +(function($){ + $.fn.getTwitterFeed = function(userid, count, reply){ + var banner = $(this), + feed = banner.find('.feed'), + interval = 10000, + speed = 500; -/* Sky Slavin, Ludopoli. MIT license. * based on JavaScript Pretty Date * Copyright (c) 2008 John Resig (jquery.com) * Licensed under the MIT license. */ -function prettyDate(time) { - if (navigator.appName === 'Microsoft Internet Explorer') { - return ""; // because IE date parsing isn't fun. - } - var say = { - just_now: " now", - minute_ago: "1m", - minutes_ago: "m", - hour_ago: "1h", - hours_ago: "h", - yesterday: "1d", - days_ago: "d", - last_week: "1w", - weeks_ago: "w" - }; + var linkify = function(text){ + text = text.replace(/(https?:\/\/)([\w\-:;?&=+.%#\/]+)/gi, '$2').replace(/(^|\W)@(\w+)/g, '$1@$2').replace(/(^|\W)#(\w+)/g, '$1#$2'); - var current_date = new Date(), - current_date_time = current_date.getTime(), - current_date_full = current_date_time + (1 * 60000), - date = new Date(time), - diff = ((current_date_full - date.getTime()) / 1000), - day_diff = Math.floor(diff / 86400); + return text; + } - if (isNaN(day_diff) || day_diff < 0) { return ""; } + var relativeDate = function(date){ + if (navigator.appName === 'Microsoft Internet Explorer') return ''; - return day_diff === 0 && ( - diff < 60 && say.just_now || - diff < 120 && say.minute_ago || - diff < 3600 && Math.floor(diff / 60) + say.minutes_ago || - diff < 7200 && say.hour_ago || - diff < 86400 && Math.floor(diff / 3600) + say.hours_ago) || - day_diff === 1 && say.yesterday || - day_diff < 7 && day_diff + say.days_ago || - day_diff === 7 && say.last_week || - day_diff > 7 && Math.ceil(day_diff / 7) + say.weeks_ago; -} + var unit = { + now: 'Now', + minute: '1 min', + minutes: ' mins', + hour: '1 hr', + hours: ' hrs', + day: 'Yesterday', + days: ' days', + week: '1 week', + weeks: ' weeks' + }; -function linkifyTweet(text, url) { - // Linkify urls, usernames, hashtags - text = text.replace(/(https?:\/\/)([\w\-:;?&=+.%#\/]+)/gi, '$2') - .replace(/(^|\W)@(\w+)/g, '$1@$2') - .replace(/(^|\W)#(\w+)/g, '$1#$2'); + var current = new Date(), + tweet = new Date(date), + diff = (((current.getTime() + (1 * 60000)) - tweet.getTime()) / 1000), + day_diff = Math.floor(diff / 86400); + + if (day_diff == 0){ + if (diff < 60) return unit.now; + else if (diff < 120) return unit.minute; + else if (diff < 3600) return Math.floor(diff / 60) + unit.minutes; + else if (diff < 7200) return unit.hour; + else if (diff < 86400) return Math.floor(diff / 3600) + unit.hours; + else return ''; + } else if (day_diff == 1) { + return unit.day; + } else if (day_diff < 7) { + return day_diff + unit.days; + } else if (day_diff == 7) { + return unit.week; + } else if (day_diff > 7) { + return Math.ceil(day_diff / 7) + unit.weeks; + } else { + return ''; + } + } - // Use twitter's api to replace t.co shortened urls with expanded ones. - for (var u in url) { - if(url[u].expanded_url != null){ - var shortUrl = new RegExp(url[u].url, 'g'); - text = text.replace(shortUrl, url[u].expanded_url); - var shortUrl = new RegExp(">"+(url[u].url.replace(/https?:\/\//, '')), 'g'); - text = text.replace(shortUrl, ">"+url[u].display_url); - } - } - return text -} + if ($(window).width() > 600){ + var url = 'https://api.twitter.com/1/statuses/user_timeline/'+userid+'.json?count='+count+'&exclude_replies='+(reply ? '0' : '1')+'&trim_user=true&callback=?'; + banner.show(); + $.getJSON(url, function(json){ + var length = json.length, + fragment = document.createDocumentFragment(), + counts = 0, + timeout; -function showTwitterFeed(tweets, twitter_user) { - var timeline = document.getElementById('tweets'), - content = ''; + for (var i=0; i'+relativeDate(json[i].created_at)+''; + fragment.appendChild(item); + } - for (var t in tweets) { - content += '
  • '+'

    '+''+prettyDate(tweets[t].created_at)+''+linkifyTweet(tweets[t].text.replace(/\n/g, '
    '), tweets[t].entities.urls)+'

    '+'
  • '; - } - timeline.innerHTML = content; -} + var play = function(){ + timeout = setTimeout(function(){ + feed.animate({top: '-='+30}, speed, function(){ + $(this).append($(this).children().eq(counts).clone()); + counts++; + play(); + }); + }, interval); + } -function getTwitterFeed(user, count, replies) { - count = parseInt(count, 10); - $.ajax({ - url: "https://api.twitter.com/1/statuses/user_timeline/" + user + ".json?trim_user=true&count=" + (count + 20) + "&include_entities=1&exclude_replies=" + (replies ? "0" : "1") + "&callback=?" - , type: 'jsonp' - , error: function (err) { $('#tweets li.loading').addClass('error').text("Twitter's busted"); } - , success: function(data) { showTwitterFeed(data.slice(0, count), user); } - }) -} + var pause = function(){ + clearTimeout(timeout); + } + + banner.on('mouseenter', pause).on('mouseleave', play) + .children('.loading').hide().end() + .children('.container').show() + .children('.feed').append(fragment); + + play(); + }); + } + }; +})(jQuery); \ No newline at end of file