desktop versions modal sieht vernünftig aus

resources/assets/less/metager/foki.less

@@ -5,28 +5,40 @@
 }
 
 #show-create-focus:checked {
-    display: inline-block;
     & + #create-focus-modal {
-        display: inline;
+        display: flex;
     } 
 }
 
 #create-focus-modal {
     display: none;
     position: fixed;
+    justify-content: center;
     min-height: 100%;
-    min-width: 100%;
-    background-color: lightgray;
-
-    #close-create-focus:after {
-        content: "×";
-    }
+    background: linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7));
+    z-index: 150;
 
     #foki-modal-dialog {
+        background-color: white;
+        max-width: 70%;
+        height: 950px;
+        color: black;
+        overflow-y: auto;
 
+        #foki-modal-content {
+            #foki-modal-header {
+                padding: 15px;
+                position: relative;
+                #close-create-focus{
+                    position: absolute;
+                    right: 10px;
+                    &::after {
+                        font-size: 24px;
+                        content: "×";
+                    }
+                }
+            }
+        }
     }
 
-    #foki-modal-content {
-        max-width: 70%;
-    }
 }
\ No newline at end of file

resources/views/modals/create-focus-modal.blade.php

 <input type="checkbox" id="show-create-focus">
 <div id="create-focus-modal" tab-index="-1" role="dialog">
-	<div class="foki-modal-dialog">
-		<div class="foki-modal-content">
-			<div class="foki-modal-header">
-				<label type="button" id="close-create-focus" for="show-create-focus"></label>
+	<div id="foki-modal-dialog">
+		<div id="foki-modal-content">
+			<div id="foki-modal-header">
+				<label type="button" id="close-create-focus" role= "button" for="show-create-focus"></label>
 				<h4>
 					@lang("index.focus-creator.head")
 				</h4>

resources/views/parts/foki.blade.php

@@ -14,7 +14,7 @@
 	<a href="https://maps.metager.de/map/{{ $metager->getQ() }}/9.7380161,52.37119740000003,12" target="_self">@lang('index.foki.maps')</a>
 </div>
 <div class="search-option-frame">
-	<label for="show-create-focus" id="addFocusBtn">
+	<label for="show-create-focus" role="button" id="">
 		<i class="fa fa-sliders"></i>
 	</label>
 	<div class="searchbar-tooltip">