From 37386c26b6b6a7ade64ef9424e8d3b667e6aefe6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Hugo=20H=C3=B6rnquist?= <hugo@lysator.liu.se>
Date: Mon, 6 Apr 2020 14:26:17 +0200
Subject: Popups more or less fixed, now with animations.

---
 static/style.css | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

(limited to 'static/style.css')

diff --git a/static/style.css b/static/style.css
index bd74a239..e7a51a6e 100644
--- a/static/style.css
+++ b/static/style.css
@@ -494,10 +494,16 @@ Find color between gray and lightgray
 */
 
 .event-inner .popup {
-    visibility: hidden;
+    /* visibility: hidden; */
     position: absolute;
-    left: 10%;
-    bottom: 125%;
+    display: block;
+    /* A scale(0%) is chosen for hiding the element for the following reasons:
+       - visibility: hidden still reserves space, which causes unwanted scroll-
+         bars since the final position of the popup is calculated at runtime
+       - Easier animation
+   */
+    transform: scale(0%);
+    transition: transform 0.3s cubic-bezier(0.33, 1, 0.68, 1);
     z-index: 100;
 
     background-color: #dedede;
@@ -543,7 +549,8 @@ Find color between gray and lightgray
 }
 
 .popup.show {
-    visibility: visible;
+    /* visibility: visible; */
+    transform: scale(100%);
 }
 
 .event-inner .body {
-- 
cgit v1.2.3