tec3/five-for-the-future
tec3/five-for-the-future
1
0
Fork 0
mirror of https://github.com/WordPress/five-for-the-future.git synced 2025-04-22 19:13:44 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

Pledge Form: Use agreement text as label content

Browse source 
This calls more attention to the agreement text, and correctly associates it with the input for screen reader users.
This commit is contained in:
Kelly Dwan 2019-10-28 20:09:38 -04:00
parent f49a938c1e
commit aa8b1838cd
No known key found for this signature in database
GPG key ID: 8BA5575F3D11575D
2 changed files with 11 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
plugins/wporg-5ftf/views/inputs-pledge-new-misc.php
View file

@ -6,18 +6,6 @@ namespace WordPressDotOrg\FiveForTheFuture\View;
?> ?>
<div class="form-field form-field__agree"> <div class="form-field form-field__agree">
<p>
<?php
printf(
wp_kses_post( '
I understand and agree to the <a href="%s">expectations</a> for
inclusion in the Five for the Future acknowledgement program.
' ),
esc_url( get_permalink( get_page_by_path( 'expectations' ) ) ) // TODO Change this URL?
);
?>
</p>
<input <input
type="checkbox" type="checkbox"
id="5ftf-pledge-agreement" id="5ftf-pledge-agreement"
@ -26,6 +14,11 @@ namespace WordPressDotOrg\FiveForTheFuture\View;
<?php checked( $data['pledge-agreement'] ); ?> <?php checked( $data['pledge-agreement'] ); ?>
/> />
<label for="5ftf-pledge-agreement"> <label for="5ftf-pledge-agreement">
<?php esc_html_e( 'Yes', 'wordpressorg' ); ?> <?php
printf(
wp_kses_post( __( 'I understand and agree to the <a href="%s">expectations</a> for inclusion in the Five for the Future acknowledgement program.', 'wporg-5ftf' ) ),
esc_url( get_permalink( get_page_by_path( 'expectations' ) ) ) // TODO Change this URL?
);
?>
</label> </label>
</div> </div>

5
themes/wporg-5ftf/css/objects/_pledge-form.scss
View file

@ -45,7 +45,12 @@
.form-field__agree { .form-field__agree {
input {
margin-top: 0;
}
label { label {
display: inline;
margin-bottom: 0; margin-bottom: 0;
} }
} }