<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>[25519] trunk/src/wp-content/themes/twentyfourteen: Twenty Fourteen: first pass at improving responsive patterns and allowing for a full-width layout when no secondary sidebar is present.</title>
</head>
<body>
<style type="text/css"><!--
#msg dl.meta { border: 1px #006 solid; background: #369; padding: 6px; color: #fff; }
#msg dl.meta dt { float: left; width: 6em; font-weight: bold; }
#msg dt:after { content:':';}
#msg dl, #msg dt, #msg ul, #msg li, #header, #footer, #logmsg { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; }
#msg dl a { font-weight: bold}
#msg dl a:link { color:#fc3; }
#msg dl a:active { color:#ff0; }
#msg dl a:visited { color:#cc6; }
h3 { font-family: verdana,arial,helvetica,sans-serif; font-size: 10pt; font-weight: bold; }
#msg pre { overflow: auto; background: #ffc; border: 1px #fa0 solid; padding: 6px; }
#logmsg { background: #ffc; border: 1px #fa0 solid; padding: 1em 1em 0 1em; }
#logmsg p, #logmsg pre, #logmsg blockquote { margin: 0 0 1em 0; }
#logmsg p, #logmsg li, #logmsg dt, #logmsg dd { line-height: 14pt; }
#logmsg h1, #logmsg h2, #logmsg h3, #logmsg h4, #logmsg h5, #logmsg h6 { margin: .5em 0; }
#logmsg h1:first-child, #logmsg h2:first-child, #logmsg h3:first-child, #logmsg h4:first-child, #logmsg h5:first-child, #logmsg h6:first-child { margin-top: 0; }
#logmsg ul, #logmsg ol { padding: 0; list-style-position: inside; margin: 0 0 0 1em; }
#logmsg ul { text-indent: -1em; padding-left: 1em; }#logmsg ol { text-indent: -1.5em; padding-left: 1.5em; }
#logmsg > ul, #logmsg > ol { margin: 0 0 1em 0; }
#logmsg pre { background: #eee; padding: 1em; }
#logmsg blockquote { border: 1px solid #fa0; border-left-width: 10px; padding: 1em 1em 0 1em; background: white;}
#logmsg dl { margin: 0; }
#logmsg dt { font-weight: bold; }
#logmsg dd { margin: 0; padding: 0 0 0.5em 0; }
#logmsg dd:before { content:'\00bb';}
#logmsg table { border-spacing: 0px; border-collapse: collapse; border-top: 4px solid #fa0; border-bottom: 1px solid #fa0; background: #fff; }
#logmsg table th { text-align: left; font-weight: normal; padding: 0.2em 0.5em; border-top: 1px dotted #fa0; }
#logmsg table td { text-align: right; border-top: 1px dotted #fa0; padding: 0.2em 0.5em; }
#logmsg table thead th { text-align: center; border-bottom: 1px solid #fa0; }
#logmsg table th.Corner { text-align: left; }
#logmsg hr { border: none 0; border-top: 2px dashed #fa0; height: 1px; }
#header, #footer { color: #fff; background: #636; border: 1px #300 solid; padding: 6px; }
#patch { width: 100%; }
#patch h4 {font-family: verdana,arial,helvetica,sans-serif;font-size:10pt;padding:8px;background:#369;color:#fff;margin:0;}
#patch .propset h4, #patch .binary h4 {margin:0;}
#patch pre {padding:0;line-height:1.2em;margin:0;}
#patch .diff {width:100%;background:#eee;padding: 0 0 10px 0;overflow:auto;}
#patch .propset .diff, #patch .binary .diff {padding:10px 0;}
#patch span {display:block;padding:0 10px;}
#patch .modfile, #patch .addfile, #patch .delfile, #patch .propset, #patch .binary, #patch .copfile {border:1px solid #ccc;margin:10px 0;}
#patch ins {background:#dfd;text-decoration:none;display:block;padding:0 10px;}
#patch del {background:#fdd;text-decoration:none;display:block;padding:0 10px;}
#patch .lines, .info {color:#888;background:#fff;}
--></style>
<div id="msg">
<dl class="meta">
<dt>Revision</dt> <dd><a href="http://core.trac.wordpress.org/changeset/25519">25519</a></dd>
<dt>Author</dt> <dd>lancewillett</dd>
<dt>Date</dt> <dd>2013-09-20 18:21:30 +0000 (Fri, 20 Sep 2013)</dd>
</dl>
<h3>Log Message</h3>
<pre>Twenty Fourteen: first pass at improving responsive patterns and allowing for a full-width layout when no secondary sidebar is present. Props iamtakashi, see <a href="http://core.trac.wordpress.org/ticket/25332">#25332</a>.</pre>
<h3>Modified Paths</h3>
<ul>
<li><a href="#trunksrcwpcontentthemestwentyfourteencommentsphp">trunk/src/wp-content/themes/twentyfourteen/comments.php</a></li>
<li><a href="#trunksrcwpcontentthemestwentyfourteencontributorpagephp">trunk/src/wp-content/themes/twentyfourteen/contributor-page.php</a></li>
<li><a href="#trunksrcwpcontentthemestwentyfourteenfeaturedcontentphp">trunk/src/wp-content/themes/twentyfourteen/featured-content.php</a></li>
<li><a href="#trunksrcwpcontentthemestwentyfourteenfrontpagephp">trunk/src/wp-content/themes/twentyfourteen/front-page.php</a></li>
<li><a href="#trunksrcwpcontentthemestwentyfourteenfullwidthpagephp">trunk/src/wp-content/themes/twentyfourteen/full-width-page.php</a></li>
<li><a href="#trunksrcwpcontentthemestwentyfourteenfunctionsphp">trunk/src/wp-content/themes/twentyfourteen/functions.php</a></li>
<li><a href="#trunksrcwpcontentthemestwentyfourteenimagephp">trunk/src/wp-content/themes/twentyfourteen/image.php</a></li>
<li><a href="#trunksrcwpcontentthemestwentyfourteenstylecss">trunk/src/wp-content/themes/twentyfourteen/style.css</a></li>
</ul>
</div>
<div id="patch">
<h3>Diff</h3>
<a id="trunksrcwpcontentthemestwentyfourteencommentsphp"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/comments.php (25518 => 25519)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/comments.php 2013-09-20 17:45:30 UTC (rev 25518)
+++ trunk/src/wp-content/themes/twentyfourteen/comments.php 2013-09-20 18:21:30 UTC (rev 25519)
</span><span class="lines">@@ -40,7 +40,7 @@
</span><span class="cx"> wp_list_comments( array(
</span><span class="cx"> 'style' => 'ol',
</span><span class="cx"> 'short_ping' => true,
</span><del>- 'avatar_size'=> 42,
</del><ins>+ 'avatar_size'=> 34,
</ins><span class="cx"> ) );
</span><span class="cx"> ?>
</span><span class="cx"> </ol><!-- .comment-list -->
</span></span></pre></div>
<a id="trunksrcwpcontentthemestwentyfourteencontributorpagephp"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/contributor-page.php (25518 => 25519)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/contributor-page.php 2013-09-20 17:45:30 UTC (rev 25518)
+++ trunk/src/wp-content/themes/twentyfourteen/contributor-page.php 2013-09-20 18:21:30 UTC (rev 25519)
</span><span class="lines">@@ -9,7 +9,7 @@
</span><span class="cx"> get_header(); ?>
</span><span class="cx">
</span><span class="cx"> <div id="primary" class="content-area">
</span><del>- <div id="content" class="site-content full-width" role="main">
</del><ins>+ <div id="content" class="site-content" role="main">
</ins><span class="cx"> <?php
</span><span class="cx"> while ( have_posts() ) :
</span><span class="cx"> the_post();
</span></span></pre></div>
<a id="trunksrcwpcontentthemestwentyfourteenfeaturedcontentphp"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/featured-content.php (25518 => 25519)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/featured-content.php 2013-09-20 17:45:30 UTC (rev 25518)
+++ trunk/src/wp-content/themes/twentyfourteen/featured-content.php 2013-09-20 18:21:30 UTC (rev 25519)
</span><span class="lines">@@ -9,23 +9,21 @@
</span><span class="cx"> */
</span><span class="cx"> ?>
</span><span class="cx">
</span><del>-<div class="featured-content-wrapper">
- <div id="featured-content" class="featured-content">
</del><ins>+<div id="featured-content" class="featured-content">
</ins><span class="cx">
</span><del>- <?php
- do_action( 'twentyfourteen_featured_posts_before' );
</del><ins>+ <?php
+ do_action( 'twentyfourteen_featured_posts_before' );
</ins><span class="cx">
</span><del>- $featured_posts = twentyfourteen_get_featured_posts();
- foreach ( (array) $featured_posts as $order => $post ) :
- setup_postdata( $post );
</del><ins>+ $featured_posts = twentyfourteen_get_featured_posts();
+ foreach ( (array) $featured_posts as $order => $post ) :
+ setup_postdata( $post );
</ins><span class="cx">
</span><del>- get_template_part( 'content', 'featured-post' );
- endforeach;
</del><ins>+ get_template_part( 'content', 'featured-post' );
+ endforeach;
</ins><span class="cx">
</span><del>- do_action( 'twentyfourteen_featured_posts_after' );
</del><ins>+ do_action( 'twentyfourteen_featured_posts_after' );
</ins><span class="cx">
</span><del>- wp_reset_postdata();
- ?>
</del><ins>+ wp_reset_postdata();
+ ?>
</ins><span class="cx">
</span><del>- </div><!-- .featured-content -->
-</div><!-- .featured-content-wrapper -->
</del><ins>+</div><!-- #featured-content .featured-content -->
</ins></span></pre></div>
<a id="trunksrcwpcontentthemestwentyfourteenfrontpagephp"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/front-page.php (25518 => 25519)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/front-page.php 2013-09-20 17:45:30 UTC (rev 25518)
+++ trunk/src/wp-content/themes/twentyfourteen/front-page.php 2013-09-20 18:21:30 UTC (rev 25519)
</span><span class="lines">@@ -8,43 +8,38 @@
</span><span class="cx">
</span><span class="cx"> get_header(); ?>
</span><span class="cx">
</span><del>- <div class="front-page-content-wrapper">
- <div class="front-page-content-main">
</del><ins>+<div class="front-page-content-wrapper">
</ins><span class="cx">
</span><del>- <?php if ( twentyfourteen_has_featured_posts() ) : ?>
- <?php get_template_part( 'featured-content' ); ?>
- <?php endif; ?>
</del><ins>+ <?php
+ if ( twentyfourteen_has_featured_posts() )
+ get_template_part( 'featured-content' );
+ ?>
</ins><span class="cx">
</span><del>- <div class="front-page-content-area">
</del><ins>+ <div id="primary" class="content-area no-sidebar">
+ <div id="content" class="site-content" role="main">
+ <?php
+ if ( have_posts() ) :
+ while ( have_posts() ) :
+ the_post();
</ins><span class="cx">
</span><del>- <div id="primary" class="content-area no-sidebar">
- <div id="content" class="site-content" role="main">
- <?php
- if ( have_posts() ) :
- while ( have_posts() ) :
- the_post();
</del><ins>+ get_template_part( 'content', get_post_format() );
</ins><span class="cx">
</span><del>- get_template_part( 'content', get_post_format() );
</del><ins>+ comments_template();
+ endwhile;
+ twentyfourteen_paging_nav();
</ins><span class="cx">
</span><del>- comments_template();
- endwhile;
- twentyfourteen_paging_nav();
</del><ins>+ else :
+ get_template_part( 'content', 'none' );
</ins><span class="cx">
</span><del>- else :
- get_template_part( 'content', 'none' );
</del><ins>+ endif;
+ ?>
+ </div><!-- #content .site-content -->
+ </div><!-- #primary .content-area -->
</ins><span class="cx">
</span><del>- endif;
- ?>
- </div><!-- #content .site-content -->
- </div><!-- #primary .content-area -->
</del><ins>+ <?php get_sidebar( 'ephemera' ); ?>
</ins><span class="cx">
</span><del>- <?php get_sidebar( 'ephemera' ); ?>
</del><ins>+</div><!-- .front-page-content-wrapper -->
</ins><span class="cx">
</span><del>- </div><!-- .front-page-content-area -->
-
- </div><!-- .front-page-content-main -->
- </div><!-- .front-page-content-wrapper -->
-
</del><span class="cx"> <?php
</span><span class="cx"> get_sidebar();
</span><span class="cx"> get_footer();
</span></span></pre></div>
<a id="trunksrcwpcontentthemestwentyfourteenfullwidthpagephp"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/full-width-page.php (25518 => 25519)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/full-width-page.php 2013-09-20 17:45:30 UTC (rev 25518)
+++ trunk/src/wp-content/themes/twentyfourteen/full-width-page.php 2013-09-20 18:21:30 UTC (rev 25519)
</span><span class="lines">@@ -9,7 +9,7 @@
</span><span class="cx"> get_header(); ?>
</span><span class="cx">
</span><span class="cx"> <div id="primary" class="content-area">
</span><del>- <div id="content" class="site-content full-width" role="main">
</del><ins>+ <div id="content" class="site-content" role="main">
</ins><span class="cx"> <?php
</span><span class="cx"> while ( have_posts() ) :
</span><span class="cx"> the_post();
</span></span></pre></div>
<a id="trunksrcwpcontentthemestwentyfourteenfunctionsphp"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/functions.php (25518 => 25519)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/functions.php 2013-09-20 17:45:30 UTC (rev 25518)
+++ trunk/src/wp-content/themes/twentyfourteen/functions.php 2013-09-20 18:21:30 UTC (rev 25519)
</span><span class="lines">@@ -99,13 +99,13 @@
</span><span class="cx"> add_action( 'after_setup_theme', 'twentyfourteen_setup' );
</span><span class="cx">
</span><span class="cx"> /**
</span><del>- * Adjusts content_width value for full width and attachment templates.
</del><ins>+ * Adjusts content_width value for full-width and attachment templates.
</ins><span class="cx"> *
</span><span class="cx"> * @return void
</span><span class="cx"> */
</span><span class="cx"> function twentyfourteen_content_width() {
</span><span class="cx"> if ( is_page_template( 'full-width-page.php' ) || is_attachment() )
</span><del>- $GLOBALS['content_width'] = 895;
</del><ins>+ $GLOBALS['content_width'] = 810;
</ins><span class="cx"> }
</span><span class="cx"> add_action( 'template_redirect', 'twentyfourteen_content_width' );
</span><span class="cx">
</span><span class="lines">@@ -361,17 +361,19 @@
</span><span class="cx"> continue;
</span><span class="cx"> ?>
</span><span class="cx">
</span><del>- <div class="contributor clear">
- <div class="contributor-avatar"><?php echo get_avatar( $contributor_id, 132 ); ?></div>
- <div class="contributor-summary">
- <h2 class="contributor-name"><?php echo get_the_author_meta( 'display_name', $contributor_id ); ?></h2>
- <p class="contributor-bio">
- <?php echo get_the_author_meta( 'description', $contributor_id ); ?>
- </p>
- <a class="contributor-posts-link" href="<?php echo esc_url( get_author_posts_url( $contributor_id ) ); ?>">
- <?php printf( _n( '%d Article', '%d Articles', $post_count, 'twentyfourteen' ), $post_count ); ?>
- </a>
- </div>
</del><ins>+ <div class="contributor">
+ <div class="contributor-info clear">
+ <div class="contributor-avatar"><?php echo get_avatar( $contributor_id, 132 ); ?></div>
+ <div class="contributor-summary">
+ <h2 class="contributor-name"><?php echo get_the_author_meta( 'display_name', $contributor_id ); ?></h2>
+ <p class="contributor-bio">
+ <?php echo get_the_author_meta( 'description', $contributor_id ); ?>
+ </p>
+ <a class="contributor-posts-link" href="<?php echo esc_url( get_author_posts_url( $contributor_id ) ); ?>">
+ <?php printf( _n( '%d Article', '%d Articles', $post_count, 'twentyfourteen' ), $post_count ); ?>
+ </a>
+ </div><!-- .contributor-summary -->
+ </div><!-- .contributor-info -->
</ins><span class="cx"> </div><!-- .contributor -->
</span><span class="cx">
</span><span class="cx"> <?php
</span><span class="lines">@@ -456,19 +458,21 @@
</span><span class="cx"> * Adds body classes to denote:
</span><span class="cx"> * 1. Single or multiple authors.
</span><span class="cx"> * 2. Index views.
</span><ins>+ * 3. Full-width content layout.
</ins><span class="cx"> *
</span><span class="cx"> * @param array $classes A list of existing body class values.
</span><span class="cx"> * @return array The filtered body class list.
</span><span class="cx"> */
</span><span class="cx"> function twentyfourteen_body_classes( $classes ) {
</span><del>- // Adds a class of group-blog to blogs with more than 1 published author
- if ( is_multi_author() ) {
</del><ins>+ if ( is_multi_author() )
</ins><span class="cx"> $classes[] = 'group-blog';
</span><del>- }
- if ( is_archive() || is_search() || is_home() ) {
</del><ins>+
+ if ( is_archive() || is_search() || is_home() )
</ins><span class="cx"> $classes[] = 'list-view';
</span><del>- }
</del><span class="cx">
</span><ins>+ if ( is_page_template( 'full-width-page.php' ) || is_page_template( 'contributor-page.php' ) || is_attachment() )
+ $classes[] = 'full-width';
+
</ins><span class="cx"> return $classes;
</span><span class="cx"> }
</span><span class="cx"> add_filter( 'body_class', 'twentyfourteen_body_classes' );
</span></span></pre></div>
<a id="trunksrcwpcontentthemestwentyfourteenimagephp"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/image.php (25518 => 25519)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/image.php 2013-09-20 17:45:30 UTC (rev 25518)
+++ trunk/src/wp-content/themes/twentyfourteen/image.php 2013-09-20 18:21:30 UTC (rev 25519)
</span><span class="lines">@@ -6,11 +6,13 @@
</span><span class="cx"> * @subpackage Twenty_Fourteen
</span><span class="cx"> */
</span><span class="cx">
</span><ins>+$metadata = wp_get_attachment_metadata();
+
</ins><span class="cx"> get_header();
</span><span class="cx"> ?>
</span><span class="cx">
</span><span class="cx"> <section id="primary" class="content-area image-attachment">
</span><del>- <div id="content" class="site-content full-width" role="main">
</del><ins>+ <div id="content" class="site-content" role="main">
</ins><span class="cx">
</span><span class="cx"> <?php while ( have_posts() ) : the_post(); ?>
</span><span class="cx">
</span><span class="lines">@@ -19,7 +21,6 @@
</span><span class="cx"> <?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
</span><span class="cx">
</span><span class="cx"> <div class="entry-meta">
</span><del>- <?php $metadata = wp_get_attachment_metadata(); ?>
</del><span class="cx">
</span><span class="cx"> <span class="entry-date"><time class="entry-date" datetime="<?php echo esc_attr( get_the_date( 'c' ) ); ?>"><?php echo esc_html( get_the_date() ); ?></time></span>
</span><span class="cx">
</span><span class="lines">@@ -70,8 +71,10 @@
</span><span class="cx"> </article><!-- #post-## -->
</span><span class="cx">
</span><span class="cx"> <nav id="image-navigation" class="navigation image-navigation">
</span><ins>+ <div class="nav-links">
</ins><span class="cx"> <?php previous_image_link( false, __( '<div class="previous-image">Previous Image</div>', 'twentyfourteen' ) ); ?>
</span><span class="cx"> <?php next_image_link( false, __( '<div class="next-image">Next Image</div>', 'twentyfourteen' ) ); ?>
</span><ins>+ </div><!-- .nav-links -->
</ins><span class="cx"> </nav><!-- #image-navigation -->
</span><span class="cx">
</span><span class="cx"> <?php comments_template(); ?>
</span></span></pre></div>
<a id="trunksrcwpcontentthemestwentyfourteenstylecss"></a>
<div class="modfile"><h4>Modified: trunk/src/wp-content/themes/twentyfourteen/style.css (25518 => 25519)</h4>
<pre class="diff"><span>
<span class="info">--- trunk/src/wp-content/themes/twentyfourteen/style.css 2013-09-20 17:45:30 UTC (rev 25518)
+++ trunk/src/wp-content/themes/twentyfourteen/style.css 2013-09-20 18:21:30 UTC (rev 25519)
</span><span class="lines">@@ -117,29 +117,29 @@
</span><span class="cx"> h1,h2,h3,h4,h5,h6 {
</span><span class="cx"> clear: both;
</span><span class="cx"> font-weight: 700;
</span><del>- margin-bottom: 12px;
- margin-bottom: 1.2rem;
</del><ins>+ margin: 36px 0 12px;
+ margin: 3.6rem 0 1.2rem;
</ins><span class="cx"> }
</span><span class="cx"> h1 {
</span><del>- font-size: 33px;
- font-size: 3.3rem;
- line-height: 1.0909090909;
</del><ins>+ font-size: 26px;
+ font-size: 2.6rem;
+ line-height: 1.3846153846;
</ins><span class="cx"> }
</span><span class="cx"> h2 {
</span><del>- font-size: 30px;
- font-size: 3.0rem;
- line-height: 1.2;
</del><ins>+ font-size: 24px;
+ font-size: 2.4rem;
+ line-height: 1;
</ins><span class="cx"> }
</span><span class="cx"> h3 {
</span><del>- font-size: 26px;
- font-size: 2.6rem;
- line-height: 1.3846153846;
-}
-h4 {
</del><span class="cx"> font-size: 22px;
</span><span class="cx"> font-size: 2.2rem;
</span><span class="cx"> line-height: 1.0909090909;
</span><span class="cx"> }
</span><ins>+h4 {
+ font-size: 20px;
+ font-size: 2.0rem;
+ line-height: 1.2;
+}
</ins><span class="cx"> h5 {
</span><span class="cx"> font-size: 18px;
</span><span class="cx"> font-size: 1.8rem;
</span><span class="lines">@@ -521,17 +521,11 @@
</span><span class="cx"> }
</span><span class="cx"> .site {
</span><span class="cx"> background-color: #fff;
</span><del>- max-width: 1230px;
- max-width: 123.0rem;
</del><ins>+ max-width: 1260px;
</ins><span class="cx"> position: relative;
</span><span class="cx"> }
</span><del>-.site-main {
- max-width: 1230px;
- max-width: 123.0rem;
-}
</del><span class="cx"> .content-area {
</span><del>- padding-top:24px;
- padding-top:2.4rem;
</del><ins>+ padding-top: 24px;
</ins><span class="cx"> }
</span><span class="cx"> #secondary {
</span><span class="cx"> background-color: #000;
</span><span class="lines">@@ -577,8 +571,7 @@
</span><span class="cx">
</span><span class="cx"> .site-header {
</span><span class="cx"> background-color: #000;
</span><del>- max-width: 1230px;
- max-width: 123.0rem;
</del><ins>+ max-width: 1260px;
</ins><span class="cx"> position: relative;
</span><span class="cx"> width: 100%;
</span><span class="cx"> z-index: 3;
</span><span class="lines">@@ -664,9 +657,6 @@
</span><span class="cx"> .search-toggle.active {
</span><span class="cx"> background-color: #35921f;
</span><span class="cx"> }
</span><del>-.search-toggle {
- display: none;
-}
</del><span class="cx"> .search-toggle:hover {
</span><span class="cx"> cursor: pointer;
</span><span class="cx"> }
</span><span class="lines">@@ -794,8 +784,8 @@
</span><span class="cx"> border-bottom: 1px solid rgba(255, 255, 255, 0.4);
</span><span class="cx"> font-size: 14px;
</span><span class="cx"> font-size: 1.4rem;
</span><del>- margin-bottom: 48px;
- margin-bottom: 4.8rem;
</del><ins>+ margin: 0 auto 48px;
+ max-width: 474px;
</ins><span class="cx"> }
</span><span class="cx"> .secondary-navigation a {
</span><span class="cx"> display: block;
</span><span class="lines">@@ -829,8 +819,8 @@
</span><span class="cx">
</span><span class="cx"> /* Mobile Navigations */
</span><span class="cx"> #mobile-navigations {
</span><del>- margin-top: 1px;
- margin-top: 0.1rem;
</del><ins>+ margin: 1px auto 0;
+ max-width: 474px;
</ins><span class="cx"> }
</span><span class="cx"> .mobile-navigation {
</span><span class="cx"> background-color: #000;
</span><span class="lines">@@ -895,6 +885,10 @@
</span><span class="cx"> height: auto;
</span><span class="cx"> z-index: 0;
</span><span class="cx"> }
</span><ins>+.full-width .attachment-featured-thumbnail img {
+ display: block;
+ margin: 0 auto;
+}
</ins><span class="cx"> .entry-header {
</span><span class="cx"> position: relative;
</span><span class="cx"> z-index: 1;
</span><span class="lines">@@ -1016,6 +1010,14 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> /* .content-area specific styles */
</span><ins>+.content-area .entry-header,
+.content-area .entry-content,
+.content-area .page-content,
+.content-area .entry-summary,
+.content-area .entry-meta {
+ margin: 0 auto;
+ max-width: 474px;
+}
</ins><span class="cx"> .content-area .entry-header {
</span><span class="cx"> background-color: #fff;
</span><span class="cx"> padding: 24px 10px 12px;
</span><span class="lines">@@ -1049,9 +1051,9 @@
</span><span class="cx"> padding: 0 10px;
</span><span class="cx"> padding: 0 1.0rem;
</span><span class="cx"> }
</span><del>-.content-area footer.entry-meta .entry-meta {
- margin-bottom: 24px;
- margin-bottom: 2.4rem;
</del><ins>+.content-area footer.entry-meta {
+ margin-bottom: 36px;
+ margin-bottom: 3.6rem;
</ins><span class="cx"> }
</span><span class="cx"> .content-area footer.entry-meta .entry-title {
</span><span class="cx"> font-size: 12px;
</span><span class="lines">@@ -1080,7 +1082,7 @@
</span><span class="cx"> .format-quote .entry-content,
</span><span class="cx"> .format-quote .entry-summary,
</span><span class="cx"> .format-link .entry-content,
</span><del>-.format-link.entry-summary {
</del><ins>+.format-link.entry-summary {
</ins><span class="cx"> padding-top: 0;
</span><span class="cx"> }
</span><span class="cx">
</span><span class="lines">@@ -1101,7 +1103,6 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx"> /* Page specific styles */
</span><del>-.page .entry-header,
</del><span class="cx"> .page .entry-content,
</span><span class="cx"> .error404 .page-header,
</span><span class="cx"> .error404 .page-content,
</span><span class="lines">@@ -1236,10 +1237,8 @@
</span><span class="cx"> }
</span><span class="cx"> .archive-header,
</span><span class="cx"> .page-header {
</span><del>- margin: 0 0 24px;
- margin: 0 0 2.4rem;
- padding: 0 10px;
- padding: 0 1.0rem;
</del><ins>+ margin: 0 auto 12px;
+ max-width: 474px;
</ins><span class="cx"> }
</span><span class="cx"> .archive-title,
</span><span class="cx"> .page-title {
</span><span class="lines">@@ -1273,12 +1272,31 @@
</span><span class="cx"> .front-page-content-wrapper {
</span><span class="cx"> width: 100%;
</span><span class="cx"> }
</span><del>-.front-page-content-area {
- max-width: 1230px;
- max-width: 123.0rem;
</del><ins>+
+
+/* =404 Page
+----------------------------------------------- */
+
+.error404 .page-content .search-form {
+ margin-bottom: 36px;
+ margin-bottom: 3.6rem;
</ins><span class="cx"> }
</span><ins>+.error404 .page-content .widget-title {
+ border-top: 5px solid #000;
+ color: #2b2b2b;
+ padding-top: 7px;
+ padding-top: 0.7rem;
+}
</ins><span class="cx">
</span><span class="cx">
</span><ins>+/* =Full-width Layout
+----------------------------------------------- */
+
+.full-width .hentry {
+ max-width: 100%;
+}
+
+
</ins><span class="cx"> /* =Featured Content
</span><span class="cx"> ----------------------------------------------- */
</span><span class="cx">
</span><span class="lines">@@ -1368,6 +1386,8 @@
</span><span class="cx"> -moz-box-sizing: border-box;
</span><span class="cx"> box-sizing: border-box;
</span><span class="cx"> clear: both;
</span><ins>+ margin: 0 auto;
+ max-width: 494px;
</ins><span class="cx"> padding: 23px 10px 0;
</span><span class="cx"> padding: 2.3rem 1.0rem 0;
</span><span class="cx"> }
</span><span class="lines">@@ -1489,21 +1509,6 @@
</span><span class="cx"> }
</span><span class="cx">
</span><span class="cx">
</span><del>-/* =404 Page
------------------------------------------------ */
-
-.error404 .page-content .search-form {
- margin-bottom: 36px;
- margin-bottom: 3.6rem;
-}
-.error404 .page-content .widget-title {
- border-top: 5px solid #000;
- color: #2b2b2b;
- padding-top: 7px;
- padding-top: 0.7rem;
-}
-
-
</del><span class="cx"> /* =Media
</span><span class="cx"> ----------------------------------------------- */
</span><span class="cx">
</span><span class="lines">@@ -1727,11 +1732,13 @@
</span><span class="cx"> }
</span><span class="cx"> .post-navigation,
</span><span class="cx"> .image-navigation {
</span><del>- border-top: 1px solid rgba(0, 0, 0, 0.1);
- margin: 24px 0 0;
- margin: 2.4rem 0 0;
</del><ins>+ margin: 24px auto;
+ max-width: 474px;
+ padding: 0 10px;
</ins><span class="cx"> }
</span><del>-
</del><ins>+.nav-links {
+ border-top: 1px solid rgba(0, 0, 0, 0.1);
+ }
</ins><span class="cx"> .post-navigation [rel="prev"],
</span><span class="cx"> .post-navigation [rel="next"],
</span><span class="cx"> .image-navigation .previous-image,
</span><span class="lines">@@ -1741,8 +1748,7 @@
</span><span class="cx"> -moz-box-sizing: border-box;
</span><span class="cx"> box-sizing: border-box;
</span><span class="cx"> float: none;
</span><del>- padding: 11px 10px;
- padding: 1.1rem 1.0rem;
</del><ins>+ padding: 11px 0;
</ins><span class="cx"> text-align: left;
</span><span class="cx"> width: 100%;
</span><span class="cx"> }
</span><span class="lines">@@ -1780,8 +1786,6 @@
</span><span class="cx"> line-height: 2;
</span><span class="cx"> margin-bottom: 48px;
</span><span class="cx"> margin-bottom: 4.8rem;
</span><del>- padding-left: 10px;
- padding-left: 1.0rem;
</del><span class="cx"> text-transform: uppercase;
</span><span class="cx"> }
</span><span class="cx"> .comment-navigation .nav-previous,
</span><span class="lines">@@ -1802,8 +1806,12 @@
</span><span class="cx"> ----------------------------------------------- */
</span><span class="cx">
</span><span class="cx"> .comments-area {
</span><del>- margin-top: 36px;
- margin-top: 3.6rem;
</del><ins>+ margin: 36px auto;
+ margin: 3.6rem auto;
+ max-width: 474px;
+ max-width: 47.4rem;
+ padding: 0 10px;
+ padding: 0 1.0rem;
</ins><span class="cx"> }
</span><span class="cx"> .comments-title,
</span><span class="cx"> .comment-reply-title {
</span><span class="lines">@@ -1812,14 +1820,10 @@
</span><span class="cx"> font-weight: 900;
</span><span class="cx"> line-height: 1.5;
</span><span class="cx"> margin-bottom: 0;
</span><del>- padding: 0 10px;
- padding: 0 1.0rem;
</del><span class="cx"> text-transform: uppercase;
</span><span class="cx"> }
</span><span class="cx"> .comment-form {
</span><span class="cx"> background: #fff;
</span><del>- padding: 0 10px;
- padding: 0 1.0rem;
</del><span class="cx"> }
</span><span class="cx"> .comment-list {
</span><span class="cx"> list-style: none;
</span><span class="lines">@@ -1864,8 +1868,7 @@
</span><span class="cx"> border-top: 1px solid rgba(0, 0, 0, 0.1);
</span><span class="cx"> margin-bottom: 24px;
</span><span class="cx"> margin-bottom: 2.4rem;
</span><del>- padding: 24px 10px 0;
- padding: 2.4rem 1.0rem 0;
</del><ins>+ padding-top: 24px;
</ins><span class="cx"> }
</span><span class="cx"> .comment-list li:first-child article {
</span><span class="cx"> border: none;
</span><span class="lines">@@ -1945,8 +1948,7 @@
</span><span class="cx"> }
</span><span class="cx"> .comment-list .children {
</span><span class="cx"> list-style: none;
</span><del>- margin-left: 20px;
- margin-left: 2.0rem;
</del><ins>+ margin-left: 18px;
</ins><span class="cx"> }
</span><span class="cx"> .comments-area .children article {
</span><span class="cx"> border: none;
</span><span class="lines">@@ -1977,10 +1979,6 @@
</span><span class="cx"> padding: 0 1.0rem;
</span><span class="cx"> text-transform: uppercase;
</span><span class="cx"> }
</span><del>-.comment-form {
- padding: 0 10px;
- padding: 0 1.0rem;
-}
</del><span class="cx"> .comment-form label {
</span><span class="cx"> display: block;
</span><span class="cx"> }
</span><span class="lines">@@ -1994,6 +1992,7 @@
</span><span class="cx"> margin-bottom: 0;
</span><span class="cx"> }
</span><span class="cx">
</span><ins>+
</ins><span class="cx"> /* =Primary Sidebar
</span><span class="cx"> ----------------------------------------------- */
</span><span class="cx">
</span><span class="lines">@@ -2035,8 +2034,8 @@
</span><span class="cx"> color: #fff;
</span><span class="cx"> }
</span><span class="cx"> .widget {
</span><del>- margin: 0 0 48px;
- margin: 0 0 4.8rem;
</del><ins>+ margin: 0 auto 48px;
+ max-width: 474px;
</ins><span class="cx"> overflow: hidden;
</span><span class="cx"> }
</span><span class="cx"> .widget ul,
</span><span class="lines">@@ -2328,33 +2327,28 @@
</span><span class="cx"> border-bottom: 1px solid rgba(0, 0, 0, 0.1);
</span><span class="cx"> -moz-box-sizing: border-box;
</span><span class="cx"> box-sizing: border-box;
</span><del>- padding: 48px 0;
- padding: 4.8rem 0;
</del><ins>+ padding: 48px 10px;
</ins><span class="cx"> }
</span><ins>+.contributor-info {
+ margin: 0 auto;
+ max-width: 474px;
+}
</ins><span class="cx"> .contributor-avatar {
</span><span class="cx"> float: left;
</span><span class="cx"> padding: 2px;
</span><span class="cx"> padding: 0.2rem;
</span><span class="cx"> border: 1px solid rgba(0, 0, 0, 0.1);
</span><del>- margin-right: 30px;
- margin-right: 3.0rem;
</del><ins>+ margin: 0 30px 20px 0;
</ins><span class="cx"> }
</span><span class="cx"> .contributor-avatar .avatar {
</span><span class="cx"> vertical-align: middle;
</span><span class="cx"> }
</span><del>-.contributor-summary {
- float: left;
- max-width: 474px;
- max-width: 47.4rem;
- width: -webkit-calc(100% - 164px);
- width: calc(100% - 164px);
-}
</del><span class="cx"> .contributor-name {
</span><span class="cx"> font-size: 16px;
</span><span class="cx"> font-size: 1.6rem;
</span><span class="cx"> font-weight: 900;
</span><span class="cx"> line-height: 1.5;
</span><del>- margin-bottom: 0;
</del><ins>+ margin: 0;
</ins><span class="cx"> text-transform: uppercase;
</span><span class="cx"> }
</span><span class="cx"> .contributor-bio {
</span><span class="lines">@@ -2365,7 +2359,7 @@
</span><span class="cx"> }
</span><span class="cx"> .contributor-posts-link:before {
</span><span class="cx"> content: '\f443';
</span><del>- vertical-align: text-bottom;
</del><ins>+ margin: -3px 5px -2px -3px;
</ins><span class="cx"> }
</span><span class="cx">
</span><span class="cx">
</span><span class="lines">@@ -2437,10 +2431,20 @@
</span><span class="cx"> .list-view .content-area .format-link .entry-title {
</span><span class="cx"> display: block;
</span><span class="cx"> }
</span><ins>+ .archive-header,
+ .page-header {
+ border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+ padding-top: 12px;
+ padding-top: 1.2rem;
+ }
+ .error404 .page-header {
+ border-bottom: 0;
+ padding: 0 10px;
+ padding: 0 1.0rem;
+ }
</ins><span class="cx"> }
</span><span class="cx">
</span><del>-/* Enable Genricons */
-@media screen and (min-width: 400px) {
</del><ins>+@media screen and (min-width: 401px) {
</ins><span class="cx"> .attachment-featured-thumbnail:hover img {
</span><span class="cx"> opacity: 0.8;
</span><span class="cx"> }
</span><span class="lines">@@ -2452,11 +2456,10 @@
</span><span class="cx"> .parent-post-link:before {
</span><span class="cx"> content: '';
</span><span class="cx"> }
</span><del>-
</del><span class="cx"> .content-area .featured-post:before,
</span><span class="cx"> .content-area .post-format a:before,
</span><span class="cx"> .content-area .post-format + .entry-date a:before,
</span><del>- .content-area .entry-date a:before,
</del><ins>+ .attachment span.entry-date:before,
</ins><span class="cx"> .content-area .byline a:before,
</span><span class="cx"> .content-area .comments-link a:before,
</span><span class="cx"> .entry-meta .edit-link a:before,
</span><span class="lines">@@ -2506,7 +2509,7 @@
</span><span class="cx"> }
</span><span class="cx"> .content-area .post-format + .entry-date a:before,
</span><span class="cx"> .content-area .entry-date a:before,
</span><del>- .attachment .entry-date:before {
</del><ins>+ .attachment span.entry-date:before {
</ins><span class="cx"> content: '\F303';
</span><span class="cx"> margin: 0 1px 0 0;
</span><span class="cx"> margin: 0 0.1rem 0 0;
</span><span class="lines">@@ -2532,42 +2535,70 @@
</span><span class="cx"> .content-area .parent-post-link a:before {
</span><span class="cx"> content: '\F301';
</span><span class="cx"> }
</span><del>- .page .entry-meta .edit-link a:before {
- margin: 5px 2px 0 0;
- margin: 0.5rem 0.2rem 0 0;
</del><ins>+ .archive-header,
+ .page-header {
+ margin-bottom: 24px;
+ padding: 0 10px;
</ins><span class="cx"> }
</span><ins>+ .search-results .content-area .type-page {
+ border-top: 1px solid rgba(0, 0, 0, 0.1);
+ }
+ .search-results .content-area .type-page .entry-header {
+ margin-top: 24px;
+ }
</ins><span class="cx"> }
</span><span class="cx">
</span><del>-/* Post formatted posts and post list start to appear on the right */
-@media screen and (min-width: 672px) {
- .search-toggle {
- display: block;
</del><ins>+@media screen and (min-width: 642px) {
+ .content-area .entry-header {
+ margin-top: -48px;
+ padding-right: 30px;
+ padding-left: 30px;
</ins><span class="cx"> }
</span><ins>+ .attachment .content-area .entry-header {
+ margin-top: 0;
+ }
+}
+
+@media screen and (min-width: 673px) {
</ins><span class="cx"> .content-area {
</span><span class="cx"> float: left;
</span><del>- padding: 36px 0;
- padding: 3.6rem 0;
</del><ins>+ padding-top: 36px;
</ins><span class="cx"> width: 100%;
</span><span class="cx"> }
</span><span class="cx"> .site-content {
</span><del>- margin: 0 33.33333333% 0 0;
</del><ins>+ margin-right: 33.33333333%;
</ins><span class="cx"> }
</span><del>- .content-sidebar {
</del><ins>+ .content-area .entry-header {
+ margin-top: 0;
+ }
+ .content-area .entry-content,
+ .content-area .entry-summary,
+ .content-area footer.entry-meta,
+ .archive-header,
+ .page-header,
+ .page-content,
+ .post-navigation,
+ .image-navigation,
+ .comments-area {
+ padding-right: 30px;
+ padding-right: 3.0rem;
+ padding-left: 30px;
+ padding-left: 3.0rem;
+ }
+ .content-sidebar,
+ .ephemera {
</ins><span class="cx"> float: right;
</span><del>- margin: 0 0 0 -30.35714285%;
- padding: 36px 10px 24px 0;
- padding: 3.6rem 1.0rem 2.4rem 0;
- width: 30.35714285%;
</del><ins>+ margin-left: -33.33333333%;
+ padding: 36px 30px 24px;
+ width: 33.33333333%;
</ins><span class="cx"> }
</span><span class="cx"> .ephemera {
</span><span class="cx"> border: none;
</span><span class="cx"> clear: none;
</span><del>- float: right;
- margin: 0 0 0 -30.35714285%;
- padding: 36px 10px 0 0;
- padding: 3.6rem 1.0rem 0 0;
- width: 30.35714285%;
</del><span class="cx"> }
</span><ins>+ #secondary {
+ padding: 48px 30px 0;
+ }
</ins><span class="cx"> #featured-content .hentry {
</span><span class="cx"> float: left;
</span><span class="cx"> width: 50%;
</span><span class="lines">@@ -2579,57 +2610,67 @@
</span><span class="cx"> height: 96px;
</span><span class="cx"> height: 9.6rem;
</span><span class="cx"> }
</span><del>- .full-width.site-content {
- margin: 0;
</del><ins>+ .full-width .site-content {
+ margin-right: 0;
</ins><span class="cx"> }
</span><del>- .full-width.site-content .hentry {
- max-width: 100%;
</del><ins>+}
+
+@media screen and (min-width: 770px) {
+ .header-main {
+ margin-right: 0;
</ins><span class="cx"> }
</span><ins>+ .primary-navigation {
+ display: block;
+ }
</ins><span class="cx"> }
</span><span class="cx">
</span><del>-@media screen and (min-width: 740px) {
- .content-area .entry-header {
- margin: -48px 4.59183673% 0;
- margin: -4.8rem 4.59183673% 0;
- padding: 24px 4.46428571% 12px;
- padding: 2.4rem 4.46428571% 1.2rem;
</del><ins>+@media screen and (min-width: 810px) {
+ .full-width .entry-content img.size-medium.alignleft,
+ .full-width .entry-content img.size-large.alignleft,
+ .full-width .entry-content img.size-full.alignleft,
+ .full-width .entry-content .wp-caption.alignleft,
+ .full-width .entry-content blockquote.alignleft {
+ margin-left: -168px;
</ins><span class="cx"> }
</span><del>- .content-area .entry-content,
- .content-area .entry-summary {
- margin: 0 4.59183673%;
- padding: 12px 4.46428571% 0;
- padding: 1.2rem 4.46428571% 0;
</del><ins>+ .full-width .entry-content img.size-medium.alignright,
+ .full-width .entry-content img.size-large.alignright,
+ .full-width .entry-content img.size-full.alignright,
+ .full-width .entry-content .wp-caption.alignright,
+ .full-width .entry-content blockquote.alignright {
+ margin-right: -168px;
</ins><span class="cx"> }
</span><del>- .content-area footer.entry-meta {
- margin: 12px 4.59183673% 24px;
- margin: 1.2rem 4.59183673% 2.4rem;
- padding: 0 4.46428571%;
</del><ins>+ .full-width .entry-content img.size-full.alignnone,
+ .single-attachment .entry-content .attachment {
+ margin-right: -168px;
+ margin-left: -168px;
+ max-width: 810px;
</ins><span class="cx"> }
</span><del>- .archive-header,
- .page-header {
- margin: 0 4.59183673% 24px;
- margin: 0 4.59183673% 2.4rem;
- padding: 0 4.46428571%;
</del><ins>+ .single-attachment .entry-content .attachment {
+ text-align: center;
</ins><span class="cx"> }
</span><del>- .page .content-area .entry-header,
- .error404 .content-area .page-header {
- margin: 0 4.59183673%;
- padding: 0 4.46428571% 12px;
- padding: 0 4.46428571% 1.2rem;
</del><ins>+ .full-width .entry-content blockquote.alignleft,
+ .full-width .entry-content blockquote.alignright {
+ width: -webkit-calc(50% + 130px);
+ width: calc(50% + 130px);
</ins><span class="cx"> }
</span><del>- .content-area .full-width .entry-header {
- margin: 0 6.04307432%;
- padding: 0 0 12px;
- padding: 0 0 1.2rem;
</del><ins>+ .contributor-avatar {
+ margin-left: -168px;
</ins><span class="cx"> }
</span><del>- .content-area .full-width .entry-content {
- margin: 0 6.04307432%;
- padding: 0;
</del><ins>+ .contributor-summary {
+ float: left
</ins><span class="cx"> }
</span><del>- .content-area .full-width footer.entry-meta {
- margin: 0 6.04307432%;
- padding: 0;
</del><ins>+}
+
+@media screen and (min-width: 870px) {
+ .content-area {
+ padding-top: 72px;
</ins><span class="cx"> }
</span><ins>+ .home .content-area {
+ padding-top: 36px;
+ }
+ .content-area .entry-header {
+ margin-top: -48px;
+ }
</ins><span class="cx"> .content-area .format-aside .entry-header,
</span><span class="cx"> .content-area .format-quote .entry-header,
</span><span class="cx"> .content-area .format-link .entry-header,
</span><span class="lines">@@ -2654,107 +2695,23 @@
</span><span class="cx"> padding-top: 3.6rem;
</span><span class="cx"> }
</span><span class="cx"> .comment-author .avatar {
</span><del>- width: 42px;
- width: 4.2rem;
- height: 42px;
- height: 4.2rem;
</del><ins>+ top: 2px;
+ width: 34px;
+ height: 34px;
</ins><span class="cx"> }
</span><span class="cx"> .comment-author,
</span><span class="cx"> .comment-metadata,
</span><span class="cx"> .comment-content,
</span><span class="cx"> .comment-list .reply {
</span><del>- padding-left: 60px;
- padding-left: 6.0rem;
</del><ins>+ padding-left: 54px;
</ins><span class="cx"> }
</span><del>- .comments-title,
- .no-comments,
- .comment-respond,
- .comments-area article,
- .comment-list .trackback,
- .comment-list .pingback,
- .post-navigation [rel="prev"],
- .post-navigation [rel="next"] {
- padding-right: 9.12778904%;
- padding-left: 9.12778904%;
</del><ins>+ .comment-list .children {
+ margin-left: 37px;
</ins><span class="cx"> }
</span><del>- .comment-reply-title,
- .comment-form {
- padding: 0;
- }
- .comment-navigation {
- padding-left: 9.12778904%;
- }
</del><span class="cx"> .comment .comment-respond {
</span><span class="cx"> margin-left: 60px;
</span><span class="cx"> margin-left: 6.0rem;
</span><span class="cx"> }
</span><del>- .image-navigation .previous-image,
- .image-navigation .next-image,
- .full-width .comment-navigation,
- .full-width .comments-title,
- .full-width .comment-respond,
- .full-width .comments-area article,
- .full-width .comment-list .trackback,
- .full-width .comment-list .pingback {
- padding-right: 6.04307432%;
- padding-left: 6.04307432%;
- }
- .full-width .comment-reply-title,
- .full-width .comment-form {
- padding: 0;
- }
- .content-area .no-results .entry-header {
- margin: 0 4.59183673%;
- padding: 0 4.46428571%;
- }
-}
-
-@media screen and (min-width: 770px) {
- .header-main {
- margin-right: 0;
- }
- .primary-navigation {
- display: block;
- }
-}
-
-@media screen and (min-width: 870px) {
- .content-area {
- padding-top: 72px;
- padding-top: 7.2rem;
- }
- .home .content-area {
- padding-top: 36px;
- padding-top: 3.6rem;
- }
- .content-area .entry-header {
- margin-right: 8.03571428%;
- margin-left: 12.5%;
- }
- .content-area .entry-content,
- .content-area .entry-summary {
- margin-right: 8.03571428%;
- margin-left: 12.5%;
- }
- .content-area footer.entry-meta {
- margin: 12px 8.03571428% 24px 12.5%;
- margin: 1.2rem 8.03571428% 2.4rem 12.5%;
- }
- .page .content-area .entry-header,
- .error404 .content-area .page-header {
- margin: 0 8.03571428% 0 12.5%;
- }
- .contributor,
- .content-area .full-width .entry-header,
- .content-area .full-width .entry-content,
- .content-area .full-width footer.entry-meta {
- margin: 0 11.30926724%;
- }
- .archive-header,
- .page-header {
- margin: 0 8.03571428% 24px 12.5%;
- margin: 0 8.03571428% 2.4rem 12.5%;
- }
</del><span class="cx"> .content-sidebar {
</span><span class="cx"> padding-top: 72px;
</span><span class="cx"> padding-top: 7.2rem;
</span><span class="lines">@@ -2768,64 +2725,42 @@
</span><span class="cx"> #featured-content .hentry:nth-child( 3n+1 ) {
</span><span class="cx"> clear: both;
</span><span class="cx"> }
</span><del>- .comments-title,
- .no-comments,
- .comment-respond,
- .post-navigation [rel="prev"],
- .post-navigation [rel="next"] {
- padding-right: 12.39493534%;
- padding-left: 17.06896551%;
</del><ins>+}
+
+@media screen and (min-width: 1008px) {
+ .header-main {
+ padding-left: 27px;
</ins><span class="cx"> }
</span><del>- .comments-area article,
- .comment-list .trackback,
- .comment-list .pingback {
- padding-right: 11.25%;
- padding-left: 15.46875%;
</del><ins>+ .search-box-wrapper {
+ padding-left: 182px;
</ins><span class="cx"> }
</span><del>- .comment-respond {
- padding-right: 13.8900862%;
</del><ins>+ .site-content {
+ margin: 0 29.04761904% 0 182px;
</ins><span class="cx"> }
</span><del>- .comment .comment-respond {
- margin-left: 50px;
- margin-left: 5.0rem;
</del><ins>+ .content-sidebar,
+ .ephemera {
+ margin-left: -29.04761904%;
+ width: 29.04761904%;
</ins><span class="cx"> }
</span><del>- .comment-list,
- .full-width .comment-list {
- margin-left: -60px;
- margin-left: -6.0rem;
</del><ins>+ .content-area .entry-header {
+ margin-top: 0;
</ins><span class="cx"> }
</span><del>- .comment-navigation {
- padding-left: 17.06896551%;
</del><ins>+ .content-area .entry-header
+ .content-area .entry-content,
+ .content-area .entry-summary,
+ .content-area footer.entry-meta,
+ .archive-header,
+ .page-header,
+ .page-content,
+ .post-navigation,
+ .image-navigation,
+ .comments-area {
+ padding-right: 0;
+ padding-left: 0;
</ins><span class="cx"> }
</span><del>- .image-navigation .previous-image,
- .image-navigation .next-image,
- .full-width .comment-navigation,
- .full-width .comments-title,
- .full-width .comment-respond,
- .full-width .comments-area article,
- .full-width .comment-list .trackback,
- .full-width .comment-list .pingback {
- padding-right: 11.30926724%;
- padding-left: 11.30926724%;
</del><ins>+ .site-footer {
+ padding-left: 27px;
</ins><span class="cx"> }
</span><del>- .site-content blockquote.alignleft {
- margin-left: -20%;
- }
- .site-content blockquote.alignright {
- margin-right: -20%;
- }
- .content-area .no-results .entry-header {
- margin-right: 8.03571428%;
- margin-left: 12.5%;
- }
- .content-area .no-results .entry-content {
- margin-right: 8.03571428%;
- margin-left: 12.5%;
- }
-}
-
-/* Secondary starts appear on the left */
-@media screen and (min-width: 1008px) {
</del><span class="cx"> .site:before {
</span><span class="cx"> background-color: #000;
</span><span class="cx"> content: '';
</span><span class="lines">@@ -2835,34 +2770,20 @@
</span><span class="cx"> position: absolute;
</span><span class="cx"> top: 0;
</span><span class="cx"> left: 0;
</span><del>- width: 222px;
- width: 22.2rem;
</del><ins>+ width: 182px;
</ins><span class="cx"> z-index: 2;
</span><span class="cx"> }
</span><del>- .header-main {
- padding-left: 27px;
- padding-left: 2.7rem;
- }
- .search-box-wrapper {
- padding-left: 222px;
- padding-left: 22.2rem;
- }
- .site-content {
- margin: 0 27.31707317% 0 222px;
- margin: 0 27.31707317% 0 22.2rem;
- }
</del><span class="cx"> #secondary {
</span><span class="cx"> background-color: transparent;
</span><span class="cx"> border-bottom: 0;
</span><span class="cx"> clear: none;
</span><del>- font-size: 1.1rem;
</del><ins>+ font-size: 11px;
</ins><span class="cx"> float: left;
</span><span class="cx"> line-height: 1.6363636363;
</span><span class="cx"> margin: 0 0 0 -100%;
</span><span class="cx"> padding: 0 27px;
</span><span class="cx"> padding: 0 2.7rem;
</span><del>- width: 168px;
- width: 16.8rem;
</del><ins>+ width: 128px;
</ins><span class="cx"> }
</span><span class="cx"> .site-description {
</span><span class="cx"> display: block;
</span><span class="lines">@@ -2870,49 +2791,6 @@
</span><span class="cx"> margin: -3px 0 21px;
</span><span class="cx"> margin: -0.3rem 0 2.1rem;
</span><span class="cx"> }
</span><del>- .front-page-content-wrapper {
- float: left;
- }
- .site-content {
- margin: 0 27.31707317% 0 222px;
- margin: 0 27.31707317% 0 22.2rem;
- }
- .content-sidebar,
- .ephemera {
- margin: 0 0 0 -27.31707317%;
- width: 24.87804878%;
- }
- .content-area .entry-header {
- margin: -48px 4.59183673% 0;
- margin: -4.8rem 4.59183673% 0;
- padding: 24px 4.46428571% 12px;
- padding: 2.4rem 4.46428571% 1.2rem;
- }
- .content-area .entry-content,
- .content-area .page-content,
- .content-area .entry-summary {
- margin: 0 4.59183673%;
- padding: 12px 4.46428571% 0;
- padding: 1.2rem 4.46428571% 0;
- }
- .content-area footer.entry-meta {
- margin: 12px 4.59183673% 24px;
- margin: 1.2rem 4.59183673% 2.4rem;
- padding: 0 4.46428571%;
- }
- .archive-header,
- .page-header {
- margin: 0 4.59183673% 24px;
- margin: 0 4.59183673% 2.4rem;
- }
- #featured-content {
- padding-left: 222px;
- padding-left: 22.2rem;
- }
- .site-footer {
- padding-left: 27px;
- padding-left: 2.7rem;
- }
</del><span class="cx"> .secondary-navigation {
</span><span class="cx"> border-bottom: 1px solid rgba(255, 255, 255, 0.2);
</span><span class="cx"> font-size: 11px;
</span><span class="lines">@@ -2937,10 +2815,8 @@
</span><span class="cx"> position: absolute;
</span><span class="cx"> top: -1px;
</span><span class="cx"> top: -0.1rem;
</span><del>- left: 168px;
- left: 16.8rem;
- width: 168px;
- width: 16.8rem;
</del><ins>+ left: 128px;
+ width: 128px;
</ins><span class="cx"> z-index: 9999;
</span><span class="cx"> }
</span><span class="cx"> .secondary-navigation ul li:hover {
</span><span class="lines">@@ -2949,66 +2825,6 @@
</span><span class="cx"> .secondary-navigation ul li:hover > ul {
</span><span class="cx"> display: block;
</span><span class="cx"> }
</span><del>- .page .content-area .entry-header,
- .error404 .content-area .page-header {
- margin: 0 4.59183673%;
- padding: 0 4.46428571% 12px;
- padding: 0 4.46428571% 1.2rem;
- }
- .full-width.site-content {
- margin-left: 222px;
- margin-left: 22.2rem;
- }
- .content-area .full-width .entry-header {
- padding: 0 0 12px;
- padding: 0 0 1.2rem;
- }
- .contributor,
- .content-area .full-width .entry-header,
- .content-area .full-width .entry-content,
- .content-area .full-width .page-content,
- .content-area .full-width footer.entry-meta {
- margin: 0 5.882236%;
- }
- .comments-title,
- .no-comments,
- .comment-respond,
- .comments-area article,
- .comment-list .trackback,
- .comment-list .pingback,
- .post-navigation [rel="prev"],
- .post-navigation [rel="next"] {
- padding-right: 9.87001616%;
- padding-left: 9.19765166%;
- }
- .comment-list,
- .full-width .comment-list {
- margin-left: 0;
- }
- .comment-navigation {
- padding-left: 9.19765166%;
- }
- .comment .comment-respond {
- margin-left: 60px;
- margin-left: 6.0rem;
- }
- .image-navigation .previous-image,
- .image-navigation .next-image,
- .full-width .comment-navigation,
- .full-width .comments-title,
- .full-width .comment-respond,
- .full-width .comments-area article,
- .full-width .comment-list .trackback,
- .full-width .comment-list .pingback {
- padding-right: 5.882236%;
- padding-left: 5.882236%;
- }
- .site-content blockquote.alignleft {
- margin-left: 0;
- }
- .site-content blockquote.alignright {
- margin-right: 0;
- }
</del><span class="cx"> #secondary .widget,
</span><span class="cx"> #supplementary .widget {
</span><span class="cx"> margin-bottom: 48px;
</span><span class="lines">@@ -3030,117 +2846,106 @@
</span><span class="cx"> padding-right: 0;
</span><span class="cx"> padding-left: 0;
</span><span class="cx"> }
</span><del>-
</del><ins>+ .front-page-content-wrapper {
+ float: left;
+ }
+ .featured-content {
+ padding-left: 182px;
+ }
</ins><span class="cx"> }
</span><span class="cx">
</span><del>-@media screen and (min-width: 1150px) {
</del><ins>+@media screen and (min-width: 1040px) {
</ins><span class="cx"> .content-area .entry-header {
</span><del>- margin: -48px 8.03571428% 0 12.5%;
- margin: -4.8rem 8.03571428% 0 12.5%;
</del><ins>+ margin-top: -48px;
</ins><span class="cx"> }
</span><ins>+ .content-area .entry-header,
</ins><span class="cx"> .content-area .entry-content,
</span><del>- .content-area .page-content,
- .content-area .entry-summary {
- margin: 0 8.03571428% 0 12.5%;
</del><ins>+ .content-area .entry-summary,
+ .content-area footer.entry-meta,
+ .archive-header,
+ .page-header,
+ .page-content,
+ .post-navigation,
+ .image-navigation,
+ .comments-area {
+ padding-right: 15px;
+ padding-left: 15px;
</ins><span class="cx"> }
</span><del>- .content-area footer.entry-meta {
- margin: 12px 8.03571428% 24px 12.5%;
- margin: 1.2rem 8.03571428% 2.4rem 12.5%;
</del><ins>+}
+
+@media screen and (min-width: 1080px) {
+ .site:before {
+ width: 222px;
</ins><span class="cx"> }
</span><del>- .comments-title,
- .no-comments,
- .comment-respond,
- .post-navigation [rel="prev"],
- .post-navigation [rel="next"] {
- padding-right: 12.44146986%;
- padding-left: 16.77524429%;
</del><ins>+ .search-box-wrapper,
+ .featured-content {
+ padding-left: 222px;
</ins><span class="cx"> }
</span><del>- .comments-area article,
- .comment-list .trackback,
- .comment-list .pingback {
- padding-right: 11.27596439%;
- padding-left: 15.2818991%;
</del><ins>+ .site-content {
+ margin-left: 222px;
</ins><span class="cx"> }
</span><del>- .comment-respond {
- padding-right: 13.73697916%;
</del><ins>+ #secondary,
+ .secondary-navigation ul ul {
+ width: 168px;
</ins><span class="cx"> }
</span><del>- .comment .comment-respond {
- margin-left: 50px;
- margin-left: 5.0rem;
</del><ins>+ .secondary-navigation ul ul {
+ left: 168px;
</ins><span class="cx"> }
</span><del>- .comment-list,
- .full-width .comment-list {
- margin-left: -60px;
- margin-left: -6.0rem;
</del><ins>+}
+
+@media screen and (min-width: 1110px) {
+ .content-area .entry-header,
+ .content-area .entry-content,
+ .content-area .entry-summary,
+ .content-area footer.entry-meta,
+ .archive-header,
+ .page-header,
+ .page-content,
+ .post-navigation,
+ .image-navigation,
+ .comments-area {
+ padding-right: 30px;
+ padding-left: 30px;
</ins><span class="cx"> }
</span><del>- .comment-navigation {
- padding-left: 16.77524429%;
- }
</del><ins>+}
+
+@media screen and (min-width: 1218px) {
+ .content-area .entry-header,
+ .content-area .entry-content,
+ .content-area .entry-summary,
+ .content-area footer.entry-meta,
</ins><span class="cx"> .archive-header,
</span><del>- .page-header {
- margin: 0 8.03571428% 24px 12.5%;
- margin: 0 8.03571428% 2.4rem 12.5%;
</del><ins>+ .page-header,
+ .page-content,
+ .post-navigation,
+ .image-navigation,
+ .comments-area {
+ margin-right: 54px;
</ins><span class="cx"> }
</span><del>- .page .content-area .entry-header,
- .error404 .content-area .page-header {
- margin: 0 8.03571428% 0 12.5%;
</del><ins>+ .full-width .content-area .entry-header,
+ .full-width .content-area .entry-content,
+ .full-width .content-area .entry-summary,
+ .full-width .content-area footer.entry-meta,
+ .full-width .archive-header,
+ .full-width .page-header,
+ .full-width .page-content,
+ .full-width .post-navigation,
+ .full-width .image-navigation,
+ .full-width .comments-area {
+ margin-right: auto;
</ins><span class="cx"> }
</span><del>- .contributor,
- .content-area .full-width .entry-header,
- .content-area .full-width .entry-content,
- .content-area .full-width .page-content,
- .content-area .full-width footer.entry-meta {
- margin: 0 11.21868265%;
- }
- .image-navigation .previous-image,
- .image-navigation .next-image,
- .full-width .comment-navigation,
- .full-width .comments-title,
- .full-width .comment-respond,
- .full-width .comments-area article,
- .full-width .comment-list .trackback,
- .full-width .comment-list .pingback {
- padding-right: 11.21868265%;
- padding-left: 11.21868265%;
- }
- .content-area .entry-content .wp-caption.alignleft .wp-caption-text {
- padding-left: 10px;
- padding-left: 1.0rem;
- }
- .site-content blockquote.alignleft {
- margin-left: -20%;
- }
- .site-content blockquote.alignright {
- margin-right: -20%;
- }
</del><span class="cx"> }
</span><span class="cx">
</span><del>-@media screen and (min-width: 1230px) {
- .site,
- .site-header,
- .home .site-main {
- max-width: 1260px;
- max-width: 126.0rem;
</del><ins>+@media screen and (min-width: 1260px) {
+ .entry-content blockquote.alignleft,
+ .entry-content blockquote.alignright {
+ width: -webkit-calc(50% + 18px);
+ width: calc(50% + 18px);
</ins><span class="cx"> }
</span><del>- .content-sidebar,
- .ephemera {
- padding-right: 0;
</del><ins>+ .entry-content blockquote.alignleft {
+ margin-left: -18%;
</ins><span class="cx"> }
</span><del>- .contributor,
- .content-area .full-width .entry-header,
- .content-area .full-width .entry-content,
- .content-area .full-width .page-content,
- .content-area .full-width footer.entry-meta {
- margin: 0 0 0 11.21868265%;
</del><ins>+ .entry-content blockquote.alignright {
+ margin-right: -18%;
</ins><span class="cx"> }
</span><del>- .image-navigation .previous-image,
- .image-navigation .next-image,
- .full-width .comment-navigation,
- .full-width .comments-title,
- .full-width .comment-respond,
- .full-width .comments-area article,
- .full-width .comment-list .trackback,
- .full-width .comment-list .pingback {
- padding-right: 0;
- }
</del><span class="cx"> }
</span><span class="cx">\ No newline at end of file
</span></span></pre>
</div>
</div>
</body>
</html>