Toolbar tray items are unclickable on really small viewport (below 16.5em)

Created on 4 March 2019, almost 6 years ago
Updated 12 May 2023, over 1 year ago

Problem/Motivation

It's impossible to click toolbar tray menu items on really small viewport width (below 16.5em) because toolbar tabs (that have icons) have higher z-index than the tray.

Proposed resolution

Provide higher z-index for unoriented toolbar tray than 502 (it's defined in toobar.icons.theme.css).

Remaining tasks

Patch.

User interface changes

Clickable/tappable tray menu links in unoriented toolbar mode.

API changes

Nothing.

Data model changes

Nothing.

Screenshot before patch

🐛 Bug report
Status

Needs work

Version

9.5

Component
Toolbar 

Last updated 27 days ago

  • Maintained by
  • 🇫🇷France @nod_
Created by

🇭🇺Hungary huzooka Hungary 🇭🇺🇪🇺

Live updates comments and jobs are added and updated live.
  • Needs tests

    The change is currently missing an automated test that fails when run with the original code, and succeeds when the bug has been fixed.

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.

  • Open in Jenkins → Open on Drupal.org →
    Environment: PHP 8.1 & MySQL 5.7
    last update over 1 year ago
    30,330 pass
  • 🇮🇳India pradipmodh13 Ahmedabad

    Hello @huzooka,
    I have generated a new patch in accordance with D9 because your patch is in D8 and the ticket is for D9, thus the patch is not applying.
    There is a better solution presented for screens less than 16.5 em since if we attempt with z-index, the other options won't be seen.
    If we try with z-index then other option will not visible so provided one better solution for below 16.5 em screen
    In response to a request, I've included CSS with a specific focus on breakpoints below 16.5 em to achieve narrow viewport design.
    Since everything is working fine on above 16.5 em, it is a good idea to limit CSS to max-width: 16.49 em so that it won't conflict with any existing code.
    I tried this patch with these admin theme Bartik, Claro, Olivero, Seven, and stark and it working fine as expected.
    Note: Also this patch is working fine with with admin toolbar module.
    Please review.

    For ref attached screenshot.

  • Status changed to Needs work over 1 year ago
  • 🇺🇸United States smustgrave

    Seems like a bug that could benefit from a test case.

Production build 0.71.5 2024