search

backdrop-contrib / gin

Admin theme with a strong focus on improving the Editorial Experience.
https://backdropcms.org/project/gin
GNU General Public License v2.0
5 stars 2 forks source link

Vertical node tabs in References Dialog modal not accessible #151

Open olafgrabienski opened 2 months ago

olafgrabienski commented 2 months ago

Using the beta-6 release, in a modal powered by References Dialog only the first vertical node tab is accessible. Other tabs are visible but not accessible / clickable.

Screenshot:

olafgrabienski commented 2 months ago

Maybe related to changes made for https://github.com/backdrop-contrib/gin/issues/114?

laryn commented 2 months ago

@olafgrabienski Could you test this PR and let me know if it's any better for you? https://github.com/backdrop-contrib/gin/pull/152

olafgrabienski commented 2 months ago

@laryn Thanks for the PR! At first sight, it doesn't make any difference regarding the issue. The vertical tabs (fieldsets in Gin) are still not accessible.

The PR looks quite big, by the way. Does it address other issues as well? Maybe a smaller fix could do the job here. Using the dev tools code inspector, I see that the following CSS prevents the fieldset content from showing up:

.js fieldset.collapsed .fieldset-wrapper {
  display: none;
}

Example fieldset:

<fieldset class="node-form-author collapsible collapsed form-wrapper" id="edit-author">
  <legend><span class="fieldset-legend">Authoring information</span></legend>
  <div class="fieldset-wrapper">
    <div class="form-item form-type-textfield form-item-name">
      <label for="edit-name">Authored by </label>
      <input type="text" id="edit-name" (...)>
      <input type="hidden" (...)>
    <div class="description">Leave blank for <em class="placeholder">Anonymous</em>.</div>
  </div>
  (...)
</fieldset>