mirror of
https://github.com/wahyd4/wahyd4.github.com.git
synced 2026-08-09 05:15:56 +10:00
dfd
This commit is contained in:
Submodule
+1
Submodule .themes/slash added at 2cc927dd8c
+3
-2
@@ -1,4 +1,5 @@
|
||||
@import "base/color";
|
||||
@import "base/font";
|
||||
@import "base/utilities";
|
||||
@import "base/layout";
|
||||
@import "base/layout";
|
||||
@import "base/typography";
|
||||
@import "base/utilities";
|
||||
+3
-2
@@ -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";
|
||||
@import "parts/twitter";
|
||||
@@ -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);
|
||||
$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;
|
||||
+11
-15
@@ -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;
|
||||
}
|
||||
+29
-20
@@ -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%;
|
||||
}
|
||||
}
|
||||
+1
-136
@@ -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;
|
||||
}
|
||||
}
|
||||
+21
-20
@@ -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;
|
||||
}
|
||||
@@ -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;
|
||||
+71
-108
@@ -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";}
|
||||
}
|
||||
}
|
||||
}
|
||||
+138
-271
@@ -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();
|
||||
}
|
||||
@@ -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;
|
||||
}
|
||||
}
|
||||
+5
-45
@@ -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;
|
||||
}
|
||||
+390
-21
@@ -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%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.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%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -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";}
|
||||
}
|
||||
}
|
||||
+337
-337
@@ -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 */
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -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 {
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
@import "compass";
|
||||
|
||||
@import "custom/color";
|
||||
|
||||
@import "base";
|
||||
@import "parts";
|
||||
@import "plugins";
|
||||
@@ -1,4 +1,5 @@
|
||||
{% include fancybox.html %}
|
||||
{% include phasebeam.html %}
|
||||
<script src="{{ root_url }}/javascripts/slash.js"></script>
|
||||
{% include fancybox.html %} <!-- Delete or comment this line to disable Fancybox -->
|
||||
{% include disqus.html %}
|
||||
{% include google_analytics.html %}
|
||||
{% include custom/after_footer.html %}
|
||||
@@ -5,12 +5,15 @@
|
||||
{% unless forloop.first %}
|
||||
</section>
|
||||
{% endunless %}
|
||||
<section class="archives"><div class="year">{{ date | date: "%Y" }}</div>
|
||||
<section class="archives"><h1 class="year">{{ date | date: "%Y" }}</h1>
|
||||
{% endunless %}
|
||||
<article class="archive">
|
||||
<h1 class="title"><a href="{{ root_url }}{{ post.url }}">{{ post.title }}</a></h1>
|
||||
<footer>
|
||||
<time datetime="{{ date | datetime | date_to_xmlschema }}">{{ date | date: "%b %e" }}</time>
|
||||
<div class="tags">{{ post.categories | category_links }}</div>
|
||||
</footer>
|
||||
<article>
|
||||
<h2 class="title"><a href="{{ root_url }}{{ post.url }}">{{post.title}}</a></h2>
|
||||
<div class="meta">
|
||||
<span class="date">{{ date | date: "%b %e" }}</span>
|
||||
<span class="tags">{% include post/categories.html %}</span>
|
||||
{% if site.disqus_short_name and post.comments == true and site.disqus_show_comment_count == true %}
|
||||
<span class="comments"><a href="{{ root_url }}{{ post.url }}#disqus_thread">Comments</a></span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</article>
|
||||
@@ -1,32 +1,26 @@
|
||||
<header>
|
||||
{% if index %}
|
||||
<h1 class="title"><a href="{{ root_url }}{{ post.url }}">{% if site.titlecase %}{{ post.title | titlecase }}{% else %}{{ post.title }}{% endif %}</a></h1>
|
||||
{% else %}
|
||||
<h1 class="title">{% if site.titlecase %}{{ page.title | titlecase }}{% else %}{{ page.title }}{% endif %}</h1>
|
||||
{% endif %}
|
||||
{% if post or page.single %}{% include post/date.html %}{% endif %}
|
||||
</header>
|
||||
<div class="entry-content">
|
||||
{% if index %}
|
||||
{{ content | excerpt }}
|
||||
{% else %}
|
||||
{{ content }}
|
||||
{% unless index %}
|
||||
{% include post/sharing.html %}
|
||||
{% endunless %}
|
||||
{% endif %}
|
||||
{% if post or page.single %}
|
||||
<footer class="meta">
|
||||
{% include post/categories.html %}
|
||||
{% if site.disqus_short_name and site.disqus_show_comment_count == true %}
|
||||
{% if post.comments == true %}
|
||||
<a class="comment" href="{{ root_url }}{{ post.url }}#disqus_thread">Comments</a>
|
||||
{% endif %}
|
||||
{% if page.comments == true %}
|
||||
<a class="comment" href="{{ root_url }}{{ page.url }}#disqus_thread">Comments</a>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</footer>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include post/comment.html %}
|
||||
{% if index %}
|
||||
<h2 class="title">
|
||||
{% if post.external-url %}
|
||||
<a href="{{ post.external-url }}">
|
||||
{% else %}
|
||||
<a href="{{ root_url }}{{ post.url }}">
|
||||
{% endif %}
|
||||
{% if site.titlecase %}{{ post.title | titlecase }}{% else %}{{ post.title }}{% endif %}</a>
|
||||
</h2>
|
||||
<div class="entry-content">
|
||||
{{ content | excerpt }}
|
||||
{% capture excerpted %}{{ content | has_excerpt }}{% endcapture %}
|
||||
{% if excerpted == 'true' %}<a href="{{ root_url }}{{ post.url }}" class="more-link">{{ site.excerpt_link }}</a>{% endif %}
|
||||
</div>
|
||||
{% else %}
|
||||
<h2 class="title">{% if site.titlecase %}{{ page.title | titlecase }}{% else %}{{ page.title }}{% endif %}</h2>
|
||||
<div class="entry-content">{{ content }}</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="meta">
|
||||
<div class="date">{% include post/date.html %}{{ time }}</div>
|
||||
<div class="tags">{% include post/categories.html %}</div>
|
||||
{% if site.disqus_short_name and site.disqus_show_comment_count == true %}
|
||||
<span class="comments"><a href="{{ root_url }}{{ post.url }}{{ page.url }}#disqus_thread">Comments</a></span>
|
||||
{% endif %}
|
||||
</div>
|
||||
@@ -0,0 +1,15 @@
|
||||
{% if site.twitter_user and site.twitter_tweet_count > 0 %}
|
||||
<div id="banner" class="inner">
|
||||
<div class="container">
|
||||
<ul class="feed"></ul>
|
||||
</div>
|
||||
<small><a href="http://twitter.com/{{ site.twitter_user }}">{{ site.twitter_user }}</a> @ <a href="http://twitter.com">Twitter</a></small>
|
||||
<div class="loading">Loading...</div>
|
||||
</div>
|
||||
<script src="{{ root_url }}/javascripts/twitter.js"></script>
|
||||
<script type="text/javascript">
|
||||
(function($){
|
||||
$('#banner').getTwitterFeed('{{ site.twitter_user }}', {{ site.twitter_tweet_count }}, {{ site.twitter_show_replies }});
|
||||
})(jQuery);
|
||||
</script>
|
||||
{% endif %}
|
||||
@@ -1 +1,6 @@
|
||||
<p>© {{ site.time | date: "%Y" }} {{ site.author }}</p>
|
||||
Copyright © {{ site.time | date: "%Y" }}
|
||||
{% if site.author %}
|
||||
{{ site.author }}
|
||||
{% else %}
|
||||
{{ site.title }}
|
||||
{% endif %}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<ul>
|
||||
<li><a href="{{ root_url }}/">首页</a></li>
|
||||
<li><a href="{{ root_url }}/blog/archives">存档</a></li>
|
||||
<li><a href="{{ root_url }}/about">关心</a></li>
|
||||
<li><a href="{{ root_url }}/about">关于我</a></li>
|
||||
<li><a href="{{ root_url }}/recommend">推荐</a></li>
|
||||
<li><a href="{{ root_url }}/career">My Career</a></li>
|
||||
<li><a href="{{ root_url }}/my-career">My Career</a></li>
|
||||
</ul>
|
||||
@@ -1,18 +1,6 @@
|
||||
<script src="{{ root_url }}/javascripts/jquery.fancybox.pack.js"></script>
|
||||
<script type="text/javascript">
|
||||
(function($){
|
||||
$('.entry-content').each(function(i){
|
||||
var _i = i;
|
||||
$(this).find('img').each(function(){
|
||||
var alt = $(this).attr('alt');
|
||||
|
||||
if (alt == '' || typeof alt == 'undefined'){
|
||||
$(this).wrap('<a href="'+$(this).attr('src')+'" class="fancybox" rel="gallery'+_i+'" />');
|
||||
} else {
|
||||
$(this).after('<span class="caption">'+alt+'</span>').wrap('<a href="'+$(this).attr('src')+'" class="fancybox" title="'+alt+'" rel="gallery'+_i+'" />');
|
||||
}
|
||||
});
|
||||
});
|
||||
$('.fancybox').fancybox();
|
||||
})(jQuery);
|
||||
(function($){
|
||||
$('.fancybox').fancybox();
|
||||
})(jQuery);
|
||||
</script>
|
||||
@@ -1,20 +1 @@
|
||||
<div class="social alignright">
|
||||
{% if site.facebook_user %}
|
||||
<a class="facebook" href="http://www.facebook.com/{{ site.facebook_user }}" title="Facebook">Facebook</a>
|
||||
{% endif %}
|
||||
{% if site.googleplus_user %}
|
||||
<a class="google" href="https://plus.google.com/{{ site.googleplus_user }}" title="Google+">Google+</a>
|
||||
{% endif %}
|
||||
{% if site.twitter_user %}
|
||||
<a class="twitter" href="http://twitter.com/{{ site.twitter_user }}" title="Twitter">Twitter</a>
|
||||
{% endif %}
|
||||
{% if site.github_user %}
|
||||
<a class="github" href="https://github.com/{{ site.github_user }}" title="GitHub">GitHub</a>
|
||||
{% endif %}
|
||||
{% if site.pinterest_user %}
|
||||
<a class="pinterest" href="https://pinterest.com/{{ site.pinterest_user }}" title="Pinterest">Pinterest</a>
|
||||
{% endif %}
|
||||
<a class="rss" href="{{ site.subscribe_rss }}" title="RSS">RSS</a>
|
||||
</div>
|
||||
{% include custom/footer.html %}
|
||||
<div class="clearfix"></div>
|
||||
{% include custom/footer.html %}
|
||||
@@ -1,13 +1,13 @@
|
||||
{% if site.google_analytics_tracking_id %}
|
||||
<script type="text/javascript">
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', '{{ site.google_analytics_tracking_id }}']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
<script type="text/javascript">
|
||||
var _gaq = _gaq || [];
|
||||
_gaq.push(['_setAccount', '{{ site.google_analytics_tracking_id }}']);
|
||||
_gaq.push(['_trackPageview']);
|
||||
|
||||
(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);
|
||||
})();
|
||||
</script>
|
||||
(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);
|
||||
})();
|
||||
</script>
|
||||
{% endif %}
|
||||
|
||||
@@ -2,19 +2,19 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>{% if page.title %}{{ page.title }} | {% endif %}{{ site.title }}</title>
|
||||
<title>{% if page.title %}{{ page.title }} - {% endif %}{{ site.title }}</title>
|
||||
<meta name="author" content="{{ site.author }}">
|
||||
|
||||
{% capture description %}{% if page.description %}{{ page.description }}{% else %}{{ content | raw_content }}{% endif %}{% endcapture %}
|
||||
<meta name="description" content="{{ description | strip_html | condense_spaces | truncate:150 }}">
|
||||
{% if page.keywords %}<meta name="keywords" content="{{ page.keywords }}">{% endif %}
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
|
||||
<link href="{{ site.subscribe_rss }}" rel="alternate" title="{{site.title}}" type="application/atom+xml">
|
||||
<link rel="canonical" href="{{ canonical }}">
|
||||
<link href="{{ root_url }}/favicon.png" rel="shortcut icon">
|
||||
<link href="{{ root_url }}/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css">
|
||||
<!--[if lt IE 9]><script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
|
||||
{% include google_analytics.html %}
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
|
||||
{% include custom/head.html %}
|
||||
</head>
|
||||
@@ -1,2 +1,56 @@
|
||||
<nav>{% include custom/navigation.html %}</nav>
|
||||
{% include custom/header.html %}
|
||||
<h1><a href="{{ root_url }}/">{{ site.title }}</a></h1>
|
||||
<nav id="main-nav">{% include navigation.html %}</nav>
|
||||
<nav id="mobile-nav">
|
||||
<div class="alignleft menu">
|
||||
<a class="button">Menu</a>
|
||||
<div class="container">{% include navigation.html %}</div>
|
||||
</div>
|
||||
<div class="alignright search">
|
||||
<a class="button"></a>
|
||||
<div class="container">
|
||||
<form action="{{ site.simple_search }}" method="get">
|
||||
<input type="text" name="q" results="0">
|
||||
<input type="hidden" name="q" value="site:{{ site.url | shorthand_url }}">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<nav id="sub-nav" class="alignright">
|
||||
<div class="social">
|
||||
{% if site.facebook_user %}
|
||||
<a class="facebook" href="http://www.facebook.com/{{ site.facebook_user }}" title="Facebook">Facebook</a>
|
||||
{% endif %}
|
||||
{% if site.googleplus_user and site.googleplus_hidden == false %}
|
||||
<a class="google" href="https://plus.google.com/{{ site.googleplus_user }}?rel=author" title="Google+">Google+</a>
|
||||
{% endif %}
|
||||
{% if site.twitter_user %}
|
||||
<a class="twitter" href="http://twitter.com/{{ site.twitter_user }}" title="Twitter">Twitter</a>
|
||||
{% endif %}
|
||||
{% if site.github_user %}
|
||||
<a class="github" href="https://github.com/{{ site.github_user }}" title="GitHub">GitHub</a>
|
||||
{% endif %}
|
||||
{% if site.pinboard_user %}
|
||||
<a class="pinboard" href="https://pinboard.in/u:{{ site.pinboard_user }}" title="Pinboard">Pinboard</a>
|
||||
{% endif %}
|
||||
{% if site.coderwall_user %}
|
||||
<a class="coderwall" href="https://coderwall.com/{{ site.coderwall_user }}" title="Coderwall">Coderwall</a>
|
||||
{% endif %}
|
||||
{% if site.linkedin_user %}
|
||||
<a class="linkedin" href="http://www.linkedin.com/in/{{ site.linkedin_user }}">LinkedIn</a>
|
||||
{% endif %}
|
||||
{% if site.pinterest_user %}
|
||||
<a class="pinterest" href="https://pinterest.com/{{ site.pinterest_user }}" title="Pinterest">Pinterest</a>
|
||||
{% endif %}
|
||||
{% if site.delicious_user %}
|
||||
<a class="delicious" href="http://delicious.com/{{ site.delicious_user }}" title="Delicious">Delicious</a>
|
||||
{% endif %}
|
||||
{% if site.subscribe_rss %}
|
||||
<a class="rss" href="{{ site.subscribe_rss }}" title="RSS">RSS</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
<form class="search" action="{{ site.simple_search }}" method="get">
|
||||
<input class="alignright" type="text" name="q" results="0">
|
||||
<input type="hidden" name="q" value="site:{{ site.url | shorthand_url }}">
|
||||
</form>
|
||||
</nav>
|
||||
{% include custom/header.html %}
|
||||
|
||||
@@ -1,15 +1 @@
|
||||
<ul class="subscription" data-subscription="rss{% if site.subscribe_email %} email{% endif %}">
|
||||
<li><a href="{{ site.subscribe_rss }}" rel="subscribe-rss" title="subscribe via RSS">RSS</a></li>
|
||||
{% if site.subscribe_email %}
|
||||
<li><a href="{{ site.subscribe_email }}" rel="subscribe-email" title="subscribe via email">Email</a></li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
{% if site.simple_search %}
|
||||
<form action="{{ site.simple_search }}" method="get">
|
||||
<fieldset role="search">
|
||||
<input type="hidden" name="q" value="site:{{ site.url | shorthand_url }}" />
|
||||
<input class="search" type="text" name="q" results="0" placeholder="Search"/>
|
||||
</fieldset>
|
||||
</form>
|
||||
{% endif %}
|
||||
{% include custom/navigation.html %}
|
||||
{% include custom/navigation.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' %}
|
||||
<div class="tags">{{ category }}</div>
|
||||
{% endunless %}
|
||||
{% 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 %}
|
||||
|
||||
@@ -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 %}<time datetime="{{ date | datetime | date_to_xmlschema }}" pubdate{% if updated %} data-updated="true"{% endif %}>{{ date_formatted }}</time>{% endcapture %}
|
||||
{% endif %}
|
||||
|
||||
{% if was_updated != '0' %}
|
||||
<time datetime="{{ updated | datetime | date_to_xmlschema }}" pubdate="{{ date | datetime | date_to_xmlschema }}">
|
||||
<span class="day">{{ updated_formatted | date: "%e" }}</span><span class="month">{{ updated_formatted | date: "%b" }}</span>
|
||||
</time>
|
||||
{% else %}
|
||||
{% if has_date != '0' %}
|
||||
<time datetime="{{ date | datetime | date_to_xmlschema }}">
|
||||
<span class="day">{{ date_formatted | date: "%e" }}</span><span class="month">{{ date_formatted | date: "%b" }}</span>
|
||||
</time>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% capture updated %}<time datetime="{{ updated | datetime | date_to_xmlschema }}" class="updated">Updated {{ updated_formatted }}</time>{% endcapture %}
|
||||
{% else %}{% assign updated = false %}{% endif %}
|
||||
@@ -1,4 +1,4 @@
|
||||
<div class="sharing">
|
||||
<div class="share">
|
||||
<div class="addthis_toolbox addthis_default_style ">
|
||||
{% if site.facebook_like %}
|
||||
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
|
||||
@@ -11,5 +11,5 @@
|
||||
{% endif %}
|
||||
<a class="addthis_counter addthis_pill_style"></a>
|
||||
</div>
|
||||
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4daee9911f9dfcb4"></script>
|
||||
</div>
|
||||
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid={{ site.addthis_profile_id }}"></script>
|
||||
</div>
|
||||
|
||||
@@ -2,14 +2,6 @@
|
||||
layout: default
|
||||
---
|
||||
|
||||
<header id="archive-header">
|
||||
<h1 class="alignleft">{{ page.title }}</h1>
|
||||
<form action="{{ site.simple_search }}" class="search alignright" method="get">
|
||||
<input type="text" name="q" results="0" placeholder="Search">
|
||||
<input type="hidden" name="q" value="site:{{ site.url | shorthand_url }}">
|
||||
</form>
|
||||
</header>
|
||||
|
||||
{% for post in site.categories[page.category] %}
|
||||
{% include archive_post.html %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
@@ -3,6 +3,9 @@
|
||||
|
||||
<body>
|
||||
<header id="header" class="inner">{% include header.html %}</header>
|
||||
{% unless page.banner == false %}
|
||||
{% include banner.html %}
|
||||
{% endunless %}
|
||||
<div id="content" class="inner">{{ content | expand_urls: root_url }}</div>
|
||||
<footer id="footer" class="inner">{% include footer.html %}</footer>
|
||||
{% include after_footer.html %}
|
||||
|
||||
@@ -2,4 +2,18 @@
|
||||
layout: default
|
||||
---
|
||||
|
||||
<article class="page">{% include article.html %}</article>
|
||||
<article class="page">
|
||||
{% if page.title %}
|
||||
<h1 class="title">{% if site.titlecase %}{{ page.title | titlecase }}{% else %}{{ page.title }}{% endif %}</h1>
|
||||
{% endif %}
|
||||
<div class="entry-content">{{ content }}</div>
|
||||
</article>
|
||||
{% unless page.sharing == false %}
|
||||
{% include post/sharing.html %}
|
||||
{% endunless %}
|
||||
{% if site.disqus_short_name and page.comments == true %}
|
||||
<section id="comment">
|
||||
<h1 class="title">Comments</h1>
|
||||
<div id="disqus_thread" aria-live="polite">{% include post/disqus_thread.html %}</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
|
||||
@@ -3,4 +3,13 @@ layout: default
|
||||
single: true
|
||||
---
|
||||
|
||||
<article class="post">{% include article.html %}</article>
|
||||
<article class="post">{% include article.html %}</article>
|
||||
{% unless page.sharing == false %}
|
||||
{% include post/sharing.html %}
|
||||
{% endunless %}
|
||||
{% if site.disqus_short_name and page.comments == true %}
|
||||
<section id="comment">
|
||||
<h2 class="title">Comments</h2>
|
||||
<div id="disqus_thread" aria-live="polite">{% include post/disqus_thread.html %}</div>
|
||||
</section>
|
||||
{% endif %}
|
||||
@@ -1,16 +1,8 @@
|
||||
---
|
||||
layout: default
|
||||
title: Archives
|
||||
title: Blog Archives
|
||||
---
|
||||
|
||||
<header id="archive-header">
|
||||
<h1 class="alignleft">Archives</h1>
|
||||
<form action="{{ site.simple_search }}" class="search alignright" method="get">
|
||||
<input type="text" name="q" results="0" placeholder="Search">
|
||||
<input type="hidden" name="q" value="site:{{ site.url | shorthand_url }}">
|
||||
</form>
|
||||
</header>
|
||||
|
||||
{% for post in site.posts reverse %}
|
||||
{% include archive_post.html %}
|
||||
{% endfor %}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 8.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 445 B |
+10
-2
@@ -5,6 +5,14 @@ layout: default
|
||||
{% assign index = true %}
|
||||
{% for post in paginator.posts %}
|
||||
{% assign content = post.content %}
|
||||
<article class="post">{% include article.html %}</article>
|
||||
<article class="post">{% include article.html %}</article>
|
||||
{% endfor %}
|
||||
{% include pagination.html %}
|
||||
<nav id="pagenavi">
|
||||
{% if paginator.previous_page %}
|
||||
<a href="{{paginator.previous_page}}" class="prev">Prev</a>
|
||||
{% endif %}
|
||||
{% if paginator.next_page %}
|
||||
<a href="{{paginator.next_page}}" class="next">Next</a>
|
||||
{% endif %}
|
||||
<div class="center"><a href="{{ root_url }}/blog/archives">Blog Archives</a></div>
|
||||
</nav>
|
||||
@@ -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('<span class="caption">'+alt+'</span>');
|
||||
}
|
||||
|
||||
$(this).wrap('<a href="'+this.src+'" title="'+alt+'" class="fancybox" rel="gallery'+_i+'" />');
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
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);
|
||||
@@ -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 "<span>∞</span>"; // 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, '<a href="$1$2">$2</a>').replace(/(^|\W)@(\w+)/g, '$1<a href="http://twitter.com/$2">@$2</a>').replace(/(^|\W)#(\w+)/g, '$1<a href="http://search.twitter.com/search?q=%23$2">#$2</a>');
|
||||
|
||||
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 "<span>∞</span>"; }
|
||||
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, '<a href="$1$2">$2</a>')
|
||||
.replace(/(^|\W)@(\w+)/g, '$1<a href="https://twitter.com/$2">@$2</a>')
|
||||
.replace(/(^|\W)#(\w+)/g, '$1<a href="https://search.twitter.com/search?q=%23$2">#$2</a>');
|
||||
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<length; i++){
|
||||
var item = document.createElement('li');
|
||||
item.innerHTML = linkify(json[i].text) + '<small>'+relativeDate(json[i].created_at)+'</small>';
|
||||
fragment.appendChild(item);
|
||||
}
|
||||
|
||||
for (var t in tweets) {
|
||||
content += '<li>'+'<p>'+'<a href="https://twitter.com/'+twitter_user+'/status/'+tweets[t].id_str+'">'+prettyDate(tweets[t].created_at)+'</a>'+linkifyTweet(tweets[t].text.replace(/\n/g, '<br>'), tweets[t].entities.urls)+'</p>'+'</li>';
|
||||
}
|
||||
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);
|
||||
Reference in New Issue
Block a user