Comments: Move comment consent `input` outside the `label` for a11y.
Non-wrapping `label`s are more widely supported by assitive technologies. The CSS changes account for the element re-ordering, and tweak the formatting for improved readability. Props afercia, xkon, laurelfulford, azaozz. Fixes #43436. Built from https://develop.svn.wordpress.org/trunk@43125 git-svn-id: http://core.svn.wordpress.org/trunk@42954 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
iandunn
parent
753d4f10cd
commit
aa01cbe691
|
|
@ -103,6 +103,9 @@ input#s {
|
|||
background-position: 97% 6px;
|
||||
padding: 4px 28px 4px 10px;
|
||||
}
|
||||
#respond #wp-comment-cookies-consent {
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
/* Assistive text */
|
||||
#access a.assistive-text:focus {
|
||||
|
|
|
|||
|
|
@ -2298,6 +2298,9 @@ a.comment-reply-link > span {
|
|||
#respond p {
|
||||
font-size: 12px;
|
||||
}
|
||||
#respond #wp-comment-cookies-consent {
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
p.comment-form-comment {
|
||||
margin: 0;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -400,6 +400,9 @@ img.alignleft {
|
|||
float: left;
|
||||
}
|
||||
|
||||
.comment-form #wp-comment-cookies-consent {
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
/**
|
||||
* 11.0 Media Queries
|
||||
|
|
|
|||
|
|
@ -2406,6 +2406,18 @@ a.post-thumbnail:focus {
|
|||
top: -3px;
|
||||
}
|
||||
|
||||
.comment-form #wp-comment-cookies-consent {
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.comment-form .comment-form-cookies-consent label {
|
||||
display: inline;
|
||||
font-size: 12px;
|
||||
font-size: 1.2rem;
|
||||
font-weight: normal;
|
||||
letter-spacing: 0;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 13.0 Footer
|
||||
|
|
@ -3040,6 +3052,7 @@ p > video {
|
|||
.comment-awaiting-moderation,
|
||||
.logged-in-as,
|
||||
.comment-form label,
|
||||
.comment-form .comment-form-cookies-consent label,
|
||||
.form-allowed-tags,
|
||||
.site-info,
|
||||
.wp-caption-text,
|
||||
|
|
@ -3669,6 +3682,7 @@ p > video {
|
|||
.comment-awaiting-moderation,
|
||||
.logged-in-as,
|
||||
.comment-form label,
|
||||
.comment-form .comment-form-cookies-consent label,
|
||||
.form-allowed-tags,
|
||||
.site-info,
|
||||
.wp-caption-text,
|
||||
|
|
@ -4288,6 +4302,7 @@ p > video {
|
|||
.comment-awaiting-moderation,
|
||||
.logged-in-as,
|
||||
.comment-form label,
|
||||
.comment-form .comment-form-cookies-consent label,
|
||||
.form-allowed-tags,
|
||||
.site-info,
|
||||
.wp-caption-text,
|
||||
|
|
@ -4945,6 +4960,7 @@ p > video {
|
|||
.comment-awaiting-moderation,
|
||||
.logged-in-as,
|
||||
.comment-form label,
|
||||
.comment-form .comment-form-cookies-consent label,
|
||||
.form-allowed-tags,
|
||||
.site-info,
|
||||
.wp-caption-text,
|
||||
|
|
@ -5486,6 +5502,7 @@ p > video {
|
|||
.comment-awaiting-moderation,
|
||||
.logged-in-as,
|
||||
.comment-form label,
|
||||
.comment-form .comment-form-cookies-consent label,
|
||||
.form-allowed-tags,
|
||||
.site-info,
|
||||
.wp-caption-text,
|
||||
|
|
|
|||
|
|
@ -288,6 +288,9 @@ td {
|
|||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.comment-form #wp-comment-cookies-consent {
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
/**
|
||||
* 7.0 Sidebars
|
||||
|
|
|
|||
|
|
@ -2186,6 +2186,13 @@ a.post-thumbnail:hover {
|
|||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.comment-form #wp-comment-cookies-consent {
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.comment-form .comment-form-cookies-consent label {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
/**
|
||||
* 7.0 Sidebars
|
||||
|
|
|
|||
|
|
@ -199,6 +199,10 @@ input[type="checkbox"] {
|
|||
text-align: left;
|
||||
}
|
||||
|
||||
.comment-form #wp-comment-cookies-consent {
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
/* Post Formats */
|
||||
|
||||
.format-quote blockquote .icon {
|
||||
|
|
|
|||
|
|
@ -2505,6 +2505,14 @@ body:not(.twentyseventeen-front-page) .entry-header {
|
|||
text-align: right;
|
||||
}
|
||||
|
||||
.comment-form #wp-comment-cookies-consent {
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.comment-form .comment-form-cookies-consent label {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
15.0 Widgets
|
||||
--------------------------------------------------------------*/
|
||||
|
|
|
|||
|
|
@ -400,6 +400,13 @@ body:not(.search-results) .entry-summary .alignleft {
|
|||
float: left;
|
||||
}
|
||||
|
||||
.comment-form #wp-comment-cookies-consent {
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
.comment-form .comment-form-cookies-consent label {
|
||||
font-family: Arial, Tahoma, sans-serif;
|
||||
}
|
||||
|
||||
/**
|
||||
* 9.0 - Multisites
|
||||
|
|
|
|||
|
|
@ -2394,6 +2394,16 @@ body.search-no-results .page-header {
|
|||
top: -5px;
|
||||
}
|
||||
|
||||
.comment-form #wp-comment-cookies-consent {
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.comment-form .comment-form-cookies-consent label {
|
||||
display: inline;
|
||||
font-family: Merriweather, Georgia, serif;
|
||||
letter-spacing: 0;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 11.5 - Sidebar
|
||||
|
|
|
|||
|
|
@ -238,6 +238,9 @@ div.menu li{
|
|||
.children #respond {
|
||||
margin: 0 0 0 48px;
|
||||
}
|
||||
#respond #wp-comment-cookies-consent {
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
/* =Widget Areas
|
||||
-------------------------------------------------------------- */
|
||||
|
|
|
|||
|
|
@ -1132,6 +1132,10 @@ h3#reply-title {
|
|||
font-size: 14px;
|
||||
width: auto;
|
||||
}
|
||||
#respond #wp-comment-cookies-consent {
|
||||
width: auto;
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
|
||||
/* =Widget Areas
|
||||
|
|
|
|||
|
|
@ -495,6 +495,10 @@ div.nav-menu > ul {
|
|||
float: right;
|
||||
}
|
||||
|
||||
.comment-form #wp-comment-cookies-consent {
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
.form-allowed-tags code {
|
||||
margin-left: auto;
|
||||
margin-right: 3px;
|
||||
|
|
|
|||
|
|
@ -2391,6 +2391,10 @@ footer.entry-meta {
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
.comment-form #wp-comment-cookies-consent {
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.form-allowed-tags,
|
||||
.form-allowed-tags code {
|
||||
color: #686758;
|
||||
|
|
|
|||
|
|
@ -134,6 +134,9 @@ label ~ span.required {
|
|||
margin: -18px -16px 0 0;
|
||||
margin: -1.285714286rem -1.142857143rem 0 0;
|
||||
}
|
||||
#respond #wp-comment-cookies-consent {
|
||||
margin: 0 0 0 10px;
|
||||
}
|
||||
|
||||
|
||||
/* =Front page template styling
|
||||
|
|
|
|||
|
|
@ -1360,6 +1360,12 @@ a.comment-edit-link:hover {
|
|||
line-height: 2;
|
||||
color: #5e5e5e;
|
||||
}
|
||||
#respond #wp-comment-cookies-consent {
|
||||
margin: 0 10px 0 0;
|
||||
}
|
||||
#respond .comment-form-cookies-consent label {
|
||||
display: inline;
|
||||
}
|
||||
.required {
|
||||
color: red;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2268,9 +2268,8 @@ function comment_form( $args = array(), $post_id = null ) {
|
|||
'<input id="email" name="email" ' . ( $html5 ? 'type="email"' : 'type="text"' ) . ' value="' . esc_attr( $commenter['comment_author_email'] ) . '" size="30" maxlength="100" aria-describedby="email-notes"' . $html_req . ' /></p>',
|
||||
'url' => '<p class="comment-form-url"><label for="url">' . __( 'Website' ) . '</label> ' .
|
||||
'<input id="url" name="url" ' . ( $html5 ? 'type="url"' : 'type="text"' ) . ' value="' . esc_attr( $commenter['comment_author_url'] ) . '" size="30" maxlength="200" /></p>',
|
||||
'cookies' => '<p class="comment-form-cookies-consent"><label for="wp-comment-cookies-consent">' .
|
||||
'<input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes"' . $consent . ' />' .
|
||||
__( 'Save my name, email, and website in this browser for the next time I comment.' ) . '</label></p>',
|
||||
'cookies' => '<p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes"' . $consent . ' />' .
|
||||
'<label for="wp-comment-cookies-consent">' . __( 'Save my name, email, and website in this browser for the next time I comment.' ) . '</label></p>',
|
||||
);
|
||||
|
||||
$required_text = sprintf( ' ' . __( 'Required fields are marked %s' ), '<span class="required">*</span>' );
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
*
|
||||
* @global string $wp_version
|
||||
*/
|
||||
$wp_version = '5.0-alpha-43123';
|
||||
$wp_version = '5.0-alpha-43125';
|
||||
|
||||
/**
|
||||
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.
|
||||
|
|
|
|||
Loading…
Reference in New Issue