malhuda/fictioneer
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 112 Wiki Activity

Comment respond option now accessible

Browse Source
This commit is contained in:
Tetrakern 2023-01-24 02:57:51 +01:00
parent 12164a4211
commit c635e5c9e3
6 changed files with 14 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
css/application.css
View File

File diff suppressed because one or more lines are too long

2
css/comments.css
View File

File diff suppressed because one or more lines are too long

2
css/complete.css
View File

File diff suppressed because one or more lines are too long

6
includes/functions/comments/_comments_form.php
View File

@ -163,7 +163,8 @@ if ( ! function_exists( 'fictioneer_change_submit_field' ) ) {
$private_toggle = '';
if ( get_option( 'fictioneer_enable_private_commenting' ) ) {
$private_toggle = '<div class="fictioneer-private-comment-toggle fictioneer-respond__form-toggle"><label><input name="fictioneer-private-comment-toggle" id="fictioneer-private-comment-toggle" type="checkbox" hidden><span class="tooltipped _mobile-tooltip" data-tooltip="' . _x( 'Toggle to mark as private. Hides the comment from uninvolved viewers.', 'Comment form private toggle.', 'fictioneer' ) . '"><i class="fa-solid fa-eye off"></i><i class="fa-solid fa-eye-slash on"></i></span></label></div>';
$hint = esc_attr_x( 'Toggle to mark as private. Hides the comment from uninvolved viewers.', 'Comment form private toggle.', 'fictioneer' );
$private_toggle = '<div class="fictioneer-private-comment-toggle fictioneer-respond__form-toggle"><label class="comment-respond-option-toggle" tabindex="0" aria-role="checkbox" aria-label="' . $hint . '"><input name="fictioneer-private-comment-toggle" id="fictioneer-private-comment-toggle" type="checkbox" hidden><span class="tooltipped _mobile-tooltip" data-tooltip="' . $hint . '"><i class="fa-solid fa-eye off"></i><i class="fa-solid fa-eye-slash on"></i></span></label></div>';
}
// Email subscriptions toggle
@ -173,7 +174,8 @@ if ( ! function_exists( 'fictioneer_change_submit_field' ) ) {
$notification_checked = $notification_checked && ( ! get_option( 'fictioneer_enable_public_cache_compatibility' ) || $is_ajax );
if ( get_option( 'fictioneer_enable_comment_notifications' ) && ! $notifications_blocked ) {
$notification_toggle = '<div class="fictioneer-comment-notification-toggle fictioneer-respond__form-toggle"><label><input name="fictioneer-comment-notification-toggle" id="fictioneer-comment-notification-toggle" type="checkbox" ' . checked( 1, $notification_checked, false ) . ' hidden><span class="tooltipped _mobile-tooltip" data-tooltip="' . _x( 'Toggle to get email notifications about direct replies.', 'Comment form email notification toggle.', 'fictioneer' ) . '"><i class="fa-solid fa-bell on"></i><i class="fa-solid fa-bell-slash off"></i></span></label></div>';
$hint = esc_attr_x( 'Toggle to get email notifications about direct replies.', 'Comment form email notification toggle.', 'fictioneer' );
$notification_toggle = '<div class="fictioneer-comment-notification-toggle fictioneer-respond__form-toggle"><label class="comment-respond-option-toggle" tabindex="0" aria-role="checkbox" aria-label="' . $hint . '"><input name="fictioneer-comment-notification-toggle" id="fictioneer-comment-notification-toggle" type="checkbox" ' . checked( 1, $notification_checked, false ) . ' tabindex="-1" hidden><span class="tooltipped _mobile-tooltip" data-tooltip="' . $hint . '"><i class="fa-solid fa-bell on"></i><i class="fa-solid fa-bell-slash off"></i></span></label></div>';
}
// Private comment notice for guests

5
src/scss/comments.scss
View File

@ -145,6 +145,11 @@
}
&-toggle {
label {
--focus-offset: -2px;
display: block;
}
span {
display: grid;
place-content: center;

3
src/scss/common/_setup.scss
View File

@ -18,7 +18,8 @@ input:is([type=checkbox], [type=radio], [type=range]):focus-visible,
.button:focus-visible,
.card__link-list li:focus-within,
.oauth-login-link:focus-within,
.story__thumbnail:focus-within {
.story__thumbnail:focus-within,
.comment-respond-option-toggle:focus-visible {
border-radius: var(--focus-border-radius, var(--layout-border-radius-small));
outline: var(--focus-outline);
outline-offset: var(--focus-offset, 0);