#3769 - Reconsider how media images are handled
-
By Paul Flavel
- Added
- 5 views
| Identifier | #3769 |
|---|---|
| Issue type | Feature request or suggestion |
| Title | Reconsider how media images are handled |
| Status | Completed |
| Tags |
Roadmap: v11 (custom) |
| Handling member | Salman |
| Addon | core_rich_media |
| Description | Have noticed the simple css is not included in the latest release.
[itemprop="articleBody"] img { max-width: 100%; height: auto; } Without it uploaded images if not manually adjusted will exceed the width of the container. Also would it be possible to that is an image is reduced in dimensions in a news post to have allow it to be clicked on and have a modal popup. |
| Steps to reproduce | |
| Funded? | No |
The system will post a comment when this issue is modified (e.g., status changes). To be notified of this, click "Enable comment notifications".
Comments
[itemprop="articleBody"] img:not([width]):not([height]) {
max-width: 100%;
height: auto;
}
Otherwise if you explicitly scale with a height (expecting the width to be automatically kept in proportion), it'll get skewed.
We already do this if the 'attachment' CSS class is present, which is the case for attachments that are set with 'framed'.
We can consider doing it more broadly. In such a case though, it shouldn't just be considered for news, it should be considered as a general rule.
Adding a link to make the full image open in an overlay would be thorny. The presence of such a link would depend on screen size, so JavaScript would need to be involved. And then, we don't necessarily want to assume it, so it would need to be a media setting (some people will just want images to be 'responsive', i.e. scaled with the pixels available but not caring about the image being expandable). But if we make it a media setting, we have to take into account media settings are not available by default for images in WYSIWYG because they are immediately set to 'WYSIWYG editable' and with no media setting dialog (for simplicity). At least OTTOMH that's what happens.
Really to approach this well we should consider the full set of use cases for how people might use images, and how to make those properly configurable without adding too much cognitive overhead to the settings.
A forum topic relating to attachment images, the need for padding:
https://compo.sr/forum/topicview/browse/developing/imgages-in-forums.htm?post_id=6818&redirected=1#post_6818
1) I think we can universalise the "max-width: 100%; height: auto;" on all images (without width/height specified). I can't think of any situation where people would want an image to overflow, it's just a legacy behaviour of browsers we can override.
2) If images are set with automatic settings, they will be made clickable as requested. People can remove the <a> in the WYSIWYG if they do not want that.