From 0f3b9ec7fc2b1c7ba1780d7186dc425c3975c099 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Wed, 30 Dec 2020 13:49:48 -0500 Subject: Fix overlay panel animations for different action bar locations (#1183) --- ext/mixed/css/display.css | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css index 8ebdf756..4c06e492 100644 --- a/ext/mixed/css/display.css +++ b/ext/mixed/css/display.css @@ -77,6 +77,8 @@ --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))); + --overlay-panel-translate-distance: 4em; + --animation-duration: 0.125s; --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; } .overlay-panel[hidden] { - transform: translate(4em, 0); + transform: translate(var(--overlay-panel-translate-distance), 0); opacity: 0; visibility: hidden; transition: @@ -1517,6 +1519,15 @@ button.action-button[data-icon=source-term]::before { .overlay-panel[hidden]:not(.hidden-animating) { 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 { padding: var(--entry-vertical-padding) var(--entry-horizontal-padding); } -- cgit v1.2.3