Problem/Motivation

As this new submodule is a way to integrate toolbar better I have enabled it and there is some problem with Gin vertical toolbar. Before enabling the submodule toolbar looks like this:

Gin toolbar without submodule

With submodule toolbar is hidden under the menu:

Hidden toolbar

CommentFileSizeAuthor
#6 Screenshot 2025-06-17 at 10.23.28 AM.jpg19.72 KBgareth.poole
#6 Screenshot 2025-06-17 at 10.23.16 AM.jpg17.66 KBgareth.poole
Screenshot 2025-06-16 at 09.26.22.png83 KBa.dmitriiev
Screenshot 2025-06-16 at 09.27.07.png97.91 KBa.dmitriiev

Issue fork environment_indicator-3530287

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

a.dmitriiev created an issue. See original summary.

a.dmitriiev’s picture

a.dmitriiev commented
Title: Error after enabling environment_indicator_toolbar » Toolbar is hidden after enabling environment_indicator_toolbar

trackleft2 made their first commit to this issue’s fork.

trackleft2’s picture

trackleft2
Primary language English
Location Tucson, AZ 🇺🇸
commented

I've been attempting to reproduce the error described here, but have not been successful so far.

Here are the variables in my set up.
Gin: 4.0.6
Gin Toolbar: 2.0.0
Drupal: 10.3.14 or Drupal
Environment Indicator 4.0.22

Environment Indicator Toolbar Integration Enabled.

In Gin I am using the vertical toolbar.

Safari on MacOs, or Chrome on MacOs using a mobile view port.

My environment_indicator.settings configuration looks like this:

_core:
  default_config_hash: RHFPAppLk6zO1dvgmh8B7KnqfC2cFwvZapHp4z8YWhs
toolbar_integration: {  }
favicon: true
version_identifier: environment_indicator_current_release
version_identifier_fallback: deployment_identifier

My environment_indicator.indicator configuration looks like this:

name: Test
fg_color: '#ffffff'
bg_color: '#dd3f8f'

What does you configuration look like?
Does the solution on either of these issues resolve the issue?

- #3336512: Handle theming completely via CSS and CSS custom properties
- #3467210: Update module to use CSS variables instead of adding inline CSS via Javascript.

trackleft2’s picture

trackleft2
Primary language English
Location Tucson, AZ 🇺🇸
commented
Status: Active » Postponed (maintainer needs more info)
gareth.poole’s picture

gareth.poole
Location Wellington, New Zealand
commented
StatusFileSize
new Screenshot 2025-06-17 at 10.23.16 AM.jpg17.66 KB
new Screenshot 2025-06-17 at 10.23.28 AM.jpg19.72 KB

I'm also seeing this with

Gin: 4.0.6
Gin Toolbar: 2.0.0
Drupal: 10.4.8
Environment Indicator 4.0.23

toolbar_integration: {  }
favicon: true
version_identifier: environment_indicator_current_release
version_identifier_fallback: deployment_identifier
a.dmitriiev’s picture

a.dmitriiev commented

My Setup:

Drupal core: 11.1.7
Gin Toolbar 2.0.0
Gin Admin Theme 4.0.6
Environment Indicator 4.0.22

environment_indicator.settings:

toolbar_integration: { }
favicon: true
version_identifier: environment_indicator_current_release
version_identifier_fallback: deployment_identifier

nicodh’s picture

nicodh commented

Same for me, it seems to be fixed by changing toolbar.css (some stylelint rules):

environment_indicator/modules/environment_indicator_toolbar/css/toolbar.css

.gin--vertical-toolbar .toolbar-menu-administration>.toolbar-menu>.menu-item .toolbar-menu {
    margin-inline-start: calc(
        // stylelint-disable custom-property-pattern
        // See https://www.drupal.org/i/3309113
        // See https://www.drupal.org/i/3524015
        var(--gin-toolbar-width-collapsed, var(--ginToolbarWidthCollapsed)) - 4px
        // stylelint-enable custom-property-pattern
    );
}

.gin--vertical-toolbar[data-toolbar-menu="open"] .toolbar-menu-administration>.toolbar-menu>.menu-item .toolbar-menu {
    margin-inline-start: calc(
        // stylelint-disable custom-property-pattern
        // See https://www.drupal.org/i/3309113
        // See https://www.drupal.org/i/3524015
        var(--gin-toolbar-width, var(--ginToolbarWidth)) - 4px
        // stylelint-enable custom-property-pattern
    );
}

Needs to be:

.gin--vertical-toolbar .toolbar-menu-administration>.toolbar-menu>.menu-item .toolbar-menu {
    margin-inline-start: calc(
        var(--gin-toolbar-width-collapsed, var(--ginToolbarWidthCollapsed)) - 4px
    );
}

.gin--vertical-toolbar[data-toolbar-menu="open"] .toolbar-menu-administration>.toolbar-menu>.menu-item .toolbar-menu {
    margin-inline-start: calc(
        var(--gin-toolbar-width, var(--ginToolbarWidth)) - 4px
    );
}

trackleft2 changed the visibility of the branch 4.0.x to hidden.

trackleft2 opened merge request !111

trackleft2’s picture

trackleft2
Primary language English
Location Tucson, AZ 🇺🇸
commented

Thanks @nicodh! I've added a merge request that hopefully resolves the issue?

trackleft2’s picture

trackleft2
Primary language English
Location Tucson, AZ 🇺🇸
commented
Status: Postponed (maintainer needs more info) » Needs review

  • trackleft2 committed 1e672e25 on 4.x 
    Issue #3530287 by a.dmitriiev, gareth.poole, trackleft2, nicodh: Toolbar...

  • trackleft2 authored 5b15eeee on 4.0.x 
    Issue #3530287 by a.dmitriiev, gareth.poole, trackleft2, nicodh: Toolbar...
trackleft2’s picture

trackleft2
Primary language English
Location Tucson, AZ 🇺🇸
commented

I went ahead and merged the fix, but I'll hold off on creating a release until I get confirmation that the fix works for you all.

See https://www.drupal.org/project/environment_indicator/issues/3530665

nicodh’s picture

nicodh commented

MR works well for my test sites (2-3 for now)

trackleft2’s picture

trackleft2
Primary language English
Location Tucson, AZ 🇺🇸
commented
Status: Needs review » Reviewed & tested by the community

Thank you

trackleft2’s picture

trackleft2
Primary language English
Location Tucson, AZ 🇺🇸
commented
Status: Reviewed & tested by the community » Fixed

Status: Fixed » Closed (fixed)

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