aboutsummaryrefslogtreecommitdiff
path: root/themes/classic/sass/partials
diff options
context:
space:
mode:
Diffstat (limited to 'themes/classic/sass/partials')
-rw-r--r--themes/classic/sass/partials/_blog.scss164
-rw-r--r--themes/classic/sass/partials/_delicious.scss4
-rw-r--r--themes/classic/sass/partials/_footer.scss2
-rw-r--r--themes/classic/sass/partials/_header.scss2
-rw-r--r--themes/classic/sass/partials/_navigation.scss9
-rw-r--r--themes/classic/sass/partials/_page.scss6
-rw-r--r--themes/classic/sass/partials/_pinboard.scss12
-rw-r--r--themes/classic/sass/partials/_sidebar.scss63
-rw-r--r--themes/classic/sass/partials/_solarized.scss16
-rw-r--r--themes/classic/sass/partials/_syntax.scss13
-rw-r--r--themes/classic/sass/partials/_twitter.scss33
11 files changed, 100 insertions, 224 deletions
diff --git a/themes/classic/sass/partials/_blog.scss b/themes/classic/sass/partials/_blog.scss
index 12f596a1..0cf11ae8 100644
--- a/themes/classic/sass/partials/_blog.scss
+++ b/themes/classic/sass/partials/_blog.scss
@@ -1,111 +1,107 @@
-$border: inline-image('dotted-border.png');
#articles {
overflow: hidden;
- @media only screen and (max-width: 768px) {
- ul, ol { margin-left: 1.4em; }
+ ul, ol { margin-left: 1.4em; }
+ @media only screen and (min-width: 768px) {
+ ul, ol { margin-left: 0; }
}
> article {
padding-bottom: 1em;
- &:last-child { margin-bottom: 0; border-bottom: none; }
+ &:last-child { margin-bottom: 0; }
h2 {
padding-top: 0.8em;
- background: $border top left repeat-x;
- &:first-child {
- background: none;
- padding-top: 0;
- }
+ background: $img-border top left repeat-x;
+ &:first-child { background: none; padding-top: 0; }
}
- .byline + time:before, time +time:before, .comments:before {
+ .byline + time:before, time +time:before, .comments:before, .byline ~ .categories:before {
@extend .separator;
}
- header {
- position: relative;
- padding-top: 2em;
- margin-bottom: 1.5em;
- padding-bottom: 1em;
- background: $border bottom left repeat-x;
- h1 {
- margin: 0;
- a { text-decoration: none;
- &:hover { text-decoration: underline; } }
- }
- p {
- font-size: .9em;
- color: $text-color-light;
- margin: 0;
- @extend .sans;
- &.meta {
- text-transform: uppercase;
- position: absolute;
- top: 0;
- }
- }
- @media only screen and (max-width: 768px) {
- padding-bottom: 1em;
- margin-bottom: 1em;
- background: $border bottom left repeat-x;
- p.meta { position: static; }
+ }
+ header {
+ position: relative;
+ padding-top: 2em;
+ padding-bottom: 1em;
+ margin-bottom: 1em;
+ background: $img-border bottom left repeat-x;
+ h1 {
+ margin: 0;
+ a { text-decoration: none;
+ &:hover { text-decoration: underline; } }
+ }
+ p {
+ font-size: .9em;
+ color: $text-color-light;
+ margin: 0;
+ @extend .sans;
+ &.meta {
+ text-transform: uppercase;
}
}
- h1.feature {
- padding-top: .5em;
- margin-bottom: 1em;
+ @media only screen and (min-width: 768px) {
+ margin-bottom: 1.5em;
padding-bottom: 1em;
- background: $border bottom left repeat-x;
- font-size: 2.0em; font-style: italic;
- line-height: 1.3em;
+ background: $img-border bottom left repeat-x;
+ p.meta { position: absolute; top: 0; }
}
- .entry-content {
- img, video { max-width: 100%; height: auto; }
- video {
- width: 100%; display: block; margin-bottom: 1.5em;
- padding: .8em; background: #fff; border: 1px solid #eee;
- @include box-sizing(border-box);
- }
- .flash-video {
- max-width: 100%;
- margin-bottom: 1.5em;
- @include box-sizing(border-box);
- padding: .8em; background: #fff; border: 1px solid #eee;
- > div {
- position: relative;
- display: block;
- padding-bottom: 56.25%;
- padding-top: 1px;
- height: 0;
- overflow: hidden;
- iframe, object, embed {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- }
- }
- }
+ }
+ h1.feature {
+ padding-top: .5em;
+ margin-bottom: 1em;
+ padding-bottom: 1em;
+ background: $img-border bottom left repeat-x;
+ font-size: 2.0em; font-style: italic;
+ line-height: 1.3em;
+ }
+ .entry-content {
+ img, video { max-width: 100%; height: auto; }
+ video {
+ width: 100%; display: block; margin-bottom: 1.5em;
+ padding: .8em; background: #fff; border: 1px solid #eee;
+ @include box-sizing(border-box);
}
- iframe.twitter-share-button {
+ }
+ .flash-video {
+ max-width: 100%;
+ margin-bottom: 1.5em;
+ @include box-sizing(border-box);
+ padding: .8em; background: #fff; border: 1px solid #eee;
+ > div {
position: relative;
- top: .3em;
- padding-left: .5em;
- }
- > footer {
- margin-top: 2em;
- padding-top: 1em;
- margin-bottom: 1.5em;
- background: $border top left repeat-x;
- time, .author { color: $text-color-light; @extend .sans; }
+ display: block;
+ padding-bottom: 56.25%;
+ padding-top: 1px;
+ height: 0;
+ overflow: hidden;
+ iframe, object, embed {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ }
}
}
+ iframe.twitter-share-button {
+ position: relative;
+ top: .3em;
+ padding-left: .5em;
+ }
+ > article > footer {
+ margin-top: 2em;
+ padding-top: 1em;
+ margin-bottom: 1.5em;
+ background: $img-border top left repeat-x;
+ @extend .sans;
+ }
+
}
article + article {
- background: $border top left repeat-x;
+ background: $img-border top left repeat-x;
}
#articles.blog-index {
article header { background: none; padding-bottom: 0; }
article h1 {
font-size: 2.2em;
- a { color: inherit; &:hover{ color: $link-color-hover; } }
+ a { color: inherit; &:hover { color: $link-color-hover; } }
}
a[rel=full-article] {
background: darken($main-bg, 5);
@@ -125,8 +121,6 @@ article + article {
footer {
@extend .sans;
margin-top: 1em;
- p.meta { color: $text-color-light; }
- a { color: inherit; &:hover{ color: $link-color-hover;} }
}
}
diff --git a/themes/classic/sass/partials/_delicious.scss b/themes/classic/sass/partials/_delicious.scss
deleted file mode 100644
index e962702e..00000000
--- a/themes/classic/sass/partials/_delicious.scss
+++ /dev/null
@@ -1,4 +0,0 @@
-.delicious-posts {
- a.delicious-link { margin-bottom: .5em; display: block; }
- p { font-size: 1em; }
-}
diff --git a/themes/classic/sass/partials/_footer.scss b/themes/classic/sass/partials/_footer.scss
index 019bc2a4..350c562d 100644
--- a/themes/classic/sass/partials/_footer.scss
+++ b/themes/classic/sass/partials/_footer.scss
@@ -4,7 +4,7 @@ body > footer {
color: $footer-color;
text-shadow: lighten($footer-bg, 5) 0 1px;
background-color: $footer-bg;
- @include background(linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11)));
+ @include background(image-url('noise.png'), linear-gradient(lighten($footer-bg, 8), $footer-bg, darken($footer-bg, 11)));
border-top: 1px solid $footer-border-top;
position: relative;
padding-top: 1em;
diff --git a/themes/classic/sass/partials/_header.scss b/themes/classic/sass/partials/_header.scss
index 9cc4601f..8ae128b1 100644
--- a/themes/classic/sass/partials/_header.scss
+++ b/themes/classic/sass/partials/_header.scss
@@ -1,5 +1,5 @@
body > header {
- background-color: $header-bg;
+ background: $header-bg;
h1 {
display: inline-block;
margin: 0;
diff --git a/themes/classic/sass/partials/_navigation.scss b/themes/classic/sass/partials/_navigation.scss
index 2fa17a1a..be132561 100644
--- a/themes/classic/sass/partials/_navigation.scss
+++ b/themes/classic/sass/partials/_navigation.scss
@@ -1,13 +1,12 @@
body > nav {
position: relative;
background-color: $nav-bg;
- @include background(linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11)));
+ @include background(image-url('noise.png'), linear-gradient(lighten($nav-bg, 8), $nav-bg, darken($nav-bg, 11)));
border: {
top: 1px solid $nav-border-top;
bottom: 1px solid $nav-border-bottom; }
padding-top: .35em;
padding-bottom: .35em;
- //position: absolute; left: 0; right: 0; top: 0;
form {
@include background-clip(padding-box);
margin: 0; padding: 0;
@@ -43,7 +42,7 @@ body > nav {
@include horizontal-list(0);
float: left;
display: block;
- padding-top: .25em;
+ padding-top: .15em;
}
ul[role=subscription] {
margin-left: .8em;
@@ -59,7 +58,7 @@ body > nav {
text-shadow: lighten($nav-bg, 12) 0 1px;
float: left;
text-decoration: none;
- font-size: 1em;
+ font-size: 1.1em;
padding: .1em 0;
line-height: 1.5em;
}
@@ -132,7 +131,7 @@ body > nav {
}
}
}
- ul[role=subscription] { li, a { border: 0; padding: 0; }}
+ ul[role=subscription] { position: relative; top: .2em; li, a { border: 0; padding: 0; }}
a[rel=subscribe-rss]{ @include mask-subscription-nav('rss.png'); }
a[rel=subscribe-email]{ @include mask-subscription-nav('email.png'); }
}
diff --git a/themes/classic/sass/partials/_page.scss b/themes/classic/sass/partials/_page.scss
index 99a07ebc..d8ff5449 100644
--- a/themes/classic/sass/partials/_page.scss
+++ b/themes/classic/sass/partials/_page.scss
@@ -1,12 +1,12 @@
html {
- background: $page-bg inline-image('line-tile.png') top left;
+ background: $page-bg image-url('line-tile.png') top left;
}
body {
> div {
- background-color: $sidebar-bg;
+ background: $sidebar-bg image-url('noise.png') top left;
border-bottom: 1px solid $page-border-bottom;
> div {
- background-color: $main-bg;
+ background: $main-bg image-url('noise.png') top left;
border-right: 1px solid $sidebar-border;
}
}
diff --git a/themes/classic/sass/partials/_pinboard.scss b/themes/classic/sass/partials/_pinboard.scss
deleted file mode 100644
index 9f9ab461..00000000
--- a/themes/classic/sass/partials/_pinboard.scss
+++ /dev/null
@@ -1,12 +0,0 @@
-#pinboard_linkroll {
- .pin-title, .pin-description {
- display: block;
- margin-bottom: .5em;
- }
- .pin-tag {
- @include hover-link;
- @extend .aside-alt-link;
- &:after { content: ','; }
- &:last-child:after { content: ''; }
- }
-}
diff --git a/themes/classic/sass/partials/_sidebar.scss b/themes/classic/sass/partials/_sidebar.scss
index 8c38e2a6..ac790e04 100644
--- a/themes/classic/sass/partials/_sidebar.scss
+++ b/themes/classic/sass/partials/_sidebar.scss
@@ -1,59 +1,4 @@
-.side-shadow-border {
- @include box-shadow(lighten($sidebar-bg, 5) 0 1px);
-}
-#articles + aside {
- color: $sidebar-color;
- padding-top: 1.2em;
- text-shadow: lighten($sidebar-bg, 8) 0 1px;
- section {
- @extend .sans;
- font-size: .8em;
- line-height: 1.4em;
- margin-bottom: 1.5em;
- h1 {
- margin: 1.5em 0 0;
- padding-bottom: .2em;
- border-bottom: 1px solid $sidebar-border;
- @extend .side-shadow-border;
- + p {
- padding-top: .4em;
- }
- }
- }
- ul {
- margin-bottom: 0.5em;
- }
- li {
- list-style: none;
- padding: .5em 0;
- margin: 0;
- border-bottom: 1px solid $sidebar-border;
- @extend .side-shadow-border;
- p:last-child {
- margin-bottom: 0;
- }
- }
- a {
- color: inherit;
- @include transition(color, .5s);
- }
- &:hover a, &:hover #tweets a { color: $sidebar-link-color;
- &:hover { color: $sidebar-link-color-hover; }
- }
- #recent_posts {
- time {
- text-transform: uppercase;
- font-size: .9em;
- color: #666;
- }
- }
- @import "twitter";
- @import "pinboard";
- @import "delicious";
-}
-.aside-alt-link {
- color: $sidebar-link-color-subdued;
- &:hover {
- color: $sidebar-link-color-subdued-hover;
- }
-}
+@import "sidebar/base";
+@import "sidebar/twitter";
+@import "sidebar/pinboard";
+@import "sidebar/delicious";
diff --git a/themes/classic/sass/partials/_solarized.scss b/themes/classic/sass/partials/_solarized.scss
deleted file mode 100644
index 4952120d..00000000
--- a/themes/classic/sass/partials/_solarized.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-$base03: #002b36; //darkest blue
-$base02: #073642; //dark blue
-$base01: #586e75; //darkest gray
-$base00: #657b83; //dark gray
-$base0: #839496; //medium gray
-$base1: #93a1a1; //medium light gray
-$base2: #eee8d5; //cream
-$base3: #fdf6e3; //white
-$yellow: #b58900;
-$orange: #cb4b16;
-$red: #dc322f;
-$magenta: #d33682;
-$violet: #6c71c4;
-$blue: #268bd2;
-$cyan: #2aa198;
-$green: #859900;
diff --git a/themes/classic/sass/partials/_syntax.scss b/themes/classic/sass/partials/_syntax.scss
index dc6472f2..b14b23bd 100644
--- a/themes/classic/sass/partials/_syntax.scss
+++ b/themes/classic/sass/partials/_syntax.scss
@@ -1,14 +1,16 @@
+$pre-bg: image-url('noise.png') top left;
.highlight, html .gist .gist-file .gist-syntax .gist-highlight {
.line-numbers {
text-align: right;
font-size: .8em;
line-height: 1.45em;
- background: $base02 !important;
+ background: $base02 $pre-bg !important;
border-right: 1px solid darken($base03, 2) !important;
@include box-shadow(lighten($base02, 2) -1px 0 inset);
text-shadow: darken($base02, 10) 0 -1px;
span { color: $base01 !important; }
padding: .8em !important;
+ @include border-radius(0);
}
}
html .gist .gist-file {
@@ -30,7 +32,7 @@ html .gist .gist-file {
border: 1px solid lighten($base02, 2) !important;
color: $base01;
font-size: .7em !important;
- background: $base02;
+ background: $base02 $pre-bg;
@extend .sans;
line-height: 1.5em;
a {
@@ -51,14 +53,15 @@ html .gist .gist-file {
}
}
pre {
- background: #333;
+ background: $base03 $pre-bg;
@include border-radius(.4em);
@extend .mono;
+ border: 1px solid $base02;
line-height: 1.45em;
font-size: .8em;
margin-bottom: 1.5em;
padding: .8em 1em;
- color: #ccc;
+ color: $base1;
overflow: auto;
}
h3.filename {
@@ -88,7 +91,7 @@ p code {
padding: .8em !important;
overflow-x: auto;
line-height: 1.45em;
- background: $base03 !important;
+ background: $base03 $pre-bg !important;
color: $base1 !important;
span { color: $base1 !important; }
span { font-style: normal !important; font-weight: normal !important; }
diff --git a/themes/classic/sass/partials/_twitter.scss b/themes/classic/sass/partials/_twitter.scss
deleted file mode 100644
index 36c6f62b..00000000
--- a/themes/classic/sass/partials/_twitter.scss
+++ /dev/null
@@ -1,33 +0,0 @@
-#tweets {
- .loading {
- background: inline-image('bird_32_gray.png') no-repeat center .5em;
- color: darken($sidebar-bg, 18);
- text-shadow: $main-bg 0 1px;
- text-align: center;
- padding: 2.5em 0 .5em;
- &.error {
- background: inline-image('bird_32_gray_fail.png') no-repeat center .5em;
- }
- }
- a { color: $sidebar-link-color-subdued; @include hover-link; }
- p {
- position: relative;
- padding-right: 1em;
- }
- a[href*=status]{
- color: $twitter-status-link;
- float: right;
- padding: 0 0 .1em 1em;
- position: relative; right: -1.3em;
- text-shadow: #fff 0 1px;
- font-size: .7em;
- span { font-size: 1.5em; }
- &:hover {
- color: $sidebar-link-color-subdued-hover;
- text-decoration: none;
- }
- }
- a[href*='twitter.com/search']{
- @extend .aside-alt-link;
- }
-}