Sprachauswahl zu Suche hinzugefügt

resources/assets/less/metager/general.less

@@ -109,12 +109,15 @@ p {
 
 #startpage-logo {
     .logo;
+    display: flex;
+    justify-content: center;
     margin: 0px 0px 45px 0px;
     white-space: nowrap;
     text-align: center;
     &>a {
         .logo;
         display: block;
+        width: fit-content;
         text-decoration: none;
         font-size: 75px;
         @media(max-width: @screen-xs-max) {
@@ -175,8 +178,8 @@ summary {
  */
 
 *[data-tooltip] {
+    position: relative;
     &:hover {
-        position: relative;
         &:after {
             opacity: 1;
         }

resources/assets/less/metager/result.less

@@ -89,7 +89,6 @@
         margin-top: 10px;
         display: flex;
         flex-wrap: wrap;
-        overflow: auto;
         &>*:not(:first-child) {
             margin-left: 20px;
         }

resources/assets/less/metager/searchbar.less

@@ -27,9 +27,17 @@
         display: -ms-flexbox;
         display: flex;
         max-width: 600px;
-        .search-key {
+        #search-lang {
+            #input-lang {
+                background-color: transparent;
+                border: none;
+            }
+        }
+        #search-lang,
+        #search-key {
             display: flex;
             z-index: 1;
+            #input-lang,
             #input-key {
                 margin: 0;
                 padding: 0px;
@@ -37,6 +45,9 @@
                 box-shadow: none;
                 height: 40px;
                 width: 0px;
+                outline-color: green;
+                transition: width 0.5s, padding 0.5s, outline-color 0s, border-color 0s, box-shadow 0s;
+                transition-delay: 0.3s;
                 &:focus {
                     width: 200px;
                     padding: 6px 10px 6px 10px;
@@ -45,11 +56,14 @@
                     box-shadow: 0px 0px 2px 2px rgba(255, 128, 0, 1);
                     border-color: rgba(255, 128, 0, 1);
                     border-radius: 4px;
+                    +#lang-label,
                     +#key-label {
-                        display: none;
+                        visibility: hidden;
+                        width: 0px;
                     }
                 }
             }
+            #lang-label,
             #key-label {
                 cursor: pointer;
                 height: 40px;
@@ -58,6 +72,8 @@
                 display: flex;
                 align-items: center;
                 justify-content: center;
+                transition: width 0s, visibility 0s;
+                transition-delay: 0.3s;
             }
         }
         .search-input {
@@ -115,11 +131,8 @@
         @media (max-width: @screen-xs-max) {
             max-width: initial;
         }
-        .search-key {
-            border-right: 1px solid @startpage-border-color;
-        }
-        .search-submit {
-            border-left: 1px solid #aaa;
+        >:not(:first-child) {
+            border-left: 1px solid @startpage-border-color;
         }
     }
     @media (max-width: @screen-xs-max) {

resources/assets/less/metager/specific.less

@@ -180,6 +180,7 @@ main {
         overflow: visible !important;
     }
     .result-footer {
+        overflow: hidden;
         align-items: center;
     }
     .open-result-options label {

resources/lang/de/index.php

@@ -41,7 +41,9 @@ return [
     'about.2.1'                      => 'Wir arbeiten nicht gewinnorientiert, wir sind ein <a href="/spende">gemeinnütziger Verein</a>: <a href="/beitritt">Werden Sie Mitglied!</a>',
     'about.3.1'                      => '',
 
+    'lang.tooltip'                   => 'Ergebnissprache wählen',
     'key.placeholder'                => 'Mitglieder Key eingeben',
+    'key.tooltip'                    => 'Mitglieder Key eingeben',
     'placeholder'                    => 'MetaGer: Sicher suchen & finden, Privatsphäre schützen',
 
     'plugin.head.1'                  => 'MetaGer zum Firefox hinzufügen',

resources/views/parts/searchbar.blade.php

@@ -4,9 +4,20 @@
 	<form id="searchForm" method={{ $request }} action="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/meta/meta.ger3 ") }}" accept-charset="UTF-8">
 		<div class="searchbar {{$class or ''}}">
 			<div class="search-input-submit">
-				<div class="search-key">
+				<div id="search-lang">
+					<select id="input-lang" name="lang">
+						<option value="all">Alle Sprachen</option>
+						@foreach(LaravelLocalization::getSupportedLocales() as $localeCode => $properties)
+							<option value="{{$localeCode}}">{{{ $properties['native'] }}}</option>
+						@endforeach
+					</select>
+					<label id="lang-label" for="input-lang" data-tooltip="{{ trans ('index.lang.tooltip') }}">
+						<i class="fa fa-globe" aria-hidden="true"></i>
+					</label>
+				</div>
+				<div id="search-key">
 					<input id="input-key" type="text" name="key" placeholder="{{ trans ('index.key.placeholder') }}">
-					<label id="key-label" for="input-key">
+					<label id="key-label" for="input-key" data-tooltip="{{ trans ('index.key.tooltip') }}">
 						<i class="fa fa-key" aria-hidden="true"></i>
 					</label>
 				</div>