Skip to content

fix(accordion): update styles for ionic theme#31023

Merged
OS-susmitabhowmik merged 26 commits into
nextfrom
ROU-11979-fix-accordian-styles
Mar 25, 2026
Merged

fix(accordion): update styles for ionic theme#31023
OS-susmitabhowmik merged 26 commits into
nextfrom
ROU-11979-fix-accordian-styles

Conversation

@OS-susmitabhowmik

@OS-susmitabhowmik OS-susmitabhowmik commented Mar 19, 2026 •
edited
Loading

Copy link
Copy Markdown

Issue number: resolves internal

What is the current behavior?

There were several issues in the ionic theme which are resolved in this PR:

  • The last item of an accordion had a divider
  • The pressed state color did not match design specifications
  • Nested accordions did not have not have horizontal padding, causing the focus state to be different from the parent accordion

What is the new behavior?

The following changes were made in the ionic theme:

  • Removed the divider from the final accordion item
  • Update the pressed state color to match design specifications
  • Add additional horizontal padding for nested accordion items

Does this introduce a breaking change?

  • Yes
  • No

Other information

@vercel

vercel Bot commented Mar 19, 2026 •
edited
Loading

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ionic-framework Ready Ready Preview, Comment Mar 24, 2026 10:40pm

Request Review

@github-actions github-actions Bot added the package: core @ionic/core package label Mar 19, 2026
@OS-susmitabhowmik OS-susmitabhowmik added type: bug a confirmed bug report and removed package: core @ionic/core package labels Mar 19, 2026
@OS-susmitabhowmik OS-susmitabhowmik changed the title fix(accordion): Remove last item divider, update pressed state background color, and add header padding for ionic theme fix(accordion): remove last item divider, update pressed state background color, and add header padding for ionic theme Mar 19, 2026
@github-actions github-actions Bot added the package: core @ionic/core package label Mar 19, 2026
thetaPC
thetaPC requested changes Mar 20, 2026
View reviewed changes
Comment thread core/src/components/accordion/accordion.tsx Outdated
thetaPC
thetaPC requested changes Mar 23, 2026
View reviewed changes
Comment thread core/src/components/accordion/test/nested/index.html
Comment thread core/src/components/item/item.ionic.scss Outdated
Comment thread core/src/components/accordion/accordion.tsx Outdated
Comment thread core/src/components/accordion/accordion.tsx Outdated
Comment thread core/src/components/accordion/test/states/accordion.e2e.ts
@thetaPC

thetaPC commented Mar 23, 2026

Copy link
Copy Markdown
Contributor

@OS-susmitabhowmik Also please update the PR title to be shorter, thanks!

@github-actions github-actions Bot added the package: angular @ionic/angular package label Mar 24, 2026
@OS-susmitabhowmik OS-susmitabhowmik force-pushed the ROU-11979-fix-accordian-styles branch from 807b6dc to f6ecd8f Compare March 24, 2026 00:34
@github-actions github-actions Bot removed the package: angular @ionic/angular package label Mar 24, 2026
@OS-susmitabhowmik OS-susmitabhowmik changed the title fix(accordion): remove last item divider, update pressed state background color, and add header padding for ionic theme fix(accordion): update styles for ionic theme Mar 24, 2026
@OS-susmitabhowmik

OS-susmitabhowmik commented Mar 24, 2026

Copy link
Copy Markdown
Author

@OS-susmitabhowmik Also please update the PR title to be shorter, thanks!

@thetaPC Updated!

thetaPC
thetaPC requested changes Mar 24, 2026
View reviewed changes

@thetaPC thetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Based off my reply, this can be done without adding a class after testing it locally. Please let me know if I'm misunderstanding the issue.

thetaPC
thetaPC approved these changes Mar 24, 2026
View reviewed changes

@thetaPC thetaPC left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

LGTM

@OS-susmitabhowmik OS-susmitabhowmik merged commit 8f1b005 into next Mar 25, 2026
49 checks passed
@OS-susmitabhowmik OS-susmitabhowmik deleted the ROU-11979-fix-accordian-styles branch March 25, 2026 16:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@thetaPC thetaPC thetaPC approved these changes
@BenOsodrac BenOsodrac Awaiting requested review from BenOsodrac BenOsodrac is a code owner automatically assigned from ionic-team/framework

Assignees

No one assigned

Labels

package: core @ionic/core package type: bug a confirmed bug report

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

3 participants

@OS-susmitabhowmik @thetaPC @Ionitron