Claro does not override jquery.ui theme for modal close button on hover state.

Created on 23 January 2023, about 2 years ago

Problem/Motivation

I have https://www.drupal.org/project/media_library_edit module enabled on my site which adds a modal edit form for media.
When I hover over the close button, focus probably affected as well, I see an image sprite zoomed too far out.

Upon investigation there doesn't appear to be any rules in the dialog.css file that comes with claro for hover state on the close button
https://git.drupalcode.org/project/drupal/-/blob/10.1.x/core/themes/clar...

In the included theme.css file from jquery.ui there is an image sprite reference for hover state
https://git.drupalcode.org/project/drupal/-/blob/10.1.x/core/themes/clar...

I fixed this within my inspector by editing an .ui-dialog .ui-icon.ui-icon-closethick existing class

.ui-dialog .ui-button:hover .ui-icon.ui-icon-closethick,
.ui-dialog .ui-icon.ui-icon-closethick,

However, I am not sure if this is what the theme maintainer would want here.

Proposed resolution

Somehow override the image selection from jquery.ui with claro theme images for the close button with a hover state applied.

Remaining tasks

User interface changes

API changes

Data model changes

Release notes snippet

🐛 Bug report
Status

Active

Version

10.1

Component
Claro 

Last updated 3 days ago

Created by

🇺🇸United States trackleft2 Tucson, AZ 🇺🇸

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.71.5 2024