Changeset 25087

Timestamp:

08/22/2013 05:00:36 PM (13 years ago)

Author:

lancewillett

Message:

Twenty Fourteen: Use HTML5 comment markup, props obenland. Fixes #25045.

Location:

trunk/src/wp-content/themes/twentyfourteen

Files:

• comments.php (modified) (1 diff)
• functions.php (modified) (1 diff)
• inc/template-tags.php (modified) (1 diff)
• style.css (modified) (23 diffs)

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

@@ -41 +41 @@
                 'style'      => 'ol',
                 'short_ping' => true,
-
-                // TODO: Remove callback and update styles.
-                'callback'=>'twentyfourteen_comment',
             ) );
         ?>

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

@@ -69 +69 @@
 
     /*
+     * Switches default core markup for search form, comment form, and comments
+     * to output valid HTML5.
+     */
+    add_theme_support( 'html5', array(
+        'search-form', 'comment-form', 'comment-list',
+    ) );
+
+    /*
      * Enable support for Post Formats.
      * See http://codex.wordpress.org/Post_Formats
      */
     add_theme_support( 'post-formats', array(
-        'aside', 'image', 'video', 'quote', 'link', 'gallery'
+        'aside', 'image', 'video', 'quote', 'link', 'gallery',
     ) );
 

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

@@ -85 +85 @@
 endif;
 
