woocommerce/woocommerce-paypal-payments
2
0
Fork 0
mirror of https://github.com/woocommerce/woocommerce-paypal-payments.git synced 2025-09-04 08:47:23 +08:00
Code Issues Projects Packages Wiki Activity Actions 11

💫 Animate accordion open/close action

Browse source
This commit is contained in:
Philipp Stracker 2025-01-22 18:30:10 +01:00
parent 99c7541bb1
commit 74c9647456
No known key found for this signature in database
2 changed files with 21 additions and 6 deletions
Download patch file Download diff file Expand all files Collapse all files

21
modules/ppcp-settings/resources/css/components/reusable-components/_accordion-section.scss
View file

@ -22,11 +22,26 @@
}
.ppcp--accordion-content {
display: none;
margin: 24px 0 0;
display: grid;
grid-template-rows: 0fr;
transition: grid-template-rows 0.2s ease-out, opacity 0.2s ease-out, margin 0.2s ease-out;
opacity: 0;
margin: 0;
> .ppcp--content {
overflow: hidden;
}
&.ppcp--is-open {
display: block;
grid-template-rows: 1fr;
opacity: 1;
margin: 24px 0 0;
transition: grid-template-rows 0.3s ease-in, opacity 0.3s ease-in, margin 0.3s ease-in;
> .ppcp--content {
// Show the overflow, since the focus-outline can extend outside the content div.
overflow: visible;
}
}
}
}