Skip to content

Scroller mode and full width for teaser lists #2242

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 17 commits into from
Jul 23, 2025
Merged

Conversation

tf
Copy link
Member

@tf tf commented Jun 6, 2025

REDMINE-20981

@tf tf added this to the v17.1 milestone Jun 6, 2025
@tf tf force-pushed the teaser-scroller branch 3 times, most recently from 1afe817 to 7af3184 Compare June 11, 2025 13:30
@tf tf force-pushed the teaser-scroller branch from d7da793 to fe55e08 Compare July 16, 2025 14:46
tf added 17 commits July 23, 2025 09:32
- Make different content max widths available as custom properties -
  including defaults set by different layouts.

- Make content-max-width unset in full width instead of setting it to
  `none`. This allows using different fallback values in vars.

- Do not reset `content-margin` for full width elements. So far,
  `content-margin` has only be used in the non full width
  case. Keeping it unchanged lets full width element align children
  with content margin.

REDMINE-20981
Behind feature flag for now.

REDMINE-20981
- Activate custom margin to allow placing scroll buttons in content
  margin.

- Base item width on reference width instead of container width when
  element has full width. This allows aligning items width different
  content max widths even if element spans full width. Calculate
  padding to align items with other section content based on content
  margin and section max width.

- Optionally render scroller. When full width is used, apply padding
  as scoll padding + margin for the first and last item to make
  padding at the end of the scroller work.

- For centered layout, initially align first and last item with
  section content when scroller is moved to beginning/end
  respectively.

REDMINE-20981
Transforming a scroll snapped element moves the scroller.

REDMINE-20981
Allow rendering action button in floating portals.

REDMINE-20981
- Implement based on floating-ui

- Use portal to prevent clipping in teaser list scroller

REDMINE-20981
Prevent l and xl items from exceeding the width they would have if the
viewport was wide enough to for the maximum number of columns to be
used.

REDMINE-20979
Workflow is no longer needed now that Localeapp is gone. Some of those
started showing up in the UI due to recent change.
* For item widths that result in items that are less wide than the
  element, apply the max width to the scroller to prevent showing
  partial items. Center scroll in container.

* Use layout widths as reference for items in full width list.

REDMINE-20981
@tf tf force-pushed the teaser-scroller branch from fe55e08 to 35bbc09 Compare July 23, 2025 15:21
@tf tf marked this pull request as ready for review July 23, 2025 15:38
@tf tf merged commit 11bd78a into codevise:master Jul 23, 2025
13 checks passed
@tf tf deleted the teaser-scroller branch July 23, 2025 15:38
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.

1 participant