-if ( ! function_exists( 'twentyfourteen_comment' ) ) :
-/**
- * Template for comments and pingbacks.
- *
- * Used as a callback by wp_list_comments() for displaying the comments.
- *
- */
-function twentyfourteen_comment( $comment, $args, $depth ) {
-    $GLOBALS['comment'] = $comment;
-    switch ( $comment->comment_type ) :
-        case 'pingback' :
-        case 'trackback' :
-    ?>
-    <li class="post pingback">
-        <p><?php _e( 'Pingback:', 'twentyfourteen' ); ?> <?php comment_author_link(); ?><?php edit_comment_link( __( 'Edit', 'twentyfourteen' ), ' ' ); ?></p>
-    <?php
-            break;
-        default :
-    ?>
-    <li <?php comment_class(); ?> id="li-comment-<?php comment_ID(); ?>">
-        <article id="comment-<?php comment_ID(); ?>" class="comment">
-            <footer>
-                <div class="comment-author vcard">
-                    <span class="comment-author-avatar"><?php echo get_avatar( $comment, 32 ); ?></span>
-                    <?php printf( __( '%s', 'twentyfourteen' ), sprintf( '<cite class="fn">%s</cite> says:', get_comment_author_link() ) ); ?>
-                </div><!-- .comment-author .vcard -->
-            </footer>
-
-            <div class="comment-content">
-                <?php comment_text(); ?>
-                <?php if ( $comment->comment_approved == '0' ) : ?>
-                    <p><em><?php _e( 'Your comment is awaiting moderation.', 'twentyfourteen' ); ?></em></p>
-                <?php endif; ?>
-            </div>
-
-            <div class="comment-meta commentmetadata">
-                <a href="<?php echo esc_url( get_comment_link( $comment->comment_ID ) ); ?>"><time pubdate datetime="<?php comment_time( 'c' ); ?>">
-                <?php
-                    /* translators: 1: date, 2: time */
-                    printf( __( '%1$s at %2$s', 'twentyfourteen' ), get_comment_date(), get_comment_time() ); ?>
-                </time></a>
-                <?php comment_reply_link( array_merge( $args, array( 'depth' => $depth, 'max_depth' => $args['max_depth'] ) ) ); ?>
-                <?php edit_comment_link( __( 'Edit', 'twentyfourteen' ), ' ' );
-                ?>
-            </div><!-- .comment-meta .commentmetadata -->
-        </article><!-- #comment-## -->
-
-    <?php
-            break;
-    endswitch;
-}
-endif; // ends check for twentyfourteen_comment()
-
 if ( ! function_exists( 'twentyfourteen_posted_on' ) ) :
 /**

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

@@ -1851 +1851 @@
     margin: 0 0 4.8rem 0;
 }
-.comment-meta,
+.comment-metadata,
 .comment-author {
     font-size: 14px;
@@ -1857 +1857 @@
     line-height: 1.7142857142;
 }
-.comment-author cite {
+.comment-author .fn {
     font-weight: 900;
     text-transform: uppercase;
@@ -1864 +1864 @@
     color: #2b2b2b;
 }
-.comment-meta a,
-.comment-list li.trackback a,
-.comment-list li.pingback a {
+.comment-metadata a,
+.comment-list .trackback a,
+.comment-list .pingback a {
     color: #767676;
 }
 .comment-author a:hover,
-.comment-meta a:hover,
+.comment-metadata a:hover,
 .comment-list .trackback a:hover,
 .comment-list .pingback a:hover {
@@ -1876 +1876 @@
     text-decoration: none;
 }
-.comment-edit-link:before,
-.comment-reply-link:before {
+.comment-edit-link:before {
     color: rgba(0, 0, 0, 0.2);
     content: '\007c\0020';
@@ -1897 +1896 @@
     min-height: 48px;
     min-height: 4.8rem;
-    position: relative;
 }
 .comment-author {
@@ -1904 +1902 @@
     position: relative;
 }
-.comment-author .comment-author-avatar {
+.comment-author .avatar {
     border: 1px solid rgba(0, 0, 0, 0.1);
     padding: 2px;
@@ -1917 +1915 @@
     height: 2.2rem;
 }
-.bypostauthor .comment-author .comment-author-avatar {
+.bypostauthor .avatar {
     background-color: #24890d;
 }
-.comment-author cite {
+.comment-author .fn {
     font-style: normal;
 }
@@ -1934 +1932 @@
     height: 2.2rem;
 }
-.comment-meta,
+.comment-metadata,
 .comment-content {
     padding-left: 36px;
@@ -2413 +2411 @@
     .content-area .byline a:before,
     .content-area .comments-link a:before,
-    .content-area .edit-link a:before,
+    .entry-meta .edit-link a:before,
     .attachment .entry-date:before,
     .content-area .full-size-link a:before,
@@ -2476 +2474 @@
         margin: -0.1rem 0.2rem 0 0;
     }
-    .content-area .edit-link a:before {
+    .entry-meta .edit-link a:before {
         content: '\F411';
         margin: -1px 2px 0 0;
@@ -2487 +2485 @@
         content: '\F301';
     }
-    .page .content-area .edit-link a:before {
+    .page .entry-meta .edit-link a:before {
         margin: 5px 2px 0 0;
         margin: 0.5rem 0.2rem 0 0;
@@ -2606 +2604 @@
     }
     .comments-area article,
-    .comment-list li.trackback,
-    .comment-list li.pingback {
+    .comment-list .trackback,
+    .comment-list .pingback {
         margin-bottom: 36px;
         margin-bottom: 3.6rem;
@@ -2613 +2611 @@
         padding-top: 3.6rem;
     }
-    .comment-author {
-        padding-left: 60px;
-        padding-left: 6.0rem;
-    }
-    .comment-author .comment-author-avatar,
     .comment-author .avatar {
         width: 32px;
@@ -2624 +2617 @@
         height: 3.2rem;
     }
-    .comment-meta,
+    .comment-author,
+    .comment-metadata,
     .comment-content {
         padding-left: 60px;
@@ -2633 +2627 @@
     .comment-respond,
     .comments-area article,
-    .comment-list li.trackback,
-    .comment-list li.pingback,
+    .comment-list .trackback,
+    .comment-list .pingback,
     .post-navigation [rel="prev"],
     .post-navigation [rel="next"] {
@@ -2653 +2647 @@
     .full-width .comment-respond,
     .full-width .comments-area article,
-    .full-width .comment-list li.trackback,
-    .full-width .comment-list li.pingback {
+    .full-width .comment-list .trackback,
+    .full-width .comment-list .pingback {
         padding-right: 6.04307432%;
         padding-left: 6.04307432%;
@@ -2729 +2723 @@
     .comment-respond,
     .comments-area article,
-    .comment-list li.trackback,
-    .comment-list li.pingback,
+    .comment-list .trackback,
+    .comment-list .pingback,
     .post-navigation [rel="prev"],
     .post-navigation [rel="next"] {
@@ -2753 +2747 @@
     .full-width .comment-respond,
     .full-width .comments-area article,
-    .full-width .comment-list li.trackback,
-    .full-width .comment-list li.pingback {
+    .full-width .comment-list .trackback,
+    .full-width .comment-list .pingback {
         padding-right: 11.30926724%;
         padding-left: 11.30926724%;
@@ -2924 +2918 @@
     .comment-respond,
     .comments-area article,
-    .comment-list li.trackback,
-    .comment-list li.pingback,
+    .comment-list .trackback,
+    .comment-list .pingback,
     .post-navigation [rel="prev"],
     .post-navigation [rel="next"] {
@@ -2944 +2938 @@
     .full-width .comment-respond,
     .full-width .comments-area article,
-    .full-width .comment-list li.trackback,
-    .full-width .comment-list li.pingback {
+    .full-width .comment-list .trackback,
+    .full-width .comment-list .pingback {
         padding-right: 5.882236%;
         padding-left: 5.882236%;
@@ -2998 +2992 @@
     .comment-respond,
     .comments-area article,
-    .comment-list li.trackback,
-    .comment-list li.pingback,
+    .comment-list .trackback,
+    .comment-list .pingback,
     .post-navigation [rel="prev"],
     .post-navigation [rel="next"] {
@@ -3036 +3030 @@
     .full-width .comment-respond,
     .full-width .comments-area article,
-    .full-width .comment-list li.trackback,
-    .full-width .comment-list li.pingback {
+    .full-width .comment-list .trackback,
+    .full-width .comment-list .pingback {
         padding-right: 11.21868265%;
         padding-left: 11.21868265%;
@@ -3076 +3070 @@
     .full-width .comment-respond,
     .full-width .comments-area article,
-    .full-width .comment-list li.trackback,
-    .full-width .comment-list li.pingback {
+    .full-width .comment-list .trackback,
+    .full-width .comment-list .pingback {
         padding-right: 0;
     }