Skip to content

Conversation

@wesleyboar
Copy link
Member

@wesleyboar wesleyboar commented Dec 19, 2025

Overview

Given an article main image of thumbnail size with no set width, then that image should not shrink less than width of content.

Important

Status

  • News Article Page Image
    • Let editor choose article main image size to be full-width.
    • Prepare to update image thumb. opt.s of all sites with News.
    • Refactor CSS for main article image to style image not container .blog-visual.
      Use a container query.
  • News Feed List Image
    • Let editor choice of news feed image size control image width.
    • Ensure image is wide enough for grid layout.
      ⚠️ Warning: 2f19a1a introduces bug.
      💡 Idea: Allow image size to define grid item width!

Related

Changes

Article Page

  • renamed mixins to express what its styles do
    • news-article-page__media--slim-context…--layout-center
    • news-article-page__media--wide-context…--layout-float
  • moved mixins news-article-page__media--…
    • from x-news.css
    • to django.cms.blog.app.page.css
  • changed mixin …--layout-center to be used only if main image thumb. opt. has 0 width
  • added thumb. opt. values into HTML (for CSS)
    • data-width
    • data-height

News Feed

Testing

UI

Given an article main image of thumbnail size with no set width,
Then that image should not be shrunk less than width of content.
@wesleyboar wesleyboar marked this pull request as draft December 19, 2025 19:40
Given a news feed image of thumbnail size with large width,
Then that image should not be shrunk less if space is available.

BUG: If on grid layout (e.g. narrow screen), 300 width image too narrow.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants