From f2028df4895ed1cf9095f2e94d032964336c9f57 Mon Sep 17 00:00:00 2001
From: Guilhem Moulin <guilhem@fripost.org>
Date: Thu, 18 Jan 2024 13:32:48 +0100
Subject: CSS: Fade-in layer selection and legend panels.

---
 style.css | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

(limited to 'style.css')

diff --git a/style.css b/style.css
index 1189fa1..9a8002d 100644
--- a/style.css
+++ b/style.css
@@ -186,7 +186,6 @@ html, body {
 #layer-selection-panel,
 #map-legend-panel {
   position: relative;
-  display: block;
   min-width: min-content;
   max-width: 35%;
   width: revert;
@@ -196,6 +195,20 @@ html, body {
   --bs-modal-color: var(--bs-body-color);
   --bs-modal-padding: .75rem;
 }
+@keyframes fade-in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+#layer-selection-panel[aria-hidden="false"],
+#map-legend-panel[aria-hidden="false"] {
+  animation: fade-in .25s ease-in-out both;
+  display: block;
+}
+
 @media screen and (max-width: 576px) {
   #layer-selection-panel,
   #map-legend-panel {
-- 
cgit v1.2.3