Problem/Motivation
When first trying out Layout Builder+, I completely overlooked the toolbar at the bottom of the page. After changing a block, there was a message at the top of the page, but it was unclear to me how to actually save the changes.

Steps to reproduce
- Enable Layout Builder on a content type
- Enable per-content layout
- Visit the Layout tab on a node
- Make an change to the layout
- Note the warning message
Proposed resolution
Easiest solution might just be to describe how to save / where the save button is. i.e. "You have unsaved changes. Use the layout toolbar at the bottom of the window to save."
Another more difficult solution would be to add a link to save in the message: "You have unsaved changes. Click here to save."
| Comment | File | Size | Author |
|---|---|---|---|
| #3 | after-3404507.png | 332.88 KB | tanuj. |
| #3 | before-3404507.png | 312.3 KB | tanuj. |
| #2 | improved-ui-buttons-3404507-2.patch | 812 bytes | tanuj. |
| ksnip_20231127-163918.png | 163.84 KB | quicksketch |
Comments
Comment #2
tanuj. commentedhey @quicksketch tried a different approach to handle this, instead of changing the warning message i tried to improve the UI for toolbar with more focus on buttons so it doesn't feel like a footer. this will also tackle the situation where if the layout has more elements the message stays on top of page and the user just scrolls past it this new button design will be visible clearly to user in such case.
attaching a patch for this, if this solutions looks good will create a MR.
Comment #3
tanuj. commentedAttaching before and after screenshots of Toolbar button improvement.
Before
After
Comment #4
quicksketchAwesome, I think that alone will be a big help.
Comment #6
tim bozeman commentedNice! I tweaked it a tiny bit so that it matches #3404509: Use Hand/Move cursor for block library.
Thank you!