Rather than just the name of the layout, it'd be great to have the layout icon in the IPE as well! This particularly useful for complex layouts with ambiguous names, like from Radix Layouts.
| Comment | File | Size | Author |
|---|---|---|---|
| #7 | Selection_135.png | 42.22 KB | dsnopek |
| #6 | flexbox.png | 22.43 KB | swentel |
| #6 | 2636506-6.patch | 6.24 KB | swentel |
| #4 | Selection_134.png | 31.48 KB | dsnopek |
| #2 | select-layouts.png | 36.09 KB | swentel |
Comments
Comment #2
swentel commentedAttached patch shows icons now, much better imo. Images have the label of the layout in alt & title tags.
I've had to set the images to a fixed width and height because the images of Display Suite have different dimensions.
The patch also contains an image in case the layout doesn't have preview image, but I'm wondering whether that belongs to layout plugin or not.
This solves the default horizontal scrollbar as well and if you make the screen smaller, the scrollbar pops up, but it doesn't hide the images.
Comment #3
dsnopekScreenshot looks great! This made me think of a follow-up:
#2636990: Layouts should be grouped into categories in the IPE
I think this is best here, rather than Layout Plugin. Layout Plugin tries to make as few opinions as possible to ensure compatibility, and providing a fallback image would make an opinion about what these images should look like, their dimensions, etc. Maybe we'll make such an opinion later after seeing how this works in the real world, but I want to avoid premature standardization.
Comment #4
dsnopekHm. I tried the patch with Radix Layouts enabled and the "Available layouts" fall to a new row, whereas the screenshot from #2 shows them all on a single row:
It'd also be nice to have a little bit of padding between the icons. In the above screenshot, it's hard to tell where one layout ends and the other begins!
Comment #5
swentel commentedyep, I have just enough layouts so both divs (current and other layouts) fit in one row. Working on a patch which uses the technique I use in #2636486: In IPE, the available layouts have scrollbars on them - but even better :)
Comment #6
swentel commentedThis should be better
Comment #7
dsnopekThe latest patch works much better with Radix Layouts! It's still a little chaotic but it's definitely an improvement over the current state, so I think it's acceptable.
Comment #8
samuel.mortensonTwo notes, which we can address in some of the more meta issues around mobile/scale or here:
- On mobile, stacking the layouts may take up the entire screen (or more). That's the original reason we used
overflow-x: auto;.- If two layouts use the same icon, how can we tell them apart? On desktop you can hover to see the title attribute's value, but on mobile this isn't an option.
Comment #10
samuel.mortensonCommitted, we can follow up in #2636990: Layouts should be grouped into categories in the IPE, #2636520: Decide how we scale with large amounts of Block categories, Layouts, and Blocks in the IPE., and #2636522: Improve IPE mobile UX to make sure we have a nice experience on Tablets and Phones..