Claro dropbutton non-link items need solid background

Created on 25 October 2022, over 2 years ago
Updated 5 May 2023, almost 2 years ago

In the Claro theme, dropbutton items that do not have a url associated with them have a transparent background, which makes the dropdown list visually broken. The items need a solid background otherwise the text underneath shows through and makes the text hard to read. Items without a url are used to indicate grayed-out options that are not available, or as group separators, such as in the example below:

For comparison, the same dropdown list renders fine in Olivero, and also the deprecated Seven

🐛 Bug report
Status

Needs review

Version

9.5

Component
Claro 

Last updated about 6 hours ago

Created by

🇬🇧United Kingdom jonathan1055

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

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • 🇮🇳India ravi kant Jaipur

    @Nitin Shrivastava,

    I try to install 2.0.0-rc6 as the following URL https://www.drupal.org/project/scheduler/releases/2.0.0-rc6
    But it installing the latest version and This issue has been fixed in the latest version 2.0.0-rc8.

  • Status changed to Postponed: needs info almost 2 years ago
  • 🇺🇸United States smustgrave

    Is this is an issue that's currently happening in core without scheduler?

  • 🇬🇧United Kingdom jonathan1055

    It would be apparent in core without Scheduler, if we found a place where a dropbutton item is used as a divider/group heading/greyed-out option, and therefore does not have a url associated with it. I don't think I'm breaking any rules by using the dropbuttons this way? The fact that Olivero and Seven both have solid backgrounds for non-urls makes it feel like this was an intended use, and that Claro got missed.

  • 🇺🇸United States smustgrave

    So should this be re-opened.

  • 🇬🇧United Kingdom jonathan1055

    Yes I've just checked on core 11.1-dev and it is still a problem - see new screenshot.
    I have not seen it in a core drop-down, but as I said before, given that the equivalent styling in other themes has a solid background for the non-active menu items it should really be done for Claro too. The fix shown in #2 (without the initial .scheduler-admin-form identifier) could be added to the appropriate core .css file.

  • 🇮🇳India snehal-chibde

    Hello, I have checked this on Drupal Version 11.1.6 , Claro theme and the solid background color is there for all the options despite they have been set to use scheduler or not.
    I have also checked this on Drupal Version 11.0.dev version for Claro theme.
    Added screenshots below for reference.

  • 🇬🇧United Kingdom jonathan1055

    @snehal-chibde Thanks, but the reason it works is that Scheduler provides the solid background specifically to solve this problem. See my comments in #2 and #4 above. Here is the css override that the project uses. If you edit your scheduler .css and remove those lines you will see that the background colour disappears.

Production build 0.71.5 2024