Changeset 25971

Timestamp:

10/28/2013 05:57:57 PM (11 years ago)

Author:

lancewillett

Message:

Twenty Fourteen: clean up post thumbnail naming. Props iamtakashi, fixes #25718.

Location:

trunk/src/wp-content/themes/twentyfourteen

Files:

• content-featured-post.php (modified) (2 diffs)
• functions.php (modified) (5 diffs)
• inc/template-tags.php (modified) (2 diffs)
• rtl.css (modified) (1 diff)
• style.css (modified) (17 diffs)

trunk/src/wp-content/themes/twentyfourteen/content-featured-post.php

@@ -13 +13 @@
         <?php
             if ( has_post_thumbnail() ) :
-                the_post_thumbnail( 'featured-thumbnail-featured' );
+                the_post_thumbnail( 'post-thumbnail-grid' );
 
             else :
@@ -27 +27 @@
                 if ( $images ) :
                     $image = array_shift( $images );
-                    echo wp_get_attachment_image( $image->ID, 'featured-thumbnail-featured' );
+                    echo wp_get_attachment_image( $image->ID, 'post-thumbnail-grid' );
                 endif;
             endif;

trunk/src/wp-content/themes/twentyfourteen/functions.php

@@ -69 +69 @@
 
     // Add several sizes for Post Thumbnails.
-    add_image_size( 'featured-thumbnail-large', 672, 0 );
-    add_image_size( 'featured-thumbnail-featured', 672, 372, true );
-    add_image_size( 'featured-thumbnail-formatted', 306, 0 );
+    add_image_size( 'post-thumbnail-grid', 672, 372, true );
+    add_image_size( 'post-thumbnail', 672, 0 );
 
     // This theme uses wp_nav_menu() in two locations.
@@ -362 +361 @@
  * Adds body classes to denote:
  * 1. Single or multiple authors.
- * 2. Index views.
- * 3. Full-width content layout.
- * 4. Presence of footer widgets.
+ * 2. Presense of header image.
+ * 3. Index views.
+ * 4. Full-width content layout.
+ * 5. Presence of footer widgets.
+ * 6. Single views.
  *
  * @since Twenty Fourteen 1.0
@@ -392 +393 @@
         $classes[] = 'footer-widgets';
 
+    if ( is_singular() )
+        $classes[] = 'singular';
+
     return $classes;
 }
@@ -400 +404 @@
  *
  * Adds a post class to denote:
- * Non-password protected page with a featured image.
+ * Non-password protected page with a post thumbnail.
  *
  * @since Twenty Fourteen 1.0
