From 5a0ea4306f606143f536cb41c32151be8e533fa6 Mon Sep 17 00:00:00 2001
From: Robin Tuszik <mail@robin.gg>
Date: Fri, 6 Jun 2025 23:03:53 +0200
Subject: [PATCH] fix map container height to fit viewport

---
 app/assets/stylesheets/application.tailwind.css | 5 +++++
 app/views/map/index.html.erb                    | 2 +-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/application.tailwind.css b/app/assets/stylesheets/application.tailwind.css
index 257a1910..0e5c519d 100644
--- a/app/assets/stylesheets/application.tailwind.css
+++ b/app/assets/stylesheets/application.tailwind.css
@@ -103,3 +103,8 @@
   margin-bottom: 1rem;
   width: 100%;
 }
+
+.map-container-full-height {
+    /* 100vh - navbar height - footer height */
+    height: calc(100vh - 165px - 120px);
+}
diff --git a/app/views/map/index.html.erb b/app/views/map/index.html.erb
index 011bf06a..53457526 100644
--- a/app/views/map/index.html.erb
+++ b/app/views/map/index.html.erb
@@ -72,7 +72,7 @@
         data-distance="<%= @distance %>"
         data-points_number="<%= @points_number %>"
         data-timezone="<%= Rails.configuration.time_zone %>">
-        <div data-maps-target="container" class="h-[25rem] rounded-lg w-full min-h-screen z-0">
+        <div data-maps-target="container" class="map-container-full-height rounded-lg w-full z-0">
           <div id="fog" class="fog"></div>
         </div>
       </div>