Commit ee0d0a37 authored by Dominik Hebeler's avatar Dominik Hebeler
Browse files

Merge branch '552-metager-navigationsleiste-dropdowns-schoner-machen' into 'development'

Resolve "Metager Navigationsleiste-Dropdowns schöner machen"

Closes #552

See merge request !984
parents 6911352d dfd39646
......@@ -111,11 +111,11 @@ ul.metager-dropdown-menu {
-ms-transition: max-height 1s ease, padding 1s ease;
-o-transition: max-height 1s ease, padding 1s ease;
transition: max-height 1s ease, padding 1s ease;
-webkit-transition-delay:.2s;
-moz-transition-delay:.2s;
-ms-transition-delay:.2s;
-o-transition-delay:.2s;
transition-delay:.2s;
-webkit-transition-delay: .2s;
-moz-transition-delay: .2s;
-ms-transition-delay: .2s;
-o-transition-delay: .2s;
transition-delay: .2s;
&>li>a {
display: block;
padding: 3px 20px;
......@@ -168,13 +168,32 @@ ul.metager-dropdown-menu {
}
}
a.metager-dropdown-toggle:hover+ul.metager-dropdown-menu,
a.metager-dropdown-toggle:focus+ul.metager-dropdown-menu,
ul.metager-dropdown-menu:hover,
#gutscheine>a:first-child:hover+a+ul.metager-dropdown-menu {
max-height: 1000px;
padding: 5px 0;
border: 1px solid @metager-dropdown-toggle-hover-or-focus-color;
@keyframes dropdown-animation {
0% {
max-height: 0px;
padding: 0px 0;
border: none
}
1% {
padding: 5px 0;
border: 1px solid @metager-dropdown-toggle-hover-or-focus-color;
}
100% {
max-height: 1000px;
padding: 5px 0;
border: 1px solid @metager-dropdown-toggle-hover-or-focus-color;
}
}
.metager-dropdown:hover {
background-color: @metager-navbar-toggle-hover-background-color;
&>.metager-dropdown-menu {
animation-name: dropdown-animation;
animation-duration: 0.7s;
animation-timing-function: ease-out;
animation-fill-mode: forwards;
animation-delay: 0.1s;
}
}
.metager-navbar-toggle {
......@@ -190,9 +209,6 @@ ul.metager-dropdown-menu:hover,
&:visited {
color: @metager-navbar-toggle-visited-color;
}
&:hover {
background-color: @metager-navbar-toggle-hover-background-color;
}
}
#toggle-nav-hide .metager-navbar-toggle {
......
......@@ -28,7 +28,7 @@ return [
'nav23' => 'Beitrittsformular SUMA-EV',
'nav24' => 'MetaGer Quellcode',
'nav25' => 'MetaGer App',
'gutscheineToggle' => '<a href="https://metager.de/gutscheine/">Gutscheine</a>',
'gutscheineToggle' => 'Gutscheine',
'gutscheine.1' => 'Gutscheine',
'gutscheine.2' => 'Congstar Gutschein',
'gutscheine.3' => 'Check24 Gutschein',
......
......@@ -27,7 +27,7 @@ return [
"nav23" => "Admitting formular SUMA-EV",
"nav24" => "MetaGer source code",
"nav25" => "MetaGer App",
"gutscheineToggle" => " \t<a href=\"https://metager.de/gutscheine/\">Coupons</a>",
"gutscheineToggle" => "Coupons",
"gutscheine.1" => "Coupons",
"gutscheine.2" => "Congstar Coupons",
"gutscheine.3" => "Check 24 Coupons",
......
......@@ -69,7 +69,7 @@
</li>
@if(LaravelLocalization::getCurrentLocale() === "de")
<li id="gutscheine"@if (isset($navbarFocus) && $navbarFocus === 'gutscheine') class="metager-dropdown active" @else class="metager-dropdown" @endif >
{!! trans('staticPages.gutscheineToggle') !!}
<a href="https://metager.de/gutscheine/">{!! trans('staticPages.gutscheineToggle') !!}</a>
<a class="metager-dropdown-toggle" data-role="button" aria-expanded="false" tabindex="205"><span class="caret"></span></a>
<ul class="metager-dropdown-menu">
<li>
......
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