@@ -409 +413 @@
 function twentyfourteen_post_classes( $classes ) {
     if ( ! post_password_required() && has_post_thumbnail() )
-        $classes[] = 'has-featured-image';
+        $classes[] = 'has-post-thumbnail';
+    else
+        $classes[] = 'no-post-thumbnail';
 
     return $classes;

trunk/src/wp-content/themes/twentyfourteen/inc/template-tags.php

@@ -160 +160 @@
 
 /**
- * Displays an optional featured image, with an anchor element
+ * Displays an optional post thumbnail, with an anchor element
  * when on index views, and a div element when on a single view.
  *
@@ -172 +172 @@
     ?>
 
-    <div class="featured-thumbnail">
-        <?php the_post_thumbnail( 'featured-thumbnail-large' ); ?>
+    <div class="post-thumbnail">
+        <?php the_post_thumbnail( 'post-thumbnail' ); ?>
     </div>
 
     <?php else : ?>
 
-    <a class="featured-thumbnail" href="<?php the_permalink(); ?>" rel="<?php the_ID(); ?>">
+    <a class="post-thumbnail" href="<?php the_permalink(); ?>" rel="<?php the_ID(); ?>">
     <?php if ( has_post_thumbnail() ) :
-        the_post_thumbnail( 'featured-thumbnail-large' );
+        the_post_thumbnail( 'post-thumbnail' );
     else : ?>
         <p class="screen-reader-text"><?php _e( 'No featured image.', 'twentyfourteen' ); ?></p>

trunk/src/wp-content/themes/twentyfourteen/rtl.css

@@ -362 +362 @@
 /* Mobile list style */
 @media screen and (max-width: 400px) {
-    .list-view .featured-thumbnail img {
+    .list-view .post-thumbnail img {
         float: right;
         margin: 0 0 3px 10px;

trunk/src/wp-content/themes/twentyfourteen/style.css

@@ -36 +36 @@
  *   6.10 - 404 Page
  *   6.11 - Front Page
- *   6.12 - Comments
+ *   6.12 - Full-width
+ *   6.13 - Comments
  * 7.0 - Sidebar
  *   7.1 - Widgets
@@ -562 +563 @@
 
 .attachment-featured-featured img,
-.featured-thumbnail img {
+.post-thumbnail img {
     height: auto;
     max-width: 100%;
@@ -985 +986 @@
 }
 
-.full-width .hentry {
-    max-width: 100%;
-}
-
 .site-content .entry-header,
 .site-content .entry-content,
@@ -1004 +1001 @@
  */
 
- .featured-thumbnail {
+ .post-thumbnail {
     background: url(images/pattern-light.svg) #767676 repeat fixed;
     display: none;
@@ -1016 +1013 @@
 }
 
-a.featured-thumbnail:hover {
+a.post-thumbnail:hover {
     background: url(images/pattern-light.svg) #919191 repeat fixed;
 }
 
-.featured-thumbnail img {
+.post-thumbnail img {
     display: block;
     margin: 0 auto;
 }
 
-.has-featured-image .featured-thumbnail,
-.format-standard .featured-thumbnail {
+.has-post-thumbnail .post-thumbnail,
+.format-standard .post-thumbnail {
     display: block;
 }
@@ -1046 +1043 @@
 }
 
-.site-content .has-featured-image .entry-header,
+.site-content .has-post-thumbnail .entry-header,
 .site-content .format-standard .entry-header {
     padding-top: 24px;
@@ -1733 +1730 @@
 
 /**
- * 6.11 Comments
+ * 6.12 Full-width
+ * -----------------------------------------------------------------------------
+ */
+
+.full-width.singular .content-area {
+    padding-top: 0;
+}
+
+.full-width .hentry {
+    max-width: 100%;
+}
+
+.full-width.singular .hentry.no-post-thumbnail,
+.full-width.singular .hentry.no-post-thumbnail.format-standard.post-password-required {
+    padding-top: 24px;
+}
+
+.full-width.singular .hentry.no-post-thumbnail.format-standard {
+    padding-top: 0;
+}
+
+
+/**
+ * 6.13 Comments
  * -----------------------------------------------------------------------------
  */
@@ -2520 +2540 @@
 
 @media screen and (max-width: 400px) {
-    .list-view .featured-thumbnail {
+    .list-view .post-thumbnail {
         background: none;
         min-height: 0;
@@ -2527 +2547 @@
     }
 
-    .list-view .featured-thumbnail img {
+    .list-view .post-thumbnail img {
         float: left;
         margin: 0 10px 3px 0;
@@ -2590 +2610 @@
 
 @media screen and (min-width: 401px) {
-    a.featured-thumbnail:hover img {
+    a.post-thumbnail:hover img {
         opacity: 0.85;
     }
@@ -2692 +2712 @@
     }
 
-    .list-view .site-content .has-featured-image .featured-thumbnail,
-    .list-view .site-content .format-standard .featured-thumbnail {
+    .list-view .site-content .has-post-thumbnail .post-thumbnail,
+    .list-view .site-content .format-standard .post-thumbnail {
         margin-top: -49px;
     }
@@ -2715 +2735 @@
     }
 
-    .site-content .has-featured-image .entry-header,
+    .site-content .has-post-thumbnail .entry-header,
     .site-content .format-standard .entry-header {
         margin-top: -48px;
@@ -2732 +2752 @@
     }
 
+    .full-width.singular .content-area {
+        padding-top: 0;
+    }
+
     .site-content {
         margin-right: 33.33333333%;
@@ -2740 +2764 @@
     }
 
-    .site-content .has-featured-image .entry-header,
+    .site-content .has-post-thumbnail .entry-header,
     .site-content .format-standard .entry-header {
         margin-top: 0;
     }
 
-    .full-width .site-content .has-featured-image .entry-header,
+    .full-width .site-content .has-post-thumbnail .entry-header,
     .full-width .site-content .format-standard .entry-header {
         margin-top: -48px;
+    }
+
+    .full-width.singular .hentry.no-post-thumbnail,
+    .full-width.singular .hentry.no-post-thumbnail.format-standard.post-password-required {
+        padding-top: 36px;
+    }
+
+    .full-width.singular .hentry.no-post-thumbnail.format-standard {
+        padding-top: 0;
     }
 
@@ -2972 +3005 @@
     }
 
-    .site-content .has-featured-image .entry-header,
+    .full-width.singular .content-area {
+        padding-top: 0;
+    }
+
+    .full-width.singular .hentry.no-post-thumbnail,
+    .full-width.singular .hentry.no-post-thumbnail.format-standard.post-password-required {
+        padding-top: 72px;
+    }
+
+    .full-width.singular .hentry.no-post-thumbnail.format-standard {
+        padding-top: 0;
+    }
+
+    .site-content .has-post-thumbnail .entry-header,
     .site-content .format-standard .entry-header {
         margin-top: -48px;
@@ -3031 +3077 @@
     }
 
-    .site-content .has-featured-image .entry-header,
+    .site-content .has-post-thumbnail .entry-header,
     .site-content .format-standard .entry-header {
         margin-top: 0;
@@ -3192 +3238 @@
 
 @media screen and (min-width: 1040px) {
-    .site-content .has-featured-image .entry-header,
+    .site-content .has-post-thumbnail .entry-header,
     .site-content .format-standard .entry-header {
         margin-top: -48px;