alex/yomichan
1
Fork 0
Code Releases Activity

Fix overlay panel animations for different action bar locations (#1183)

Browse Source
This commit is contained in:
toasted-nutbread 2020-12-30 13:49:48 -05:00 committed by GitHub
parent 9f2da58bfd
commit 0f3b9ec7fc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
ext/mixed/css/display.css
View File

@ -77,6 +77,8 @@
--entry-current-indicator-triangle-size-no-units: 6; --entry-current-indicator-triangle-size-no-units: 6;
--entry-current-indicator-triangle-size: calc(1em * (var(--entry-current-indicator-triangle-size-no-units) / var(--font-size-no-units))); --entry-current-indicator-triangle-size: calc(1em * (var(--entry-current-indicator-triangle-size-no-units) / var(--font-size-no-units)));
--overlay-panel-translate-distance: 4em;
--animation-duration: 0.125s; --animation-duration: 0.125s;
--animation-duration2: calc(2 * var(--animation-duration)); --animation-duration2: calc(2 * var(--animation-duration));
@ -1506,7 +1508,7 @@ button.action-button[data-icon=source-term]::before {
transform var(--animation-duration2) ease-out; transform var(--animation-duration2) ease-out;
} }
.overlay-panel[hidden] { .overlay-panel[hidden] {
transform: translate(4em, 0); transform: translate(var(--overlay-panel-translate-distance), 0);
opacity: 0; opacity: 0;
visibility: hidden; visibility: hidden;
transition: transition:
@ -1517,6 +1519,15 @@ button.action-button[data-icon=source-term]::before {
.overlay-panel[hidden]:not(.hidden-animating) { .overlay-panel[hidden]:not(.hidden-animating) {
display: none; display: none;
} }
:root[data-popup-action-bar-location=left] .overlay-panel[hidden] {
transform: translate(calc(-1 * var(--overlay-panel-translate-distance)), 0);
}
:root[data-popup-action-bar-location=top] .overlay-panel[hidden] {
transform: translate(0, calc(-1 * var(--overlay-panel-translate-distance)));
}
:root[data-popup-action-bar-location=bottom] .overlay-panel[hidden] {
transform: translate(0, var(--overlay-panel-translate-distance));
}
.overlay-panel-inner { .overlay-panel-inner {
padding: var(--entry-vertical-padding) var(--entry-horizontal-padding); padding: var(--entry-vertical-padding) var(--entry-horizontal-padding);
} }