Skatepark: full width image pattern #4396
Conversation
MaggieCabrera
added
the
[Theme] Skatepark
| "core/separator": { | ||
| "border": { | ||
| "width": "0 0 3px 0" | ||
| } | ||
| }, |
There was a problem hiding this comment.
on a first pass, I was using columns and a separator but then changed to use the caption of the image. I'm leaving this here even though it's unrelated, because it may be needed elsewhere
|
@melchoyce we need an alt text for this image |
The problem with this is it makes it hard for users to implement via the block style |
|
I added a commit to update the approach for the aside caption, but I probably missed some cases... |
|
I didn't think about the Block Styles flow for the user, so @scruffian is totally right, using strong is a bad idea. Though his commit doesn't make the caption align with the wide block below. I'm not sure we can actually manage to make it look like the design without the extra wrapper, do you think having it full width aligned is a good compromise @melchoyce?
|
|
I wonder if this should just be an image + column block instead of using a caption 😕 For alt text: |
MaggieCabrera
force-pushed
the
skatepark-full-width-image-pattern
branch
from
153b030 to
6f0e184
Compare
Changes proposed in this Pull Request:
This PR creates a block pattern and a block style for a full-width image with an aside caption. Positioning the caption correctly was incredibly convoluted and brittle without an extra wrapper on the text inside the caption so I wrapped the text in a
strongtag to make it simpler. I'm not sure how much I hate it. Any ideas to improve this are welcome.(the wide group block on the screenshot is not part of the pattern, it's there for reference)
Related issue(s):
Part of #4308