Error after enabling environment_indicator_toolbar

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

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?

- 🐛 Gin Compatibility: Account for "open" vertical toolbar Active
- 📌 Update module to use CSS variables instead of adding inline CSS. Active

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

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

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.

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

https://mr111-9szdrkjpjwhiv06rgrncbsjlyq5m4iav.tugboatqa.com/

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 🌱 [META] Release Plan for Environment Indicator Patch (bugfix) Release 4.0.24 Needs review

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

Thank you

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