From 3f34e288db2d618e420de59044877c2d5303fcbb Mon Sep 17 00:00:00 2001
From: Tobias <t@tobiasjordans.de>
Date: Thu, 21 Jan 2021 04:48:52 +0100
Subject: [PATCH] Introduce max-h-65vh

I need this to refactor the featureinfobox and sub-classes.

Ideally we could add this class via tailwind.config.js but for some reason it does not work; the class does not appear in the index.css file.

As a workaround I added it differently, but still we should probably figure out why the config file does not work as expeced.
---
 index.css          | 9 +++++++++
 tailwind.config.js | 8 +++++++-
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/index.css b/index.css
index 077aea4..fd9ab2d 100644
--- a/index.css
+++ b/index.css
@@ -2,6 +2,15 @@
 @tailwind components;
 @tailwind utilities;
 
+@layer utilities {
+  @variants responsive {
+    .max-h-65vh {
+      max-height: 65vh;
+    }
+  }
+}
+
+
 :root {
     --subtle-detail-color: #e5f5ff;
     --subtle-detail-color-contrast: black;
diff --git a/tailwind.config.js b/tailwind.config.js
index 82f3a82..d9eca07 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -5,7 +5,13 @@ module.exports = {
   ],
   darkMode: false, // or 'media' or 'class'
   theme: {
-    extend: {},
+    extend: {
+      // This does not work and I don't know why.
+      // Luckily index.css "@layer utilities" has the same effekt.
+      // maxHeight: {
+      //   '65vh': '65vh',
+      // },
+    },
   },
   variants: {
     extend: {},