varun-r-mallya/wona.github.com
1
0
Fork 0
mirror of https://github.com/WatchOutNewsAgency/wona.github.com.git synced 2026-01-01 01:16:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

1. Added Category support

Browse Source 
2. Designed blog archives pages
3. Restructured Sass
4. Added Categories to rake post metadata
5. Some general style improvements
This commit is contained in:
Brandon Mathis
2011-06-27 15:59:21 -04:00
parent ef3ff431e5
commit 353ccfd4eb
27 changed files with 154 additions and 713 deletions
Download Patch File Download Diff File Expand all files Collapse all files

172
themes/classic/sass/partials/_blog.scss
View File

@ -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;
}
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;
}
}
@media only screen and (min-width: 768px) {
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; }
}
}
h1.feature {
padding-top: .5em;
margin-bottom: 1em;
padding-bottom: 1em;
background: $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);
}
.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%;
}
}
}
}
iframe.twitter-share-button {
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; }
background: $img-border bottom left repeat-x;
p.meta { position: absolute; top: 0; }
}
}
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);
}
}
.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%;
}
}
}
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;} }
}
}

4
themes/classic/sass/partials/_delicious.scss
View File

@ -1,4 +0,0 @@
.delicious-posts {
a.delicious-link { margin-bottom: .5em; display: block; }
p { font-size: 1em; }
}

2
themes/classic/sass/partials/_footer.scss
View File

@ -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;

2
themes/classic/sass/partials/_header.scss
View File

@ -1,5 +1,5 @@
body > header {
background-color: $header-bg;
background: $header-bg;
h1 {
display: inline-block;
margin: 0;

9
themes/classic/sass/partials/_navigation.scss
View File

@ -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'); }
}

6
themes/classic/sass/partials/_page.scss
View File

@ -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;
}
}

12
themes/classic/sass/partials/_pinboard.scss
View File

@ -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: ''; }
}
}

63
themes/classic/sass/partials/_sidebar.scss
View File

@ -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";

16
themes/classic/sass/partials/_solarized.scss
View File

@ -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;

13
themes/classic/sass/partials/_syntax.scss
View File

@ -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; }

33
themes/classic/sass/partials/_twitter.scss
View File

@ -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;
}
}