Dropdown button display becomes narrow when text is long

Created on 5 October 2023, 8 months ago
Updated 21 December 2023, 5 months ago

Problem/Motivation

Claro theme has been great so far, but some layout issues exist.
My project is currently using Workbench Moderation to control moderation states. New buttons underneath the standard Save and Publish button are added to the dropdown. When button text is long and has a dropdown menu, the dropdown text is cut short also save button and preview button are not aligned with each other.

Steps to reproduce

  1. Install 10.1.x version of Drupal core
  2. Download & Enabled contributed Workbench Moderation module.
  3. Enabled the moderation states for the Article content type.
  4. Add/Edit the article content, you can see the dropdown UI issue.

Proposed resolution

Update CSS so dropdown button text is not cut off.

Remaining tasks

Create patch to fix the issue.

User interface changes

Before
With Workbench Moderation

API changes

Data model changes

Release notes snippet

🐛 Bug report
Status

Needs work

Version

10.1

Component
Claro 

Last updated 1 day ago

Created by

🇵🇭Philippines acret_seth

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

Comments & Activities

  • Issue created by @acret_seth
  • 🇮🇳India heykarthikwithu Bengaluru 🌍

    Hi @acret_seth,

    With Workbench Moderation to control moderation states & Claro theme the UX looks different (attached the screenshot)

  • 🇵🇭Philippines acret_seth

    Hello @heykarthikwithu

    Sorry, I think you might have confused the core Workflows module with the contrib Workbench Moderation module.

    I tested a fresh installation of Drupal and enabled contrib Workbench Moderation module.
    I enabled moderation states for the Article content type.
    I used the Claro theme for admin. The dropdown button experiences the same issue still.

    (Attached a screenshot below)

  • 🇮🇳India heykarthikwithu Bengaluru 🌍

    Hi @acret_seth, Able to reproduce the issue with contributed Workbench Moderation module.

    But, this issue should be raised as part of contributed Workbench Moderation module right?
    (template level design for the dropdown can be handled within the contributed module)

  • First commit to issue fork.
  • last update 8 months ago
    Custom Commands Failed
  • @viren18febs opened merge request.
  • Status changed to Needs review 8 months ago
  • 🇮🇳India viren18febS

    Hi @acret_seth,

    I have fixed the issue & MR generated, please review.

  • last update 8 months ago
    29,654 pass
  • Status changed to Needs work 8 months ago
  • 🇺🇸United States smustgrave

    Screenshots should be added to the issue summary.

    Also steps to reproduce without a contrib module should also be added.

  • 🇮🇳India BhumikaVarshney Delhi

    Working on this issue as a part of Claro Contribution Day.

  • 🇮🇳India rifas-ali-pbi Kerala

    This is having layout issue too. Save button and preview button is not aligned each other. Attaching screenshot for the issue.

  • Added standard template and updated IS.
    Thanks

  • 🇮🇳India BhumikaVarshney Delhi

    Hi @acret_seth,
    From the merge request #7 the layout issue mentioned in the summary is getting resolved.
    please refer the screenshot after taking pull.
    Thanks

Production build 0.69.0 2024