[design] improve bounce animation
This commit is contained in:
parent
6fbd8d4d2d
commit
8ad199cc15
|
@ -72,9 +72,9 @@
|
|||
height: 2.5em;
|
||||
width: 15em;
|
||||
transition:
|
||||
width var(--layout-transition-extra-fast) var(--layout-duration-04),
|
||||
width var(--layout-duration-04) var(--layout-timing-bounce) var(--layout-duration-04),
|
||||
height var(--layout-transition-extra-fast),
|
||||
margin var(--layout-transition-extra-fast) var(--layout-duration-04);
|
||||
margin var(--layout-duration-04) var(--layout-timing-bounce) var(--layout-duration-04);
|
||||
}
|
||||
|
||||
.is-group-area-justify-center .group-header-item-control:not(:only-child):not(:last-child),
|
||||
|
|
|
@ -903,12 +903,12 @@
|
|||
|
||||
.is-edit.is-link-orientation-top .link-control {
|
||||
top: 0;
|
||||
transition: top var(--layout-duration-05) var(--layout-timing-bounce);
|
||||
transition: top var(--layout-duration-04) var(--layout-timing-bounce);
|
||||
}
|
||||
|
||||
.is-edit.is-link-orientation-bottom .link-control {
|
||||
bottom: 0;
|
||||
transition: bottom var(--layout-duration-05) var(--layout-timing-bounce);
|
||||
transition: bottom var(--layout-duration-04) var(--layout-timing-bounce) var(--layout-duration-01);
|
||||
}
|
||||
|
||||
.link-control-item {
|
||||
|
@ -1043,7 +1043,7 @@
|
|||
overflow: hidden;
|
||||
display: none;
|
||||
align-items: center;
|
||||
transition: top var(--layout-transition-extra-fast), bottom var(--layout-transition-extra-fast);
|
||||
transition: top var(--layout-transition-extra-fast), bottom var(--layout-duration-04) var(--layout-timing-bounce);
|
||||
}
|
||||
|
||||
.is-link-orientation-top .link-url {
|
||||
|
|
|
@ -63,7 +63,7 @@
|
|||
|
||||
.is-theme-custom-edit .theme-custom-control {
|
||||
bottom: 0;
|
||||
transition: bottom var(--layout-duration-05) var(--layout-timing-bounce);
|
||||
transition: bottom var(--layout-duration-04) var(--layout-timing-bounce) var(--layout-duration-01);
|
||||
}
|
||||
|
||||
.theme-custom-control .theme-custom-control-item {
|
||||
|
|
|
@ -147,7 +147,7 @@
|
|||
--layout-duration-09: 0.9s;
|
||||
--layout-duration-10: 1s;
|
||||
--layout-timing-ease: ease-in-out;
|
||||
--layout-timing-bounce: cubic-bezier(0.68, -0.55, 0.27, 1.55);
|
||||
--layout-timing-bounce: cubic-bezier(0.8, 0.8, 0.4, 1.4);
|
||||
--layout-transition-extra-fast: var(--layout-duration-02) var(--layout-timing-ease);
|
||||
--layout-transition-fast: var(--layout-duration-04) var(--layout-timing-ease);
|
||||
--layout-transition-medium: var(--layout-duration-06) var(--layout-timing-ease);
|
||||
|
|
Loading…
Reference in New Issue