Created
February 10, 2012 02:17
-
-
Save founddrama/1785577 to your computer and use it in GitHub Desktop.
The diff between the HEAD of orin/feature/CSSLint-massage and orin/master at the time that the feature branch was finalized...
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Example only. CSS Lint does not actually want | |
| * your headings to look like this. | |
| */ | |
| h1 { | |
| font-size: 28px; | |
| margin: 1em 0; | |
| } | |
| h2 { | |
| font-size: 24px; | |
| margin: 1em 0; | |
| } | |
| h3 { | |
| font-size: 20px; | |
| font-weight: bold; | |
| } | |
| h4 { | |
| font-size: 18px; | |
| font-weight: bold; | |
| } | |
| h5 { | |
| font-size: 16px; | |
| font-weight: bold; | |
| } | |
| h6 { | |
| font-size: 14px; | |
| font-weight: bold; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| diff --git a/404.php b/404.php | |
| index 1210a68..11ca472 100644 | |
| --- a/404.php | |
| +++ b/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(); ?> | |
| diff --git a/archive.php b/archive.php | |
| index 7a0036f..4948110 100644 | |
| --- a/archive.php | |
| +++ b/archive.php | |
| @@ -14,7 +14,7 @@ get_header(); ?> | |
| 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 @@ get_header(); ?> | |
| <?php else : ?> | |
| <?php _e( 'Blog Archives', 'starkers' ); ?> | |
| <?php endif; ?> | |
| - </h1> | |
| + </h2> | |
| <?php | |
| rewind_posts(); | |
| diff --git a/author.php b/author.php | |
| index a28b314..990d62c 100644 | |
| --- a/author.php | |
| +++ b/author.php | |
| @@ -14,13 +14,13 @@ get_header(); ?> | |
| 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; ?> | |
| diff --git a/category.php b/category.php | |
| index 5fd8fb2..4a8b0ce 100644 | |
| --- a/category.php | |
| +++ b/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 ) ) | |
| diff --git a/comments.php b/comments.php | |
| index 65e467b..4667cc2 100644 | |
| --- a/comments.php | |
| +++ b/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> | |
| diff --git a/footer.php b/footer.php | |
| index 492b474..0bc5ada 100644 | |
| --- a/footer.php | |
| +++ b/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' ); ?> | |
| diff --git a/header.php b/header.php | |
| index 61d9265..eed0fad 100644 | |
| --- a/header.php | |
| +++ b/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"> | |
| diff --git a/loop.php b/loop.php | |
| index f0237d6..c8ca963 100644 | |
| --- a/loop.php | |
| +++ b/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; ?> | |
| diff --git a/onecolumn-page.php b/onecolumn-page.php | |
| index a90571c..efd471f 100644 | |
| --- a/onecolumn-page.php | |
| +++ b/onecolumn-page.php | |
| @@ -14,7 +14,7 @@ get_header(); ?> | |
| <article <?php post_class() ?> id="post-<?php the_ID(); ?>"> | |
| <header> | |
| - <h1><?php the_title(); ?></h1> | |
| + <h2><?php the_title(); ?></h2> | |
| </header> | |
| <?php the_content(); ?> | |
| diff --git a/page.php b/page.php | |
| index 0c7b26c..9178d48 100644 | |
| --- a/page.php | |
| +++ b/page.php | |
| @@ -15,11 +15,7 @@ get_header(); ?> | |
| <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(); ?> | |
| diff --git a/search.php b/search.php | |
| index 41f1f4c..1b75d35 100644 | |
| --- a/search.php | |
| +++ b/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' ); | |
| ?> | |
| diff --git a/single.php b/single.php | |
| index 1430623..d1816c3 100644 | |
| --- a/single.php | |
| +++ b/single.php | |
| @@ -15,7 +15,7 @@ get_header(); ?> | |
| <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(); ?> | |
| diff --git a/src/scss/_articles.scss b/src/scss/_articles.scss | |
| index 71b3e58..550c703 100644 | |
| --- a/src/scss/_articles.scss | |
| +++ b/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; | |
| + } | |
| } | |
| diff --git a/src/scss/_comments.scss b/src/scss/_comments.scss | |
| new file mode 100644 | |
| index 0000000..f95fd3a | |
| --- /dev/null | |
| +++ b/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; } | |
| +} | |
| \ No newline at end of file | |
| diff --git a/src/scss/_footer.scss b/src/scss/_footer.scss | |
| index 9880d94..cc6e87f 100644 | |
| --- a/src/scss/_footer.scss | |
| +++ b/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; } | |
| diff --git a/src/scss/_headings.scss b/src/scss/_headings.scss | |
| new file mode 100644 | |
| index 0000000..4a848af | |
| --- /dev/null | |
| +++ b/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); | |
| +} | |
| diff --git a/src/scss/_layout.scss b/src/scss/_layout.scss | |
| index 875f43d..4354dfa 100644 | |
| --- a/src/scss/_layout.scss | |
| +++ b/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; | |
| diff --git a/src/scss/_masthead.scss b/src/scss/_masthead.scss | |
| index 749dd18..31d08ac 100644 | |
| --- a/src/scss/_masthead.scss | |
| +++ b/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; | |
| + } | |
| + } | |
| + } | |
| } | |
| diff --git a/src/scss/_mixins.scss b/src/scss/_mixins.scss | |
| index acfd234..c0d97f0 100644 | |
| --- a/src/scss/_mixins.scss | |
| +++ b/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)); | |
| } | |
| diff --git a/src/scss/_plugins.scss b/src/scss/_plugins.scss | |
| index 2ec5b20..bb1184f 100644 | |
| --- a/src/scss/_plugins.scss | |
| +++ b/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; } | |
| \ No newline at end of file | |
| diff --git a/src/scss/_reset.scss b/src/scss/_reset.scss | |
| index 3c6c551..98a5713 100644 | |
| --- a/src/scss/_reset.scss | |
| +++ b/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; } | |
| \ No newline at end of file | |
| diff --git a/src/scss/_sidebar.scss b/src/scss/_sidebar.scss | |
| index a2a44dc..c27222c 100644 | |
| --- a/src/scss/_sidebar.scss | |
| +++ b/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; | |
| + } | |
| } | |
| diff --git a/src/scss/_table.scss b/src/scss/_table.scss | |
| index 95b3e3d..0f362b2 100644 | |
| --- a/src/scss/_table.scss | |
| +++ b/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; } | |
| } | |
| \ No newline at end of file | |
| diff --git a/src/scss/_typography.scss b/src/scss/_typography.scss | |
| index 17766f5..6711d1e 100644 | |
| --- a/src/scss/_typography.scss | |
| +++ b/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; } | |
| \ No newline at end of file | |
| +.comment .permalink, | |
| +.orin-footer { font-size: 0.75em; } | |
| \ No newline at end of file | |
| diff --git a/src/scss/_variables.scss b/src/scss/_variables.scss | |
| index 4ec33f2..5549d3b 100644 | |
| --- a/src/scss/_variables.scss | |
| +++ b/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%); | |
| diff --git a/src/scss/_widgets.scss b/src/scss/_widgets.scss | |
| index 6897ea2..3acd57d 100644 | |
| --- a/src/scss/_widgets.scss | |
| +++ b/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; | |
| } | |
| diff --git a/src/scss/ie.scss b/src/scss/ie.scss | |
| index bd7eb11..4f94cc7 100644 | |
| --- a/src/scss/ie.scss | |
| +++ b/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; } | |
| } | |
| \ No newline at end of file | |
| diff --git a/src/scss/print.scss b/src/scss/print.scss | |
| deleted file mode 100644 | |
| index b0e9e45..0000000 | |
| --- a/src/scss/print.scss | |
| +++ /dev/null | |
| @@ -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" /> */ | |
| diff --git a/src/scss/screen.scss b/src/scss/screen.scss | |
| deleted file mode 100644 | |
| index 81de847..0000000 | |
| --- a/src/scss/screen.scss | |
| +++ /dev/null | |
| @@ -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"; | |
| diff --git a/src/scss/style.scss b/src/scss/style.scss | |
| index 0662d5f..cfc7dbc 100644 | |
| --- a/src/scss/style.scss | |
| +++ b/src/scss/style.scss | |
| @@ -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"; | |
| diff --git a/tag.php b/tag.php | |
| index 8f3bf67..9c45af2 100644 | |
| --- a/tag.php | |
| +++ b/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(); ?> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment