Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix Inconsistent Labels for Lightbox Feature #68261

Merged
merged 26 commits into from
Jan 8, 2025
Merged

Fix Inconsistent Labels for Lightbox Feature #68261

Show file tree
Hide file tree
Changes from 22 commits
Commits
Show all changes
26 commits
Select commit Hold shift + click to select a range
63f81c1
Image size fix in lightbox
karthick-murugan Dec 3, 2024
0e19583
Revert "Image size fix in lightbox"
karthick-murugan Dec 3, 2024
f226ae0
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 4, 2024
d074ba9
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 5, 2024
4d847ca
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 5, 2024
c9115b2
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 5, 2024
b81e6ff
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 6, 2024
efe57e5
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 9, 2024
228e924
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 10, 2024
c448a21
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 11, 2024
05bb54c
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 12, 2024
619fed3
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 12, 2024
301d70f
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 18, 2024
c80640f
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 19, 2024
6ed9ff3
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 20, 2024
09b4cf2
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 20, 2024
27e4bbc
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 20, 2024
52f809e
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 23, 2024
e7679f1
Merge branch 'WordPress:trunk' into trunk
karthick-murugan Dec 24, 2024
e6b7ca3
Update the enlarge image icon label
karthick-murugan Dec 24, 2024
19b3b43
Capslock updated
karthick-murugan Dec 24, 2024
2a673cd
Feedback changes updated
karthick-murugan Jan 2, 2025
4a65648
Feedback changes
karthick-murugan Jan 7, 2025
2fa2c31
Feedback Changes
karthick-murugan Jan 7, 2025
8978ebf
Feedback Changes
karthick-murugan Jan 7, 2025
6fc40cb
Feedback changes
karthick-murugan Jan 8, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions packages/block-editor/src/components/global-styles/image-settings-panel.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,14 +61,14 @@ export default function ImageSettingsPanel( {
// "RESET" button ONLY when the user has explicitly set a value in the
// Global Styles.
hasValue={ () => !! value?.lightbox }
label={ __( 'Expand on click' ) }
label={ __( 'Enlarge on click' ) }
onDeselect={ resetLightbox }
isShownByDefault
panelId={ panelId }
>
<ToggleControl
__nextHasNoMarginBottom
label={ __( 'Expand on click' ) }
label={ __( 'Enlarge on click' ) }
checked={ lightboxChecked }
onChange={ onChangeLightbox }
/>
Expand Down
6 changes: 3 additions & 3 deletions packages/block-editor/src/components/url-popover/image-url-input-ui.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -265,14 +265,14 @@ const ImageURLInputUI = ( {
<div className="block-editor-url-popover__expand-on-click">
<Icon icon={ fullscreen } />
<div className="text">
<p>{ __( 'Expand on click' ) }</p>
<p>{ __( 'Enlarge on click' ) }</p>
<p className="description">
{ __( 'Scales the image with a lightbox effect' ) }
</p>
</div>
<Button
icon={ linkOff }
label={ __( 'Disable expand on click' ) }
label={ __( 'Disable Enlarge on click' ) }
onClick={ () => {
onSetLightbox?.( false );
} }
Expand Down Expand Up @@ -372,7 +372,7 @@ const ImageURLInputUI = ( {
stopEditLink();
} }
>
{ __( 'Expand on click' ) }
{ __( 'Enlarge on click' ) }
</MenuItem>
) }
</NavigableMenu>
Expand Down
2 changes: 1 addition & 1 deletion packages/block-library/src/gallery/edit.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -80,7 +80,7 @@ const LINK_OPTIONS = [
},
{
icon: fullscreen,
label: __( 'Expand on click' ),
label: __( 'Enlarge on click' ),
value: LINK_DESTINATION_LIGHTBOX,
noticeText: __( 'Lightbox effect' ),
infoText: __( 'Scale images with a lightbox effect' ),
Expand Down
8 changes: 2 additions & 6 deletions packages/block-library/src/image/index.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -155,12 +155,7 @@ function block_core_image_render_lightbox( $block_content, $block ) {
$img_styles = $p->get_attribute( 'style' );
$img_width = 'none';
$img_height = 'none';
$aria_label = __( 'Enlarge image' );

if ( $alt ) {
/* translators: %s: Image alt text. */
$aria_label = sprintf( __( 'Enlarge image: %s' ), $alt );
}
$aria_label = __( 'Enlarge' );

if ( isset( $block['attrs']['id'] ) ) {
$img_uploaded_src = wp_get_attachment_url( $block['attrs']['id'] );
Expand Down Expand Up @@ -234,6 +229,7 @@ class="lightbox-trigger"
type="button"
aria-haspopup="dialog"
aria-label="' . esc_attr( $aria_label ) . '"
aria-describedby="' . esc_attr( $alt ) . '"
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The aria-describedby attribute should point to the ID of a hidden element that contains the description. If it turns to be too complicated, we could consider to not use a description at all.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@afercia - Considering the complexity of this implementation, I have removed the aria-describedby attribute as per your suggestion. We can address it in a separate PR to ensure it is handled comprehensively.

data-wp-init="callbacks.initTriggerButton"
data-wp-on-async--click="actions.showLightbox"
data-wp-style--right="state.imageButtonRight"
Expand Down
Loading