Skip to content
Snippets Groups Projects
Commit 2b2cff64 authored by Aria Givi's avatar Aria Givi
Browse files

Dialog laesst sich oeffnen

parent f73c3b19
No related branches found
No related tags found
5 merge requests!1262WIP: Resolve "Spendenseite Texte anpassen",!1207WIP: Resolve "Rechtschreibfehler",!1198Meta ger redesign,!1131Meta ger redesign,!1105Searchbar button redesign
......@@ -22,9 +22,9 @@ function setSearchbarActionListeners () {
$('.focusCheckbox').click(checkboxCheckListener);
$('#addFocusBtn').click(() => showFocusCreateDialog(''));
$('#editFocusBtn').click(editCurrentFocus);
$('#toggleOptBtn').click(toggleOptionsDialog);
$('.save-focus-btn').click(saveFocus);
$('.delete-focus-btn').click(deleteFocus);
$('.search-focus-selector').click(toggleOptionsDialog);
$('#focus-select').change(focusChanged);
// Save Focus on clicking enter while in the focus name input
$('#focus-name').keyup(function (event) {
......@@ -379,16 +379,28 @@ function getFocusInUrl () {
}
function toggleOptionsDialog() {
var btnMode = $('.toggleOptBtn').attr('data-mode');
if (btnMode == 'open') {
$('.toggleOptBtn').attr('data-mode', 'close');
$('.toggleOptBtn').html('<i class="fa fa-chevron-up" aria-hidden="true"></i>');
var btnMode = $('#toggleOptBtn').attr('data-mode');
if (btnMode == 'o') {
openOptionsDialog();
} else {
$('.toggleOptBtn').attr('data-mode', 'open');
$('.toggleOptBtn').html('<i class="fa fa-chevron-down" aria-hidden="true"></i>');
closeOptionsDialog();
}
}
function openOptionsDialog() {
$('#toggleOptBtn').html('<i class="fa fa-chevron-up" aria-hidden="true"></i>');
$('#toggleOptBtn').attr('data-mode', 'c');
$('.search-option-frame').css('display', 'inline-block');
}
function closeOptionsDialog() {
$('#toggleOptBtn').html('<i class="fa fa-chevron-down" aria-hidden="true"></i>');
$('#toggleOptBtn').attr('data-mode', 'o');
$('.search-option-frame').css('display', 'none');
}
function checkboxCheckListener (event) {
toggleDeleteButton();
......
......@@ -22,9 +22,9 @@ function setSearchbarActionListeners () {
$('.focusCheckbox').click(checkboxCheckListener);
$('#addFocusBtn').click(() => showFocusCreateDialog(''));
$('#editFocusBtn').click(editCurrentFocus);
$('#toggleOptBtn').click(toggleOptionsDialog);
$('.save-focus-btn').click(saveFocus);
$('.delete-focus-btn').click(deleteFocus);
$('.search-focus-selector').click(toggleOptionsDialog);
$('#focus-select').change(focusChanged);
// Save Focus on clicking enter while in the focus name input
$('#focus-name').keyup(function (event) {
......@@ -379,16 +379,28 @@ function getFocusInUrl () {
}
function toggleOptionsDialog() {
var btnMode = $('.toggleOptBtn').attr('data-mode');
if (btnMode == 'open') {
$('.toggleOptBtn').attr('data-mode', 'close');
$('.toggleOptBtn').html('<i class="fa fa-chevron-up" aria-hidden="true"></i>');
var btnMode = $('#toggleOptBtn').attr('data-mode');
if (btnMode == 'o') {
openOptionsDialog();
} else {
$('.toggleOptBtn').attr('data-mode', 'open');
$('.toggleOptBtn').html('<i class="fa fa-chevron-down" aria-hidden="true"></i>');
closeOptionsDialog();
}
}
function openOptionsDialog() {
$('#toggleOptBtn').html('<i class="fa fa-chevron-up" aria-hidden="true"></i>');
$('#toggleOptBtn').attr('data-mode', 'c');
$('.search-option-frame').css('display', 'inline-block');
}
function closeOptionsDialog() {
$('#toggleOptBtn').html('<i class="fa fa-chevron-down" aria-hidden="true"></i>');
$('#toggleOptBtn').attr('data-mode', 'o');
$('.search-option-frame').css('display', 'none');
}
function checkboxCheckListener (event) {
toggleDeleteButton();
......
......@@ -12,6 +12,7 @@
&>button {
border: none;
background-color: white;
margin: 5px;
}
......@@ -23,47 +24,59 @@
appearance: none;
background-color: transparent;
padding-right: 35px;
border: 1px solid #ccc;
border-radius: 4px;
}
}
.search-button-container {
.search-option-frame {
display: none;
position: absolute;
margin-top: 145px;
padding: 1%;
border: 1px solid #ccc;
border-radius: 4px;
}
.search-add-focus {
//display: flex;
button {
background-color: white;
border: none;
padding: 0px 8px;
font-size: 16px;
&:hover {
background-color: #e6e6e6;
.search-button-container {
display: flex;
.search-add-focus {
//display: flex;
button {
background-color: white;
border: none;
padding: 0px 8px;
font-size: 16px;
&:hover {
background-color: #e6e6e6;
}
}
}
}
.search-edit-focus {
//display: flex;
button {
background-color: white;
border: none;
padding: 0px 8px;
font-size: 16px;
&:hover {
background-color: #e6e6e6;
.search-edit-focus {
//display: flex;
button {
background-color: white;
border: none;
padding: 0px 8px;
font-size: 16px;
&:hover {
background-color: #e6e6e6;
}
}
}
}
.search-settings {
//display: flex;
a.btn {
border: none;
padding: 0px 8px;
display: flex;
align-items: center;
font-size: 16px;
.search-settings {
//display: flex;
a.btn {
border: none;
padding: 0px 8px;
display: flex;
align-items: center;
font-size: 16px;
}
}
}
.search-input-submit {
flex-grow: 1;
display: flex;
......@@ -103,11 +116,6 @@
}
}
.search-focus-selector {
background-color: white;
position: relative;
text-overflow: ellipsis;
}
.searchform-bonus {
li {
......
......@@ -4,7 +4,7 @@
<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-focus-selector">
<button type="button" class="toggleOptBtn" data-mode="open">
<button type="button" id="toggleOptBtn" data-mode="o">
<i class="fa fa-chevron-down"></i>
</button>
<div class="search-option-frame" style="display:none;">
......@@ -15,38 +15,38 @@
<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>
</div>
<div class="search-button-container">
<div class="search-add-focus js-only">
<button type="button" id="addFocusBtn">
<i class="fa fa-plus"></i>
</button>
<div class="searchbar-tooltip">
<div class="searchbar-tooltip-arrow">
</div>
<div class="searchbar-tooltip-content">
<p>{{{ trans('index.add-focus') }}}</p>
<div class="search-button-container">
<div class="search-add-focus js-only">
<button type="button" id="addFocusBtn">
<i class="fa fa-plus"></i>
</button>
<div class="searchbar-tooltip">
<div class="searchbar-tooltip-arrow">
</div>
<div class="searchbar-tooltip-content">
<p>{{{ trans('index.add-focus') }}}</p>
</div>
</div>
</div>
</div>
</div>
<div class="search-edit-focus js-only">
<button type="button" id="editFocusBtn" title="@lang('index.edit-focus')">
<i class="fa fa-wrench"></i>
</button>
<div class="searchbar-tooltip">
<div class="searchbar-tooltip-arrow">
<div class="search-edit-focus js-only">
<button type="button" id="editFocusBtn" title="@lang('index.edit-focus')">
<i class="fa fa-wrench"></i>
</button>
<div class="searchbar-tooltip">
<div class="searchbar-tooltip-arrow">
</div>
<div class="searchbar-tooltip-content">
<p>{{{ trans('index.edit-focus') }}}</p>
</div>
</div>
</div>
<div class="searchbar-tooltip-content">
<p>{{{ trans('index.edit-focus') }}}</p>
<div class="search-settings">
<a id="settings-btn" class="mutelink btn btn-default" href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "settings ") }}">
<i class="fa fa-cog" aria-hidden="true"></i>
</a>
</div>
</div>
</div>
<div class="search-settings">
<a id="settings-btn" class="mutelink btn btn-default" href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "settings ") }}">
<i class="fa fa-cog" aria-hidden="true"></i>
</a>
</div>
</div>
<div class="search-input-submit">
<div class="search-input">
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment