Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Merge branch 'develop'

  • Loading branch information...
commit e978dff2aeefcb2635b8449c5611142125956d99 2 parents 6c2e8ae + da58913
@founddrama authored
View
2  404.php
@@ -9,7 +9,7 @@
get_header(); ?>
- <h1><?php _e( 'Not Found', 'starkers' ); ?></h1>
+ <h2><?php _e( 'Not Found', 'starkers' ); ?></h2>
<p><?php _e( 'Apologies, but the page you requested could not be found. Perhaps searching will help.', 'starkers' ); ?></p>
<?php get_search_form(); ?>
View
26 README.md
@@ -15,16 +15,20 @@ too and choose fork it for your own experiments.
**Author URI:** <http://blog.founddrama.net/>
-**Version:** 0.5
+**Version:** 0.6
## Notes
-* CSS is developed and managed using [Sass](http://sass-lang.com/); the author
- recommends that you work it into your deploy script.
-
-## @todo
-* The site references minified versions of certain resources (_e.g._, `css` and
- `js` files); the author recommends a build script to handle creating these
- minified files and putting them in the right place
- * A sample deploy script is included at `./bin/deploy.sh`
- * see also : <http://developer.yahoo.com/yui/compressor/> and/or
- <https://github.com/yui/yuicompressor>
+
+CSS is developed and managed using [Sass](http://sass-lang.com/) and
+[Compass](http://compass-style.org/); the author recommends that you work it
+into your deploy script.
+
+## Your Homework
+
+The site references minified versions of certain resources (_e.g._, `css` and
+`js` files); the author recommends a build script to handle creating these
+minified files and putting them in the right place
+
+* A sample deploy script is included at `./bin/deploy.sh`
+* see also : <http://developer.yahoo.com/yui/compressor/> and/or
+ <https://github.com/yui/yuicompressor>
View
0  _LICENSE.txt → STARKERS_LICENSE.txt
File renamed without changes
View
4 archive.php
@@ -14,7 +14,7 @@
the_post();
?>
- <h1>
+ <h2>
<?php if ( is_day() ) : ?>
<?php printf( __( 'Daily Archives: %s', 'starkers' ), get_the_date() ); ?>
<?php elseif ( is_month() ) : ?>
@@ -24,7 +24,7 @@
<?php else : ?>
<?php _e( 'Blog Archives', 'starkers' ); ?>
<?php endif; ?>
- </h1>
+ </h2>
<?php
rewind_posts();
View
4 author.php
@@ -14,13 +14,13 @@
the_post();
?>
- <h1><?php printf( __( 'Author Archives: %s', 'starkers' ), "<a href='" . get_author_posts_url( get_the_author_meta( 'ID' ) ) . "' title='" . esc_attr( get_the_author() ) . "' rel='me'>" . get_the_author() . "</a>" ); ?></h1>
+ <h2><?php printf( __( 'Author Archives: %s', 'starkers' ), "<a href='" . get_author_posts_url( get_the_author_meta( 'ID' ) ) . "' title='" . esc_attr( get_the_author() ) . "' rel='me'>" . get_the_author() . "</a>" ); ?></h2>
<?php
// If a user has filled out their description, show a bio on their entries.
if ( get_the_author_meta( 'description' ) ) : ?>
<?php echo get_avatar( get_the_author_meta( 'user_email' ), apply_filters( 'starkers_author_bio_avatar_size', 60 ) ); ?>
- <h2><?php printf( __( 'About %s', 'starkers' ), get_the_author() ); ?></h2>
+ <h3><?php printf( __( 'About %s', 'starkers' ), get_the_author() ); ?></h3>
<?php the_author_meta( 'description' ); ?>
<?php endif; ?>
View
4 category.php
@@ -9,9 +9,9 @@
get_header(); ?>
- <h1><?php
+ <h2><?php
printf( __( 'Category Archives: %s', 'starkers' ), '' . single_cat_title( '', false ) . '' );
- ?></h1>
+ ?></h2>
<?php
$category_description = category_description();
if ( ! empty( $category_description ) )
View
2  comments.php
@@ -26,7 +26,7 @@
<?php if ( have_comments() ) : ?>
<?php /* STARKERS NOTE: The following h3 id is left intact so that comments can be referenced on the page */ ?>
- <h3 id="comments-title"><?php
+ <h3 id="comments-title" class="comments-title"><?php
printf( _n( 'One Response to %2$s', '%1$s Responses to %2$s', get_comments_number(), 'starkers' ),
number_format_i18n( get_comments_number() ), '' . get_the_title() . '' );
?></h3>
View
8 footer.php
@@ -7,16 +7,16 @@
* @since 0.1a
*/
?>
- </section><?php /* / #orin-chronology */ ?>
+ </section><?php /* / .orin-chronology */ ?>
<?php
if ( ! is_404() ) {
get_sidebar();
}
?>
- </section><?php /* / #orin-container */ ?>
- </div><?php /* / #orin-ct-wrap */ ?>
+ </section><?php /* / .orin-container */ ?>
+ </div><?php /* / .orin-ct-wrap */ ?>
- <footer id="orin-footer">
+ <footer class="orin-footer">
<section>
<?php get_sidebar( 'footer' ); ?>
View
12 header.php
@@ -45,21 +45,21 @@
<body <?php body_class(); ?>>
- <header id="masthead">
+ <header class="masthead">
<hgroup>
<h1><a href="<?php echo home_url( '/' ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
- <h2><?php bloginfo( 'description' ); ?></h2>
+ <div class="desc"><?php bloginfo( 'description' ); ?></div>
</hgroup>
<?php /* Our navigation menu. If one isn't filled out, wp_nav_menu falls back to the 'starkers_menu' function which can be found in functions.php. The menu assiged to the primary position is the one used. If none is assigned, the menu with the lowest ID is used. */ ?>
<?php wp_nav_menu( array( 'container' => 'nav', 'fallback_cb' => 'starkers_menu', 'theme_location' => 'primary' ) ); ?>
<?php if ( is_active_sidebar( 'masthead-widget-area' ) ) : ?>
- <section id="masthead-widgets">
+ <section class="masthead-widgets">
<?php dynamic_sidebar( 'masthead-widget-area' ); ?>
</section>
<?php endif; ?>
</header>
- <div id="orin-ct-wrap">
- <section id="orin-container">
- <section id="orin-chronology">
+ <div class="orin-ct-wrap">
+ <section class="orin-container">
+ <section class="orin-chronology">
View
2  loop.php
@@ -10,7 +10,7 @@
<?php /* If there are no posts to display, such as an empty archive page */ ?>
<?php if ( ! have_posts() ) : ?>
- <h1><?php _e( 'Not Found', 'starkers' ); ?></h1>
+ <h2><?php _e( 'Not Found', 'starkers' ); ?></h2>
<p><?php _e( 'Apologies, but no results were found for the requested archive. Perhaps searching will help find a related post.', 'starkers' ); ?></p>
<?php get_search_form(); ?>
<?php endif; ?>
View
2  onecolumn-page.php
@@ -14,7 +14,7 @@
<article <?php post_class() ?> id="post-<?php the_ID(); ?>">
<header>
- <h1><?php the_title(); ?></h1>
+ <h2><?php the_title(); ?></h2>
</header>
<?php the_content(); ?>
View
6 page.php
@@ -15,11 +15,7 @@
<article <?php post_class() ?> id="post-<?php the_ID(); ?>">
<header>
- <?php if ( is_front_page() ) { ?>
- <h2><?php the_title(); ?></h2>
- <?php } else { ?>
- <h1><?php the_title(); ?></h1>
- <?php } ?>
+ <h2><?php the_title(); ?></h2>
</header>
<?php the_content(); ?>
View
2  search.php
@@ -10,7 +10,7 @@
get_header(); ?>
<?php if ( have_posts() ) : ?>
- <h1><?php printf( __( 'Search Results for: %s', 'starkers' ), '' . get_search_query() . '' ); ?></h1>
+ <h2><?php printf( __( 'Search Results for: %s', 'starkers' ), '' . get_search_query() . '' ); ?></h2>
<?php
get_template_part( 'loop', 'search' );
?>
View
2  single.php
@@ -15,7 +15,7 @@
<article <?php post_class() ?> id="post-<?php the_ID(); ?>">
<header>
- <h1><?php the_title(); ?></h1>
+ <h2><?php the_title(); ?></h2>
<?php orin_posted_on(); ?>
<?php orin_edit_post_link(); ?>
View
180 src/scss/_articles.scss
@@ -1,122 +1,74 @@
article {
- // h#{n} headings:
- $_em: 1em; $i: 6;
- @while $i > 0 {
- $_em: $_em + 0.125em; $i: $i - 1;
- h#{$i} { line-height: $_em * 0.75; }
- }
-
-
- @include border-radius(8px);
-
- header, footer { width: 100%; }
-
- header {
- margin-bottom: 2em;
- h1, h2 {
- @include text-shadow($f_d-grey 1px 0 1px);
- }
- }
-
- // $_font-size @ _typography
- p, ol, ul { margin-bottom: $_font-size * 1.5; }
-
- a img:hover {
- @include article-shadow(4px, lighten($f_d-dark, 25%));
- @include rotate(-1deg);
- @include transition(all 0.5s ease-out);
- }
-
- img {
- background: white;
- border: 1px solid $f_d-grey;
- padding: 4px;
- @include article-shadow(2px, lighten($f_d-dark, 50%));
- @include transition(all 0.5s ease-out);
- }
-
- blockquote {
- color: white;
- padding: 1em;
- margin: 2em;
- border: 0.25em solid white;
- @include article-shadow(4px, $f_d-grey);
- @include basic-linear-grader(darken($f_d-color, 10%), $f_d-dark, 92%);
- blockquote {
- @include article-shadow(4px, $f_d-dark);
- }
-
- a { color: $f_d-grey; }
- .wp-caption { color: $f_d-dark; }
-
- p:last-child { margin-bottom: 0; }
- }
-
- q {
- font-style: italic;
- color: $f_d-dark;
- }
-
- ol, ul {
- list-style-position: outside;
- margin-left: 1.5em;
- }
-
- footer {
- clear: both;
- padding: $_48th / 2 2px;
- background: white;
- }
-
- footer, nav {
- margin-bottom: $_48th;
- }
-
- #comments-title,
- .comment { clear: both; }
-
- #comments-title {
- margin: {
- top: $_24th;
- bottom: $_48th
- }
- }
-
- .comment {
- padding: 0 1em;
-
- &:nth-child(odd) { @include basic-linear-grader(white, lighten($f_d-desat, 50%), 92%); }
-
- a.permalink { float: right; }
- }
- .avatar {
- background: white;
- float: left;
- margin: {
- left: -1em;
- right: 0.5em;
- }
- }
-
- #reply-title { padding-top: $_24th; }
-
- #commentform {
- input,
- textarea { display: block; }
-
- .required { color: $f_d-color; }
- }
+ @include border-radius(8px);
+
+ header { margin-bottom: 2em; }
+
+ // $_font-size @ _typography
+ p, ol, ul { margin-bottom: $_font-size * 1.5; }
+
+ a img:hover {
+ @include box-shadow(lighten($f_d-dark, 25%) 0 4px 4px);
+ @include rotate(-1deg);
+ -ms-transition: all 0.5s ease-out;
+ @include transition(all 0.5s ease-out);
+ }
+
+ img {
+ background: white;
+ border: 1px solid $f_d-grey;
+ padding: 4px;
+ @include box-shadow(lighten($f_d-dark, 50%) 0 2px 2px);
+ -ms-transition: all 0.5s ease-out;
+ @include transition(all 0.5s ease-out);
+ }
+
+ blockquote {
+ color: white;
+ padding: 1em;
+ margin: 2em;
+ border: 0.25em solid white;
+ @include article-shadow(4px, $f_d-grey);
+ @include basic-linear-grader(darken($f_d-color, 10%), $f_d-dark, 92%);
+ blockquote {
+ @include article-shadow(4px, $f_d-dark);
+ }
+
+ a { color: $f_d-grey; }
+ .wp-caption { color: $f_d-dark; }
+
+ p:last-child { margin-bottom: 0; }
+ }
+
+ q {
+ font-style: italic;
+ color: $f_d-dark;
+ }
+
+ ol, ul {
+ list-style-position: outside;
+ margin-left: 1.5em;
+ }
+
+ footer {
+ clear: both;
+ padding: $_48th / 2 2px;
+ background: white;
+ }
+
+ footer, nav {
+ margin-bottom: $_48th;
+ }
}
.post-edit-link,
.post-comment-link { float: right; }
.single-post article footer {
- @include basic-linear-grader(white, rgba($f_d-grey, .6), 92%);
-
- $_border: 1px dotted $f_d-dark;
- border: {
- top: $_border;
- bottom: $_border;
- }
+ @include basic-linear-grader(white, rgba($f_d-grey, .6), 92%);
+
+ $_border: 1px dotted $f_d-dark;
+ border: {
+ top: $_border;
+ bottom: $_border;
+ }
}
View
30 src/scss/_comments.scss
@@ -0,0 +1,30 @@
+.comments-title, .comment { clear: both; }
+
+.comments-title {
+ margin: {
+ top: $_24th;
+ bottom: $_48th
+ }
+}
+
+.comment {
+ padding: 0 1em;
+ &:nth-child(odd) { @include basic-linear-grader(white, lighten($f_d-desat, 50%), 92%); }
+ .permalink { float: right; }
+}
+
+.avatar {
+ background: white;
+ float: left;
+ margin: {
+ left: -1em;
+ right: 0.5em;
+ }
+}
+
+#reply-title { padding-top: $_24th; }
+
+.post, .page {
+ input, textarea { display: block; }
+ .required { color: $f_d-color; }
+}
View
100 src/scss/_footer.scss
@@ -1,52 +1,50 @@
-#orin-footer {
- clear: both;
-
- min-height: $_sect_h;
- padding-bottom: 2em;
-
- text-align: center;
-
- section {
- overflow: hidden;
-
- &>ul {
- text-align: left;
- width: $_4th;
- display: inline-block;
- vertical-align: top;
- margin: 2em 0;
- list-style-type: none;
- }
- }
-
- li {
- margin-bottom: $_24th;
- color: $f_d-grey;
-
- h3 {
- color: $f_d-dark;
- margin-bottom: $_48th / 2;
- }
-
- li {
- margin: {
- bottom: 0.25em;
- left: $_48th;
- }
- list-style: {
- type: circle;
- position: outside;
-
- }
- }
- }
-
- a {
- color: $f_d-grey;
- &:visited { color: darken($f_d-grey, 25%); }
-
- &[rel="generator"] { clear: both; }
- }
-
- #searchform label { display: none; }
+.orin-footer {
+ clear: both;
+
+ min-height: $_sect_h;
+ padding-bottom: 2em;
+
+ text-align: center;
+
+ section {
+ overflow: hidden;
+
+ &>ul {
+ text-align: left;
+ width: $_4th;
+ display: inline-block;
+ vertical-align: top;
+ margin: 2em 0;
+ list-style-type: none;
+ }
+ }
+
+ li {
+ margin-bottom: $_24th;
+ color: $f_d-grey;
+
+ h3 {
+ color: $f_d-dark;
+ @include text-shadow(none);
+ }
+
+ li {
+ margin: {
+ bottom: 0.25em;
+ left: $_48th;
+ }
+ list-style: {
+ type: circle;
+ position: outside;
+
+ }
+ }
+ }
+
+ a {
+ color: $f_d-grey;
+ &:visited { color: darken($f_d-grey, 25%); }
+ }
}
+
+#searchform label { display: none; }
View
64 src/scss/_headings.scss
@@ -0,0 +1,64 @@
+// for CSSLint : declare each heading only once:
+
+@mixin h-font-base($font_size, $line_height: 2em) {
+ margin: 0;
+ padding: 0;
+ border: 0;
+ @include _sans-serif;
+ font-size: $font_size;
+ line-height: $line_height;
+ font-weight: bold;
+ vertical-align: baseline;
+ background: transparent;
+}
+
+h2, h3, h4, h5, h6 {
+ a {
+ text-decoration: none;
+ &:hover { text-decoration: underline; }
+ }
+}
+
+h1 {
+ @include h-font-base(6em, 1em);
+ position: absolute;
+ margin-left: $_12th;
+ @include text-shadow($f_d-dark 2px 0 2px, $f_d-dark -2px 0 2px);
+ -ms-transition: 0.3s linear;
+ @include transition(0.3s linear);
+
+ a {
+ color: $f_d-color;
+ text-decoration: none;
+ }
+
+ &:hover {
+ @include text-shadow(lighten($f_d-color, 10%) 4px 0 4px, lighten($f_d-color, 10%) -4px 0 4px);
+ text-decoration: none;
+ }
+}
+
+h2 {
+ @include h-font-base(2em, 1em);
+ @include text-shadow($f_d-grey 1px 0 1px);
+}
+
+h3 {
+ @include h-font-base(1.5em);
+ @include text-shadow($f_d-grey 0 2px 1px);
+}
+
+h4 {
+ @include h-font-base(1.375em);
+ @include text-shadow($f_d-grey 0 2px 1px);
+}
+
+h5 {
+ @include h-font-base(1.25em);
+ @include text-shadow($f_d-grey 0 2px 1px);
+}
+
+h6 {
+ @include h-font-base(1.125em);
+ @include text-shadow($f_d-grey 0 2px 1px);
+}
View
8 src/scss/_layout.scss
@@ -2,10 +2,10 @@
/* ----------------------------------------- */
// Presentational classes generated by WordPress
-.aligncenter { display: block; margin: 0 auto; }
-.alignleft { float: left; margin: 0 20px 20px 0; }
-.alignright { float: right; margin: 0 0 20px 20px; }
-.wp-caption { border: 1px solid #999; text-align: center; background: #eee; padding: 10px; margin: 10px; }
+.aligncenter { display: block; margin: 0 auto; }
+.alignleft { float: left; margin: 0 20px 20px 0; }
+.alignright { float: right; margin: 0 0 20px 20px; }
+.wp-caption { border: 1px solid #999; text-align: center; background: #eee; padding: 10px; margin: 10px; }
// pseudo grid units - aping @see 960.gs
$_960_base: 960px;
View
121 src/scss/_masthead.scss
@@ -1,68 +1,57 @@
// some way to do this as "header" w/o #masthead ?
-#masthead {
- @include basic-linear-grader(white, $f_d-grey, 128px);
- height: $_sect_h;
- position: relative;
-
- hgroup {
- h1 {
- position: absolute;
- margin-left: $_12th;
- @include text-shadow($f_d-dark 2px 0 2px, $f_d-dark -2px 0 2px);
- a {
- text-decoration: none;
- color: $f_d-color;
- }
-
- @include transition(0.3s linear);
- &:hover { @include text-shadow(lighten($f_d-color, 10%) 4px 0 4px, lighten($f_d-color, 10%) -4px 0 4px); }
- }
-
- h2 {
- position: absolute;
- margin-left: $_3rd / 2;
- margin-top: $_12th;
- }
- }
-
- nav ul {
- float: right;
- position: absolute;
- right: $_24th;
-
- li {
- float: left;
- position: relative;
-
- padding: 4px;
-
- @include basic-linear-grader(rgba($f_d-grey, .7), rgba(white, .9), 92%);
-
- $_nav-li-border-style: 1px solid $f_d-grey;
- border: {
- bottom: $_nav-li-border-style;
- right: $_nav-li-border-style;
- }
-
- &:last-child { @include border-bottom-right-radius(4px); }
-
- ul {
- display: none;
- li {
- min-width: $_12th;
- width: auto;
- float: none;
- }
- }
- &:hover ul {
- display: block;
- position: absolute;
- left: 0;
- }
- &:last-of-type:hover ul {
- left: auto !important;
- right: 0;
- }
- }
- }
+.masthead {
+ @include basic-linear-grader(white, $f_d-grey, 128px);
+ height: $_sect_h;
+ position: relative;
+
+ hgroup .desc {
+ @extend ._sans-serif;
+ font-size: 1.5em;
+ font-weight: bold;
+ position: absolute;
+ margin-left: $_3rd / 2;
+ margin-top: $_12th;
+ color: $f_d-dark;
+ }
+
+ nav ul {
+ position: absolute;
+ right: $_24th;
+
+ li {
+ float: left;
+ position: relative;
+
+ padding: 4px;
+
+ background: white;
+ @include basic-linear-grader(rgba($f_d-grey, .7), rgba(white, .9), 92%);
+
+ $_nav-li-border-style: 1px solid $f_d-grey;
+ border: {
+ bottom: $_nav-li-border-style;
+ right: $_nav-li-border-style;
+ }
+
+ &:last-child { @include border-bottom-right-radius(4px); }
+
+ ul {
+ display: none;
+ li {
+ min-width: $_12th;
+ width: auto;
+ float: none;
+ }
+ }
+ &:hover ul {
+ display: block;
+ position: absolute;
+ left: 0;
+ }
+ &:last-of-type:hover ul {
+ left: auto;
+ right: 0;
+ }
+ }
+ }
}
View
51 src/scss/_mixins.scss
@@ -3,13 +3,18 @@
// Compass imports //
@import "compass/css3";
+@mixin _sans-serif {
+ font-family: "Gill Sans", "Lucida Grande", "Trebuchet MS", sans-serif;
+}
+
/**
* @param {Number} $strength (in px or %)
* @param {Color} $color
*/
@mixin article-shadow($strength, $color) {
- @include box-shadow($color 0 $strength $strength);
- @include transition(box-shadow 0.5s ease-out);
+ @include box-shadow($color 0 $strength $strength);
+ -ms-transition: box-shadow 0.5s ease-out;
+ @include transition(box-shadow 0.5s ease-out);
}
/**
@@ -17,8 +22,9 @@
* @param {Color} $color
*/
@mixin nav-shadow($strength, $color) {
- @include box-shadow($color $strength 0 abs($strength));
- @include transition(box-shadow 0.5s ease-out);
+ @include box-shadow($color $strength 0 abs($strength));
+ -ms-transition: box-shadow 0.5s ease-out;
+ @include transition(box-shadow 0.5s ease-out);
}
@@ -28,39 +34,6 @@
* @param {Number/Percent} $stop - requires a unit!
*/
@mixin basic-linear-grader($base_color, $accent_color, $stop) {
- background: $base_color;
- @include background(linear-gradient($accent_color, $base_color $stop));
-}
-
-@mixin button-style {
- @include basic-linear-grader(darken($f_d-desat, 10%), $f_d-color, 84%);
- color: white;
- @include text-shadow($f_d-color 0 1px 1px);
- @include border-radius(8px);
- padding: 6px;
- border: 2px solid darken($f_d-color, 10%);
- @include article-shadow(2px, rgba(desaturate($f_d-color, 10%), .8));
-
- &:hover {
- @include text-shadow(lighten($f_d-color, 40%) 0 2px 4px);
- @include basic-linear-grader($f_d-color, lighten($f_d-desat, 20%), 84%);
- @include article-shadow(4px, rgba(lighten($f_d-color, 20%), .4));
- }
-}
-
-@mixin input-style {
- padding: 4px 2px;
- margin: 2px 0;
- border: 1px solid $f_d-grey;
- @include border-radius(2px);
- @include transition(border-color 0.2s ease-out);
- &:focus {
- outline: none;
- padding: 3px 1px;
- border: {
- width: 2px;
- color: lighten($f_d-color, 50%);
- }
- @include transition(border-color 0.3s ease-in 0.1s);
- }
+ background: $base_color;
+ @include background(linear-gradient($accent_color, $base_color $stop));
}
View
61 src/scss/_plugins.scss
@@ -8,66 +8,55 @@
/**
* WP-Calendar
*/
-#wp-calendar {
- $_foot_border: 0px;
- #prev, .pad { border-right: $_foot_border; }
- #next, .pad { border-left: $_foot_border; }
-}
-footer #wp-calendar {
- color: $f_d-dark;
- a { color: $f_d-color; }
-}
+//#wp-calendar tfoot td:last-of-type { text-align: right; }
+#next { text-align: right; }
/**
* Delicious.com
*/
.delicious li {
- list-style-type: circle;
+ list-style-type: circle;
}
.delicious-link,
.delicious-extended {
- margin-bottom: 6px;
+ margin-bottom: 6px;
}
.delicious-tags {
- font-size: 0.8em;
- a {
- &:before { content: "#"; }
- &:after { content: ","; }
- &:last-of-type:after { content: ""; }
- }
+ @extend .smaller;
+ a {
+ &:before { content: "#"; }
+ &:after { content: ","; }
+ &:last-of-type:after { content: ""; }
+ }
}
/**
* Amazon Affiliates
*/
-img.amazon-beacon {
- background: transparent !important;
- border: none !important;
- margin: 0px !important;
- padding: 0px !important;
+.amazon-beacon {
+ background: transparent; // !important
+ border: none; // !important
+ margin: 0; // !important
+ padding: 0; // !important
}
/**
* WP-Footnotes
*/
.footnotes {
- border: {
- top: 1px solid $f_d-grey;
- top-color: rgba($f_d-color, 0.5);
- }
- padding-top: $_48th;
-}
-.footnote {
- font-size: 0.8em;
+ border: {
+ top: 1px solid $f_d-grey;
+ top-color: rgba($f_d-color, 0.5);
+ }
+ padding-top: $_48th;
}
+.footnote { @extend .smaller; }
/**
* F_D search haiku
*/
-p {
- &.search-haiku {
- text-align: center;
- font-style: italic;
- }
- &.search-haiku-defined { font-size: 0.8em; }
+.search-haiku {
+ text-align: center;
+ font-style: italic;
}
+.search-haiku-defined { @extend .smaller; }
View
91 src/scss/_reset.scss
@@ -9,98 +9,77 @@
* Author: Richard Clark - http://richclarkdesign.com
*/
-@mixin zero_out {
- margin: 0;
- padding: 0;
- border: 0;
-}
-
-@mixin color_reset {
- background-color: #ff9;
- color: #000;
+.zero {
+ margin: 0;
+ padding: 0;
+ border: 0;
}
html, body, div, span, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
+// h1, h2, h3, h4, h5, h6,
+p, blockquote, pre,
abbr, address, cite, code,
-del, dfn, em, img, ins, kbd, q, samp,
-small, strong, sub, sup, var,
-b, i,
+del, dfn, img, ins, kbd, q, samp,
+small, sub, sup, var,
+strong, b, em, i, a,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
- @include zero_out;
- outline: 0;
- font-size: 100%;
- vertical-align: baseline;
- background: transparent;
+ @extend .zero;
+ vertical-align: baseline;
+ background: transparent;
}
body {
- line-height: 1;
+ line-height: 1;
}
-article,aside,canvas,details,figcaption,figure,
-footer,header,hgroup,menu,nav,section,summary {
- display: block;
+article, aside, canvas, details, figcaption, figure,
+footer, header, hgroup, menu, nav, section, summary, hr {
+ display: block;
}
nav ul {
- list-style: none;
+ list-style: none;
}
blockquote, q {
- quotes: none;
- &:before, &:after {
- content: "";
- content: none;
- }
+ quotes: none;
+ &:before, &:after {
+ content: "";
+ content: none;
+ }
}
-a {
- @include zero_out;
- font-size: 100%;
- vertical-align: baseline;
- background: transparent;
+ins, mark {
+ background-color: #ff9;
+ color: #000;
}
-ins {
- @include color_reset;
- text-decoration: none;
-}
+ins { text-decoration: none; }
mark {
- @include color_reset;
- font-style: italic;
- font-weight: bold;
+ font-style: italic;
+ font-weight: bold;
}
del, s, strike {
- text-decoration: line-through;
-}
-
-abbr[title], dfn[title] {
- border-bottom: 1px dotted #000;
- cursor: help;
+ text-decoration: line-through;
}
table {
- border-collapse: collapse;
- border-spacing: 0;
+ border-collapse: collapse;
+ border-spacing: 0;
}
hr {
- @include zero_out;
- margin: {
- top: 1em;
- bottom: 1em;
- }
- display: block;
- height: 1px;
- border-top: 1px solid #ccc;
+ @extend .zero;
+ margin: 1em 0;
+ height: 1px;
+ background-color: #ccc;
}
input, select { vertical-align: middle; }
View
56 src/scss/_sidebar.scss
@@ -1,34 +1,28 @@
aside {
- float: right;
- display: inline;
- width: $_3rd - $_48th;
-
- ul { list-style-type: none; }
-
- li {
- margin-bottom: $_24th;
- li {
- margin-bottom: 0.25em;
-
- margin-left: $_48th;
- list-style: {
- type: circle;
- position: outside;
- }
- }
-
- h3, ul {
- padding: 0.5em;
- padding-top: 0;
- }
-
- h3 {
- color: $f_d-color;
- @include text-shadow($f_d-grey 0 2px 1px);
- }
- }
- #orin-container & ul {
- overflow: hidden;
- }
+ float: right;
+ width: $_3rd - $_48th;
+
+ ul { list-style-type: none; }
+
+ li {
+ margin-bottom: $_24th;
+ li {
+ margin-bottom: 0.25em;
+
+ margin-left: $_48th;
+ list-style: {
+ type: circle;
+ position: outside;
+ }
+ }
+
+ ul {
+ padding: 0.5em;
+ padding-top: 0;
+ }
+ }
+ .orin-container & ul {
+ overflow: hidden;
+ }
}
View
56 src/scss/_table.scss
@@ -1,34 +1,54 @@
table, td, th {
- border: 1px solid $f_d-grey;
+ border: 1px solid $f_d-grey;
}
table {
- padding: 1px;
- margin-bottom: $_48th;
- @include article-shadow(4px, lighten($f_d-dark, 25%));
+ padding: 1px;
+ margin-bottom: $_48th;
+ @include article-shadow(4px, lighten($f_d-dark, 25%));
}
thead tr {
- background: $f_d-dark;
- color: white;
+ background: $f_d-dark;
+ border: 1px solid $f_d-dark;
+ border-bottom: none;
+}
+tfoot tr {
+ $_c: lighten($f_d-dark, 50%);
+ background: $_c;
+ border: 1px solid $_c;
+ border-top: none;
+}
+thead, tfoot {
+ tr, tr a { color: white; }
+ td, th { border: none; }
}
td, th {
- margin: 1px;
- padding: 2px 8px;
+ margin: 1px;
+ padding: 2px 8px;
}
th { border-color: $f_d-dark; }
tr {
- background: white;
- &:nth-child(even) {
- background: $f_d-grey;
- td {
- border-color: white;
- &:first-of-type { border-left-color: $f_d-grey; }
- &:last-of-type { border-right-color: $f_d-grey; }
- }
-
- }
+ background: white;
+ &:nth-child(even) {
+ background: $f_d-grey;
+ td {
+ border-color: white;
+ &:first-of-type { border-left-color: $f_d-grey; }
+ &:last-of-type { border-right-color: $f_d-grey; }
+ }
+
+ }
+}
+
+.orin-footer table {
+ color: white;
+ a, a:visited { color: $f_d-color; }
+ tfoot {
+ a, a:visited { color: white; }
+ }
+ td { color: black; }
}
View
108 src/scss/_typography.scss
@@ -1,109 +1,77 @@
// font-families
-@mixin _sans-serif { font-family: "Gill Sans", "Lucida Grande", "Trebuchet MS", sans-serif; }
-@mixin _serif { font-family: "Hoefler Text", Palatino, Georgia, serif; }
-@mixin _console { font-family: Consolas, "Lucida Console", Monaco, monospace; }
+// @TODO - replace these w/ 'silent' classes for @extending when that becomes available
+._sans-serif { @include _sans-serif; }
+._serif { font-family: "Hoefler Text", Palatino, Georgia, serif; }
+._console { font-family: Consolas, "Lucida Console", Monaco, monospace; }
+
+// DO NOT SET: a, span, dl, dt, dd, ol, ul, li, div
+// (these should only ever get their fonts from their containers)
// Elements
-div, span, p, blockquote,
+p, blockquote,
abbr, address, cite,
del, dfn, ins, q, samp,
-dl, dt, dd, ol, ul, li,
article, details, figcaption, figure,
hgroup, menu, section, summary {
- @include _serif;
+ @extend ._serif;
}
// Elements
-h1, h2, h3, h4, h5, h6,
label, legend,
-nav, aside,
-// Element combinationss
-aside li,
-header nav * {
- @include _sans-serif;
-
+nav, aside {
+ @extend ._sans-serif;
+}
+aside {
+ p, blockquote {
+ @extend ._sans-serif;
+ }
}
article {
- header, footer {
- @include _sans-serif;
- * { @include _sans-serif; }
- }
+ header, footer { @extend ._sans-serif; }
}
.comment {
- @include _sans-serif;
- p { @include _serif; }
+ @extend ._sans-serif;
+ p { @extend ._serif; }
}
// Elements
-pre, pre *, code, kbd, tt {
- @include _console;
+pre, code, kbd, tt {
+ @extend ._console;
}
table, caption, tbody, tfoot, thead, tr, th, td {
- @include _sans-serif;
+ @extend ._sans-serif;
}
// sizing:
$_font-size: 16px;
// base font-size:
-body {
- font-size: $_font-size;
-}
+body { font-size: $_font-size; }
-sup, sub { font-size: 0.8em; }
+/**
+ * Utils
+ */
+.smaller { font-size: 0.8em; }
+.bigger { font-size: 1.2em; }
+
+// some non-semantic but for backward-compat:
+sup, sub, small { @extend .smaller; }
+big { @extend .bigger; }
sup { vertical-align: super; }
sub { vertical-align: sub; }
-
-// h#{n} headings:
-$_em: 1em; $i: 6;
-@while $i > 0 {
- $_em: $_em + 0.125em; $i: $i - 1;
- h#{$i} { font-size: $_em; }
-}
-
-// non-semantic but for backward-compat:
-small { font-size: 0.8em; }
-big { font-size: 1.2em; }
-
-// @todo - how to ditch #masthead ?
-#masthead {
- h1 { font-size: 6em; }
- // don't do "em" b/c of the cascade :
- li { font-size: 14px; }
-}
-
-nav {
- font-size: $_font-size;
-}
+.masthead li { font-size: 14px; }
article {
- header, footer { font-size: 0.875em; }
-
- header {
- h1, h2 {
- font-size: 2em;
- a {
- text-decoration: none;
- &:hover { text-decoration: underline; }
- }
- }
- }
-
- font-size: $_font-size;
- line-height: $_font-size * 1.5;
-
- blockquote {
- font-size: 0.875em;
- & blockquote { font-size: 1em; }
- }
+ line-height: $_font-size * 1.5;
+ header, footer, blockquote { font-size: 0.875em; }
+ blockquote blockquote { font-size: 1em; }
}
.form-allowed-tags { font-size: 0.8125em; }
-.comment a.permalink { font-size: 0.75em; }
-
-#orin-footer { font-size: 0.75em; }
+.comment .permalink,
+.orin-footer { font-size: 0.75em; }
View
2  src/scss/_variables.scss
@@ -1,4 +1,4 @@
-/* SASS variables */
+/* SCSS variables */
// colors
$f_d-color: #710;
$f_d-desat: desaturate($f_d-color, 50%);
View
10 src/scss/_widgets.scss
@@ -1,6 +1,6 @@
-#masthead-widgets {
- position: relative;
- top: 6.5em;
- margin-left: $_3rd / 2;
- margin-right: 2em;
+.masthead-widgets {
+ position: relative;
+ top: 6.5em;
+ margin-left: $_3rd / 2;
+ margin-right: 2em;
}
View
48 src/scss/ie.scss
@@ -9,36 +9,42 @@
* IE7 and below...
*/
-#masthead nav ul li:hover ul { top: 23px; }
+.masthead nav ul li:hover ul { top: 23px; }
// to get the sidebar in the right place: (fixes IE6+7)
-#orin-chronology { float: left; }
+.orin-chronology { float: left; }
// to get the floaters in the footer working: (fixes IE7, but not IE6)
-#orin-footer section ul { display: inline !important; }
+.orin-footer section ul { display: inline !important; }
// gets the buttons on the same line as the field (fixes IE7, not really IE6)
-@mixin ie-button-fix {
- border: 0px;
- padding: 0px;
+.ie-btn-fix {
+ border: 0;
+ padding: 0;
}
-button { @include ie-button-fix; }
+button { @extend .ie-btn-fix; }
input {
- &[type="button"],
- &[type="file"],
- &[type="reset"],
- &[type="submit"] {
- @include ie-button-fix;
- }
-
- &[type="text"] {
- border-width: 2px;
- padding: 0;
- margin: 0;
- }
+ &[type="button"],
+ &[type="file"],
+ &[type="reset"],
+ &[type="submit"] {
+ @extend .ie-btn-fix;
+ }
+
+ &[type="text"] {
+ border-width: 2px;
+ padding: 0;
+ margin: 0;
+ }
}
-// fixes the calendar in IE6+7
+// fixes the tables in IE6+7
thead tr {
- th, td { background: #222222; }
+ th, td { background: #222; }
+}
+tbody tr {
+ th, td { background: white; }
+}
+tfoot tr {
+ th, td { background: #DDD; }
}
View
3  src/scss/print.scss
@@ -1,3 +0,0 @@
-/* Welcome to Compass. Use this file to define print styles.
- * Import this file using the following HTML or equivalent:
- * <link href="/stylesheets/print.css" media="print" rel="stylesheet" type="text/css" /> */
View
6 src/scss/screen.scss
@@ -1,6 +0,0 @@
-/* Welcome to Compass.
- * In this file you should write your main styles. (or centralize your imports)
- * Import this file using the following HTML or equivalent:
- * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
-
-@import "compass/reset";
View
148 src/scss/style.scss
@@ -2,7 +2,7 @@
Theme Name: Orin
Theme URI: https://github.com/founddrama/orin
Description: A WordPress theme, custom rolled for <http://blog.founddrama.net>, and based on the HTML5 Starkers <http://starkerstheme.com>, which is based on <a href="http://elliotjaystocks.com/starkers/">Starkers</a> by <a href="http://elliotjaystocks.com/">Elliot Jay Stocks</a> which is based on Twenty Ten.
-Version: 0.5
+Version: 0.6
Author: Rob Friesel
Author URI: http://blog.founddrama.net
Tags: orin, html5, css3
@@ -10,87 +10,123 @@ Tags: orin, html5, css3
// Compass imports //
@import "compass/css3";
// imports //
+@import "variables";
+@import "mixins";
@import "reset";
@import "layout";
@import "typography";
-@import "mixins";
-@import "variables";
body {
- background-color: $f_d-color;
- border-bottom: 1px solid $f_d-color;
+ background-color: $f_d-color;
+ border-bottom: 1px solid $f_d-color;
}
-#orin-ct-wrap {
- background-color: #fff;
- min-height: $_sect_h;
- overflow: hidden;
- @include box-shadow(rgba($f_d-dark, 0.8) 0 10px 10px 5px);
+.orin-ct-wrap {
+ background-color: #fff;
+ min-height: $_sect_h;
+ overflow: hidden;
+ @include box-shadow(rgba($f_d-dark, 0.8) 0 10px 10px 5px);
}
+@import "headings";
+
@import "masthead";
a {
- color: $f_d-color;
+ color: $f_d-color;
}
-#orin-container {
- float: right;
- width: $_960_base;
- margin-right: 2em;
+.orin-container {
+ float: right;
+ width: $_960_base;
+ margin-right: 2em;
}
-#orin-chronology {
- display: inline-block;
- width: $_3rd * 2;
-
- .page-decorator,
- .post-decorator {
- @include border-radius(8px);
-
- padding: $_24th;
- padding-bottom: $_24th / 2;
-
- @include basic-linear-grader(white, $f_d-desat, 56px);
-
- margin-bottom: 64px;
-
- @include article-shadow(8px, rgba($f_d-grey, .8));
- border: 1px solid $f_d-grey;
-
- &:hover { @include article-shadow(24px, rgba(saturate($f_d-color, 25%), .8)); }
- }
-
- nav a {
- &:last-child { float: right; }
- &:first-child { float: none; }
- }
-
- margin-bottom: $_24th;
+.orin-chronology {
+ display: inline-block;
+ width: $_3rd * 2;
+
+ .page-decorator,
+ .post-decorator {
+ @include border-radius(8px);
+
+ padding: $_24th;
+ padding-bottom: $_24th / 2;
+
+ @include basic-linear-grader(white, $f_d-desat, 56px);
+
+ margin-bottom: 64px;
+
+ @include article-shadow(8px, rgba($f_d-grey, .8));
+ border: 1px solid $f_d-grey;
+
+ &:hover { @include article-shadow(24px, rgba(saturate($f_d-color, 25%), .8)); }
+ }
+
+ nav a {
+ &:last-child { float: right; }
+ &:first-child { float: none; }
+ }
+
+ margin-bottom: $_24th;
}
-button { @include button-style; }
+.orin-button {
+ @include basic-linear-grader(darken($f_d-desat, 10%), $f_d-color, 84%);
+ color: white;
+ @include text-shadow($f_d-color 0 1px 1px);
+ @include border-radius(8px);
+ padding: 6px;
+ border: 2px solid darken($f_d-color, 10%);
+ @include article-shadow(2px, rgba(desaturate($f_d-color, 10%), .8));
+
+ &:hover {
+ @include text-shadow(lighten($f_d-color, 40%) 0 2px 4px);
+ @include basic-linear-grader($f_d-color, lighten($f_d-desat, 20%), 84%);
+ @include article-shadow(4px, rgba(lighten($f_d-color, 20%), .4));
+ }
+}
+.orin-field {
+ padding: 4px 2px;
+ margin: 2px 0;
+ border: 1px solid $f_d-grey;
+ @include border-radius(2px);
+ -ms-transition: border-color 0.2s ease-out;
+ @include transition(border-color 0.2s ease-out);
+ &:focus {
+ outline: none;
+ padding: 3px 1px;
+ border: {
+ width: 2px;
+ color: lighten($f_d-color, 50%);
+ }
+ -ms-transition: border-color 0.3s ease-in 0.1s;
+ @include transition(border-color 0.3s ease-in 0.1s);
+ }
+}
+button { @extend .orin-button; }
input {
- &[type="button"],
- &[type="file"],
- &[type="reset"],
- &[type="submit"] {
- @include button-style;
- }
+ &[type="button"],
+ &[type="file"],
+ &[type="reset"],
+ &[type="submit"] {
+ @extend .orin-button;
+ }
- &[type="text"],
- &[type="email"],
- &[type="search"],
- &[type="url"] {
- @include input-style;
- }
+ &[type="text"],
+ &[type="email"],
+ &[type="search"],
+ &[type="url"] {
+ @extend .orin-field;
+ }
}
textarea {
- @include input-style;
+ @extend .orin-field;
}
// inside : #orin-chronology
@import "articles";
+@import "comments";
// aside
@import "sidebar";
View
4 tag.php
@@ -9,9 +9,9 @@
get_header(); ?>
- <h1><?php
+ <h2><?php
printf( __( 'Tag Archives: %s', 'starkers' ), '' . single_tag_title( '', false ) . '' );
- ?></h1>
+ ?></h2>
<?php
get_template_part( 'loop', 'tag' );
get_footer(); ?>
Please sign in to comment.
Something went wrong with that request. Please try again.