Bootstrap 5: dropdown is too complicated (outdated)

Created on 1 February 2023, almost 2 years ago
Updated 24 June 2023, over 1 year ago

Problem/Motivation

Current implementation of dropdown is very complicated:

  • split between dropdown & dropdown_item is useless
  • call to button pattern is hardcoded in Twig (3 times!)
    {% if variant|lower != 'btn_group__dropstart' %}
      {{ pattern('button', {
        label: title,
        attributes: split_button_attributes
      }, button_variant) }}
    {% endif %}

    {{ pattern('button', {
      label: 'Toggle Dropdown'|t,
      label_visually_hidden: true,
      attributes: button_attributes.addClass('dropdown-toggle-split').setAttribute('id', false)
    }, button_variant) }}
  {% else %}
    {{ pattern('button', {
      label: title,
      attributes: button_attributes
    }, button_variant) }}
  {% endif %}

Source: https://git.drupalcode.org/project/ui_suite_bootstrap/-/blob/5.0.x/templ...

  • the different cases (split, button group, direction...) are managed by 6 variants & 8 settings

Source: https://git.drupalcode.org/project/ui_suite_bootstrap/-/blob/5.0.x/templ...

Proposed resolution

On ui_suite_bootstrap 4, we have a simpler implementation:

Of course, BS5 dropdown is a bit more complicated than BS4 dropdown:

But we guess it will be OK to add them while keeping the simple structure.

Remaining tasks

I will try to propose a MR soon.

This MR will also change the call to dropdown from navbar-nav.

API changes

Yes, but still in alpha so it is OK.

πŸ› Bug report
Status

Closed: outdated

Version

5.0

Component

Code

Created by

πŸ‡«πŸ‡·France pdureau Paris

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

Merge Requests

Comments & Activities

Not all content is available!

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

Production build 0.71.5 2024