gin-table-scroll-wrapper prevents nested paragraph buttons from being clickable
>>> [!note] Migrated issue <!-- Drupal.org comment --> <!-- Migrated from issue #3375350. --> Reported by: [pcate](https://www.drupal.org/user/3513833) Related to !281 >>> <h3 id="summary-problem-motivation">Problem/Motivation</h3> <p>After upgrading to RC5 I've found an issue where nested paragraphs add buttons at the bottom of a paragraph form are no longer clickable because they are being overlapped by invisible <code>gin-table-scroll-wrapper</code> div. </p> <p>I believe this problem was introduced with the <a href="https://www.drupal.org/project/gin/issues/3344925">https://www.drupal.org/project/gin/issues/3344925</a> changes.</p> <p>Removing the <code>240px</code> bottom padding and <code>240px</code> negative bottom margin CSS seems to fix the issue. I'm not sure of the original reason for these CSS properties being set, so I'm not sure if remove these would affect other things.</p> <h4 id="summary-steps-reproduce">Steps to reproduce</h4> <ol> <li>Add a paragraph field to a node with a few different paragraph types as well as a nested paragraphs.</li> <li>Set the paragraph's field form display to have the "Add mode" set to "Button" so individual add buttons are shown at the bottom of the field.</li> <li>Add a new node and try to add additional paragraphs with the bottom add buttons.</li> <li>The buttons should not be clickable and inspecting with the browser dev tools should show the nested paragraph's <code>gin-table-scroll-wrapper</code> div covering the buttons.</li> </ol> <h3 id="summary-proposed-resolution">Proposed resolution</h3> <p>Remove the <code>240px</code> bottom padding and <code>240px</code> negative bottom margin CSS from the <code>gin-table-scroll-wrapper</code> element.</p> <h3 id="summary-remaining-tasks">Remaining tasks</h3> <ol> <li>Reproduce issue</li> <li>Agree on solution</li> <li>Implement solution</li> </ol> <h3 id="summary-ui-changes">User interface changes</h3> <p>None</p> <h3 id="summary-api-changes">API changes</h3> <p>None</p> <h3 id="summary-data-model-changes">Data model changes</h3> <p>None</p> > Related issue: [Issue #3372776](https://www.drupal.org/node/3372776) > Related issue: [Issue #3380569](https://www.drupal.org/node/3380569)
issue