Problem/Motivation

Edit button for nested paragraphs appears outside of edit area in backend.

Steps to reproduce

Create a paragraph type with an entity reference field, i.e. a paragraph within a paragraph. When editing, the edit button on the right is outside of the edit area.

Proposed resolution

Re-add the following scss to css/paragraphs.widget.scss, that broke the interface when it was removed:

.dropbutton-widget {
  position: static;
}

The corresponding css for the change:

.js .field--widget-paragraphs .dropbutton-widget {
  position: static;
}
CommentFileSizeAuthor
#2 paragraphs-3179874-1.patch762 bytesbartvig
Selection_009.png39.66 KBbartvig

Comments

bartvig created an issue. See original summary.

bartvig’s picture

bartvig commented
StatusFileSize
new paragraphs-3179874-1.patch762 bytes

The attached patch re-adds the css (and scss) that was removed in commit 8c078d390d34a1d72138ce4b8de6bde510ee897c.

taniachque’s picture

taniachque commented
Status: Active » Postponed (maintainer needs more info)

Hello bartvig. Do you still having this problem?
I tried to reproduce the issue but I didn't get it. I created a new paragraph type with an entity reference field too, but the button wasn't out of area when I tried to edit it.
Could you give more information to try to reproduce it please?

msbtterswrth’s picture

msbtterswrth commented

I can confirm this is an issue in the seven admin theme still. I can also confirm adding the above css to a theme override fixes the issue. Will work on creating a patch for this shortly. Missed that there was an existing patch :hides:

This patch did not work for us, however I found one that did here - https://www.drupal.org/project/paragraphs/issues/3331203#comment-14903169.