Skip to content

fix(esl-carousel): add vertical orientation support for css-slide renderer#3594

Merged
ala-n merged 2 commits intomainfrom
fix/esl-carousel-vertical-slide-renderer
Jan 27, 2026
Merged

fix(esl-carousel): add vertical orientation support for css-slide renderer#3594
ala-n merged 2 commits intomainfrom
fix/esl-carousel-vertical-slide-renderer

Conversation

@dshovchko
Copy link
Collaborator

@dshovchko dshovchko commented Jan 26, 2026 •
edited
Loading

  • implemented vertical layout styles using translate3d and top positioning
  • optimized shared transition styles using :is() pseudo-class
  • optimized rendering performance using visibility: hidden for inactive slides

@dshovchko
fix(esl-carousel): add vertical orientation support for css-slide ren…
9231553 
…derer

- implemented vertical layout styles using translate3d and top positioning
- optimized shared transition styles using :is() pseudo-class
@dshovchko dshovchko self-assigned this Jan 26, 2026
@dshovchko dshovchko added bug Something isn't working needs review The PR is waiting for review labels Jan 26, 2026
Copilot AI reviewed Jan 26, 2026
View reviewed changes
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR adds vertical orientation support to the CSS slide renderer for the ESL carousel component. The implementation mirrors the existing horizontal orientation patterns while adapting positioning and transforms for vertical scrolling.

Changes:

  • Refactored animation transition styles to apply to both orientations using :is() pseudo-class
  • Added vertical orientation-specific styles using translate3d with Y-axis transforms
  • Implemented vertical slide positioning using top property instead of left

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@qltysh
Copy link

qltysh bot commented Jan 26, 2026 •
edited
Loading

Qlty

Coverage Impact

This PR will not change total coverage.

🚦 See full report on Qlty Cloud »

🛟 Help

  • Diff Coverage: Coverage for added or modified lines of code (excludes deleted files). Learn more.

  • Total Coverage: Coverage for the whole repository, calculated as the sum of all File Coverage. Learn more.

  • File Coverage: Covered Lines divided by Covered Lines plus Missed Lines. (Excludes non-executable lines including blank lines and comments.)

    • Indirect Changes: Changes to File Coverage for files that were not modified in this PR. Learn more.

@dshovchko @ala-n
fix(esl-carousel): fix css renderers to support viewport-in animation…
e56214c 
…s on the slides

- optimized rendering performance using visibility: hidden for inactive slides

Co-authored-by: ala'n (Alexey Stsefanovich) <astsefanovich@exadel.com>
@ala-n ala-n merged commit ffe46c9 into main Jan 27, 2026
8 checks passed
@ala-n ala-n deleted the fix/esl-carousel-vertical-slide-renderer branch January 27, 2026 10:39
@ci-github-action-bot ci-github-action-bot bot locked and limited conversation to collaborators Jan 27, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Reviewers

Copilot code review Copilot Copilot left review comments

@ala-n ala-n ala-n approved these changes

@abarmina abarmina abarmina approved these changes

@fshovchko fshovchko fshovchko approved these changes

@NastaLeo NastaLeo NastaLeo approved these changes

@amarhayova amarhayova amarhayova approved these changes

@yadamskaya yadamskaya Awaiting requested review from yadamskaya

@AlexanderBazukevich AlexanderBazukevich Awaiting requested review from AlexanderBazukevich

Assignees

@dshovchko dshovchko

Labels

bug Something isn't working needs review The PR is waiting for review

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

7 participants

@dshovchko @ala-n @abarmina @fshovchko @NastaLeo @amarhayova