Commit 32425c9e authored by Aria Givi's avatar Aria Givi
Browse files

Fokus-Selector aus dem Dropdown ausgelagert

parent 481d1544
...@@ -390,7 +390,7 @@ function toggleOptionsDialog() { ...@@ -390,7 +390,7 @@ function toggleOptionsDialog() {
function openOptionsDialog() { function openOptionsDialog() {
$('#toggleOptBtn').html('<i class="fa fa-chevron-up" aria-hidden="true"></i>'); $('#toggleOptBtn').html('<i class="fa fa-chevron-up" aria-hidden="true"></i>');
$('#toggleOptBtn').attr('data-mode', 'c'); $('#toggleOptBtn').attr('data-mode', 'c');
$('.search-option-frame').css('display', 'inline-block'); $('.search-option-frame').css('display', 'flex');
} }
......
...@@ -390,7 +390,7 @@ function toggleOptionsDialog() { ...@@ -390,7 +390,7 @@ function toggleOptionsDialog() {
function openOptionsDialog() { function openOptionsDialog() {
$('#toggleOptBtn').html('<i class="fa fa-chevron-up" aria-hidden="true"></i>'); $('#toggleOptBtn').html('<i class="fa fa-chevron-up" aria-hidden="true"></i>');
$('#toggleOptBtn').attr('data-mode', 'c'); $('#toggleOptBtn').attr('data-mode', 'c');
$('.search-option-frame').css('display', 'inline-block'); $('.search-option-frame').css('display', 'flex');
} }
......
...@@ -12,6 +12,7 @@ ...@@ -12,6 +12,7 @@
&>button { &>button {
border: none; border: none;
border-right: 1px solid rgb(170, 170, 170);
background-color: white; background-color: white;
margin: 5px; margin: 5px;
} }
...@@ -24,19 +25,21 @@ ...@@ -24,19 +25,21 @@
appearance: none; appearance: none;
background-color: transparent; background-color: transparent;
padding-right: 35px; padding-right: 35px;
border: 1px solid #ccc;
border-radius: 4px;
} }
} }
.search-option-frame { .search-option-frame {
display: none; display: none;
position: absolute; position: absolute;
margin-top: 150px; top: 290px;
padding: 1%; padding: 1%;
border: 1px solid rgb(175, 175, 175); border: 1px solid rgb(175, 175, 175);
border-radius: 4px; border-radius: 4px;
@media (max-width: @screen-xs-max) {
top: 160px;
}
.searchbar-options-arrow { .searchbar-options-arrow {
width: 0; width: 0;
height: 0; height: 0;
...@@ -167,7 +170,7 @@ ...@@ -167,7 +170,7 @@
border-left: 1px solid #aaa; border-left: 1px solid #aaa;
} }
} }
*:not(.search-submit) { *:not(.search-submit, .searchbar-options-arrow) {
width: 100%; width: 100%;
} }
} }
...@@ -185,12 +188,14 @@ ...@@ -185,12 +188,14 @@
position: absolute; position: absolute;
margin-top: 40px; margin-top: 40px;
&>.searchbar-tooltip-arrow { &>.searchbar-tooltip-arrow {
position: absolute;
top: -5px;
left: -20px;
width: 0; width: 0;
height: 0; height: 0;
border-left: 5px solid transparent; border-left: 5px solid transparent;
border-right: 5px solid transparent; border-right: 5px solid transparent;
border-bottom: 5px solid #ff8000; border-bottom: 5px solid #ff8000;
margin-left: 5%;
} }
&>.searchbar-tooltip-content { &>.searchbar-tooltip-content {
position: relative; position: relative;
......
...@@ -7,16 +7,16 @@ ...@@ -7,16 +7,16 @@
<button type="button" id="toggleOptBtn" data-mode="o"> <button type="button" id="toggleOptBtn" data-mode="o">
<i class="fa fa-chevron-down"></i> <i class="fa fa-chevron-down"></i>
</button> </button>
<select id="focus-select" name="focus" style="font-family: FontAwesome, sans-serif;">
<option value="web" style="font-family: FontAwesome, sans-serif;" selected>&#xf0ac; Websuche</option>
<option value="nachrichten" style="font-family: FontAwesome, sans-serif;">&#xf0a1; Nachrichtensuche</option>
<option value="wissenschaft" style="font-family: FontAwesome, sans-serif;">&#xf15c; Wissenschaftssuche</option>
<option value="produktsuche" style="font-family: FontAwesome, sans-serif;">&#xf07a; Produktsuche</option>
<option value="maps" style="font-family: FontAwesome, sans-serif;">&#xf279; Kartensuche</option>
</select>
<div class="search-option-frame" style="display:none;"> <div class="search-option-frame" style="display:none;">
<div class="searchbar-options-arrow"> <div class="searchbar-options-arrow">
</div> </div>
<select id="focus-select" name="focus" style="font-family: FontAwesome, sans-serif;">
<option value="web" style="font-family: FontAwesome, sans-serif;" selected>&#xf0ac; Websuche</option>
<option value="nachrichten" style="font-family: FontAwesome, sans-serif;">&#xf0a1; Nachrichtensuche</option>
<option value="wissenschaft" style="font-family: FontAwesome, sans-serif;">&#xf15c; Wissenschaftssuche</option>
<option value="produktsuche" style="font-family: FontAwesome, sans-serif;">&#xf07a; Produktsuche</option>
<option value="maps" style="font-family: FontAwesome, sans-serif;">&#xf279; Kartensuche</option>
</select>
<div class="search-button-container"> <div class="search-button-container">
<div class="search-add-focus js-only"> <div class="search-add-focus js-only">
<button type="button" id="addFocusBtn"> <button type="button" id="addFocusBtn">
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment