From eb01af41c2ba7d31992bd401654718d93899cbb8 Mon Sep 17 00:00:00 2001 From: Lance Willett Date: Mon, 28 Oct 2013 17:57:57 +0000 Subject: [PATCH] Twenty Fourteen: clean up post thumbnail naming. Props iamtakashi, fixes #25718. git-svn-id: https://develop.svn.wordpress.org/trunk@25971 602fd350-edb4-49c9-b593-d223f7449a82 --- .../twentyfourteen/content-featured-post.php | 4 +- .../themes/twentyfourteen/functions.php | 22 +++-- .../twentyfourteen/inc/template-tags.php | 10 +- src/wp-content/themes/twentyfourteen/rtl.css | 2 +- .../themes/twentyfourteen/style.css | 94 ++++++++++++++----- 5 files changed, 92 insertions(+), 40 deletions(-) diff --git a/src/wp-content/themes/twentyfourteen/content-featured-post.php b/src/wp-content/themes/twentyfourteen/content-featured-post.php index 7d7099f4d8..23115ac8d5 100644 --- a/src/wp-content/themes/twentyfourteen/content-featured-post.php +++ b/src/wp-content/themes/twentyfourteen/content-featured-post.php @@ -12,7 +12,7 @@ ID, 'featured-thumbnail-featured' ); + echo wp_get_attachment_image( $image->ID, 'post-thumbnail-grid' ); endif; endif; ?> diff --git a/src/wp-content/themes/twentyfourteen/functions.php b/src/wp-content/themes/twentyfourteen/functions.php index 12591ef68f..0f862b5b7c 100644 --- a/src/wp-content/themes/twentyfourteen/functions.php +++ b/src/wp-content/themes/twentyfourteen/functions.php @@ -68,9 +68,8 @@ function twentyfourteen_setup() { add_theme_support( 'post-thumbnails' ); // 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. register_nav_menus( array( @@ -361,9 +360,11 @@ endif; * * 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 * @@ -391,6 +392,9 @@ function twentyfourteen_body_classes( $classes ) { if ( is_active_sidebar( 'sidebar-3' ) ) $classes[] = 'footer-widgets'; + if ( is_singular() ) + $classes[] = 'singular'; + return $classes; } add_filter( 'body_class', 'twentyfourteen_body_classes' ); @@ -399,7 +403,7 @@ add_filter( 'body_class', 'twentyfourteen_body_classes' ); * Extend the default WordPress post classes. * * 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 * @@ -408,7 +412,9 @@ add_filter( 'body_class', 'twentyfourteen_body_classes' ); */ 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; } diff --git a/src/wp-content/themes/twentyfourteen/inc/template-tags.php b/src/wp-content/themes/twentyfourteen/inc/template-tags.php index abdd64fd76..191d77588a 100644 --- a/src/wp-content/themes/twentyfourteen/inc/template-tags.php +++ b/src/wp-content/themes/twentyfourteen/inc/template-tags.php @@ -159,7 +159,7 @@ add_action( 'edit_category', 'twentyfourteen_category_transient_flusher' ); add_action( 'save_post', 'twentyfourteen_category_transient_flusher' ); /** - * 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. * * @return void @@ -171,15 +171,15 @@ function twentyfourteen_post_thumbnail() { if ( is_singular() ) : ?> -
- +
+
- +

diff --git a/src/wp-content/themes/twentyfourteen/rtl.css b/src/wp-content/themes/twentyfourteen/rtl.css index 1b43899f8d..5336b74aea 100644 --- a/src/wp-content/themes/twentyfourteen/rtl.css +++ b/src/wp-content/themes/twentyfourteen/rtl.css @@ -361,7 +361,7 @@ blockquote.alignleft { /* 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; } diff --git a/src/wp-content/themes/twentyfourteen/style.css b/src/wp-content/themes/twentyfourteen/style.css index 5701110fcd..6c98907af1 100644 --- a/src/wp-content/themes/twentyfourteen/style.css +++ b/src/wp-content/themes/twentyfourteen/style.css @@ -35,7 +35,8 @@ Use it to make something cool, have fun, and share what you've learned with othe * 6.9 - Contributor Page * 6.10 - 404 Page * 6.11 - Front Page - * 6.12 - Comments + * 6.12 - Full-width + * 6.13 - Comments * 7.0 - Sidebar * 7.1 - Widgets * 7.2 - Content Sidebar Widgets @@ -561,7 +562,7 @@ img.wp-post-image { } .attachment-featured-featured img, -.featured-thumbnail img { +.post-thumbnail img { height: auto; max-width: 100%; } @@ -984,10 +985,6 @@ span + .edit-link:before, max-width: 672px; } -.full-width .hentry { - max-width: 100%; -} - .site-content .entry-header, .site-content .entry-content, .site-content .entry-summary, @@ -1003,7 +1000,7 @@ span + .edit-link:before, * ----------------------------------------------------------------------------- */ - .featured-thumbnail { + .post-thumbnail { background: url(images/pattern-light.svg) #767676 repeat fixed; display: none; float: none; @@ -1015,17 +1012,17 @@ span + .edit-link:before, z-index: 0; } -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; } @@ -1045,7 +1042,7 @@ a.featured-thumbnail:hover { padding: 0 10px 12px; } -.site-content .has-featured-image .entry-header, +.site-content .has-post-thumbnail .entry-header, .site-content .format-standard .entry-header { padding-top: 24px; } @@ -1732,7 +1729,30 @@ a.featured-thumbnail:hover { /** - * 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 * ----------------------------------------------------------------------------- */ @@ -2519,14 +2539,14 @@ a.featured-thumbnail:hover { */ @media screen and (max-width: 400px) { - .list-view .featured-thumbnail { + .list-view .post-thumbnail { background: none; min-height: 0; width: auto; z-index: 2; } - .list-view .featured-thumbnail img { + .list-view .post-thumbnail img { float: left; margin: 0 10px 3px 0; width: 84px; @@ -2589,7 +2609,7 @@ a.featured-thumbnail:hover { } @media screen and (min-width: 401px) { - a.featured-thumbnail:hover img { + a.post-thumbnail:hover img { opacity: 0.85; } @@ -2691,8 +2711,8 @@ a.featured-thumbnail:hover { margin: -3px 2px 0 0; } - .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; } @@ -2714,7 +2734,7 @@ a.featured-thumbnail:hover { padding-left: 30px; } - .site-content .has-featured-image .entry-header, + .site-content .has-post-thumbnail .entry-header, .site-content .format-standard .entry-header { margin-top: -48px; } @@ -2731,6 +2751,10 @@ a.featured-thumbnail:hover { width: 100%; } + .full-width.singular .content-area { + padding-top: 0; + } + .site-content { margin-right: 33.33333333%; } @@ -2739,16 +2763,25 @@ a.featured-thumbnail:hover { margin-right: 0; } - .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; + } + .archive-header, .comments-area, .image-navigation, @@ -2971,7 +3004,20 @@ a.featured-thumbnail:hover { padding-top: 72px; } - .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; } @@ -3030,7 +3076,7 @@ a.featured-thumbnail:hover { margin-top: 0; } - .site-content .has-featured-image .entry-header, + .site-content .has-post-thumbnail .entry-header, .site-content .format-standard .entry-header { margin-top: 0; } @@ -3191,7 +3237,7 @@ a.featured-thumbnail:hover { } @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; }