Contrib.social

Missing Drag Handle Icons in Safari for Draggable Items

Open on Drupal.org →
Created on 23 January 2024, 10 months ago
Updated 11 April 2024, 7 months ago

Problem/Motivation

I've encountered an issue with the Gin admin theme on Drupal where the drag handle icons for draggable items (such as menu items or paragraph items) are not visible when using Safari browser. This issue makes it difficult to rearrange these items via drag-and-drop functionality.

Steps to reproduce

Log in to the Drupal site using Safari browser.
Navigate to a page where draggable items are present (e.g., menu management page, paragraphs within a content type).
Observe the area where drag handle icons should appear next to the draggable items.
Expected Result:
Drag handle icons should be visible next to each draggable item, allowing for easy drag-and-drop rearrangement.

Actual Result:

Drag handle icons are not visible in Safari, though the space for them is present. This lack of visual cues makes it unclear where to click and drag to rearrange items.

Environment:

Drupal version: [10.2.2]
Gin theme version: [Gin 8.x-3.0-rc8 ]
Browser: Safari [Version 16.2]
Operating System: [macOS 12.6.2]

Additional Information:

The issue does not occur in other browsers (e.g., Chrome, Firefox).

[screenshots attached]

🐛 Bug report
Status

Fixed

Version

3.0

Component

User interface

Created by

🇨🇦Canada puya

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

Merge Requests

Comments & Activities

  • Issue created by @puya
  • Comment 10 months ago →
    🇮🇳India djsagar

    Hi @puya, i found the same issue in safari.

    Steps to reproduce

    1. Open local in safari browser.
    2. Install the theme set as an administration theme.
    3. GO to the admin/structure/block/li>
    4. you will find the issue/li>
      Safari browser.

    Add background color for safari, background color coming for chrome and firefox browser.
    background-color: var(--gin-color-text-light);

    Firefox

  • Assigned to rupeshghar
  • Comment 10 months ago →
    🇮🇳India rupeshghar
  • Merge request !376Drag handle fixed for safari browser. → (Merged) created by rupeshghar
  • Pipeline finished with Success
    10 months ago
    Total: 210s
    #85382
  • Issue was unassigned.
  • Status changed to Needs review 10 months ago
  • Comment 10 months ago →
    🇮🇳India rupeshghar

    I have added fix for safari 16 version in MR. Please find screenshot attached

  • Status changed to RTBC 10 months ago
  • Comment 10 months ago →
    🇮🇳India sdhruvi5142

    Hi, Verified and tested #4 patch file on 10.x version. It is working as expected now.
    Followed the below testing steps:
    1. Open local in safari browser 16 Version
    2. Install the GIN theme [Gin 8.x-3.0-rc8 ] set as an administration theme.
    3. Go to the
    4. Observed the changes here

    Testing Result:
    Now the drag icon are visible properly in safari browser.
    Attaching the screenshot for reference
    Hence moving it to RTBC.
    Thanks!

  • Pipeline finished with Success
    8 months ago
    Total: 186s
    #131576
  • Status changed to Fixed 8 months ago
  • Comment 8 months ago →
    🇨🇭Switzerland saschaeggi Zurich

    Awesome, thanks for this fix 🚀👏🦓

  • Comment 7 months ago →
    System Message

    Automatically closed - issue fixed for 2 weeks with no activity.

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024