javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-17 18:54:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(accordion): add accordion and accordion-group components (#22865)

Browse Source 
resolves #17094
This commit is contained in:
Liam DeBeasi
2021-03-24 09:17:54 -04:00
committed by GitHub
parent 2c53363901
commit 073883a098
40 changed files with 4977 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
core/src/css/core.scss
View File

@ -201,3 +201,41 @@ ion-card-header.ion-color .ion-inherit-color {
.md .menu-content-push {
box-shadow: $menu-md-box-shadow;
}
// Accordion Styles
ion-accordion-group.accordion-group-expand-inset ion-accordion:first-of-type {
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
ion-accordion-group.accordion-group-expand-inset ion-accordion:last-of-type {
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
}
ion-accordion-group ion-accordion:last-of-type ion-item {
--border-width: 0px;
}
ion-accordion.accordion-animated .ion-accordion-toggle-icon {
transition: 300ms transform cubic-bezier(0.25, 0.8, 0.5, 1);
}
@media (prefers-reduced-motion: reduce) {
ion-accordion .ion-accordion-toggle-icon {
/* stylelint-disable declaration-no-important */
transition: none !important;
}
}
ion-accordion.accordion-expanding .ion-accordion-toggle-icon,
ion-accordion.accordion-expanded .ion-accordion-toggle-icon {
transform: rotate(180deg);
}
ion-accordion-group.accordion-group-expand-inset.md ion-accordion.accordion-previous ion-item[slot="header"] {
--border-width: 0px;
--inner-border-width: 0px;
}
ion-accordion-group.accordion-group-expand-inset.md ion-accordion.accordion-expanding:first-of-type,
ion-accordion-group.accordion-group-expand-inset.md ion-accordion.accordion-expanded:first-of-type {
margin-top: 0;
}