Merge branch '685' into 'MetaGer-Redesign'

685

See merge request !1175

resources/assets/less/metager/foki.less

@@ -2,6 +2,8 @@
 
 #show-create-focus:checked {
     &+#create-focus-modal {
+        display: -webkit-box;
+        display: -ms-flexbox;
         display: flex;
     }
 }
@@ -9,16 +11,19 @@
 #create-focus-modal {
     display: none;
     position: fixed;
-    justify-content: center;
+    -webkit-box-pack: center;
+        -ms-flex-pack: center;
+            justify-content: center;
     min-height: 100%;
     width: 100%;
+    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .7)), to(rgba(0, 0, 0, .7)));
     background: linear-gradient(rgba(0, 0, 0, .7), rgba(0, 0, 0, .7));
     z-index: 150;
     #foki-modal-dialog {
         background-color: white;
         max-width: 700px;
         margin: 30px auto;
-        height: 900px;
+        height: 90vh;
         overflow-y: auto;
         #foki-modal-content {
             #foki-modal-header {
@@ -57,9 +62,7 @@
                 &~.row {
                     -webkit-transition: max-height 0.4s ease;
                     /* Chrome 1-25, Safari 3.2+ */
-                    -moz-transition: max-height 0.4s ease;
                     /* Firefox 4-15 */
-                    -o-transition: max-height 0.4s ease;
                     /* Opera 10.50–12.00 */
                     transition: max-height 0.4s ease;
                     max-height: 400px;

resources/assets/less/metager/general.less

@@ -250,6 +250,13 @@ button {
         opacity: 0;
         transition: opacity 0.5s ease;
     }
+
+    &.hide-tooltip-on-resultpage:after { /* Auf kleinen Bildschirmen wird der Tooltip nicht angezeigt */
+        @media (max-width: 700px) {
+            display: none;
+        }
+    }
+
     &.delayed:after {
         transition-delay: 0.5s;
     }

resources/assets/less/metager/searchbar.less

@@ -339,25 +339,27 @@ header:nth-child(1) {
         display: flex;
         width: 100%;
         max-width: @resultpage-leftbox-max-width;
-    background-color: white;
-    border: 1px solid #ccc;
-    box-shadow: 0px 1px 1.5px 0px rgba(0, 0, 0, 0.12), 1px 0px 1px 0px rgba(0, 0, 0, 0.24);
-        overflow-x: auto;
+        background-color: white;
+        border: 1px solid #ccc;
+        box-shadow: 0px 1px 1.5px 0px rgba(0, 0, 0, 0.12), 1px 0px 1px 0px rgba(0, 0, 0, 0.24);
+        overflow-x: visible;
         padding: 10px;
-        overflow-x: auto;   
-    &>div {
-        padding: 0px 10px;
-        &>a {
-            color: black;
+        @media (max-width: 700px) {
+            overflow-x: auto;
         }
+        &>div {
+            padding: 0px 10px;
+            &>a {
+                color: black;
+            }
             &.active>a {
                 border-bottom: 1px solid rgb(255, 128, 0);
                 color: rgb(255, 128, 0);
+            }
         }
-    }
         .edit-focus {
-        margin-left: 7px;
-    }
+            margin-left: 7px;
+        }
         /* Scrollbar Style */
         &::-webkit-scrollbar {
             height: 0px;

resources/views/parts/foki.blade.php

@@ -13,7 +13,7 @@
 <div id="maps">
 	<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">
+<div class="search-option-frame hide-tooltip-on-resultpage" data-tooltip="Eigene Suche erstellen">
 	<label for="show-create-focus" role="button" id="">
 		<i class="fa fa-sliders"></i>
 	</label>