Skip to content

GitLab

Commit 9e67adbc authored by Aria Givi's avatar Aria Givi
Browse files

Merged Metager-Sidebar

parents d2349b04 67218959
Hide whitespace changes
Inline Side-by-side
resources/assets/less/metager/sidebar.less
View file @ 9e67adbc
@metager-dropdown-toggle-hover-or-focus-color: fade(@static-pages-color-black, 15%);
@metager-dropdown-menu-background-color: @static-pages-color-white;
@metager-dropdown-menu-box-shadow-color: fade(@static-pages-color-black, 17.5%);
@metager-dropdown-menu-li-a-color: @static-pages-color-almost-black;
@metager-dropdown-menu-li-a-hover-color: @static-pages-color-strong-grey;
@metager-dropdown-menu-li-a-hover-background-color: @static-pages-color-almost-white;
#closeSidebar {
z-index: 998;
font-size: 36px;
position: fixed;
top: 0px;
right: 20px;
color: grey;
&:after {
content: "≡";
}
&:hover {
color: rgb(255,128,0);
}
}
.sideBar {
position: fixed;
display: block;
right: -140px;
top: 0;
width: 200px;
right: -260px;
width: 260px;
height: 100%;
background-color: #FFF;
overflow: hidden;
overflow-y: auto;
transition: 0.3s;
transition: 0.5s;
z-index: 999;
& * {
display: inline-block;
}
&>label {
position: fixed;
position: absolute;
font-size: 36px;
top: 0px;
right: 20px;
color: grey;
&:after {
content: "≡";
content: "×";
}
&:hover {
color: rgb(255,128,0);
}
}
&>ul {
padding-top: 20%;
padding-left: 0%;
}
& a {
font-size: 12px;
font-size: 16px;
line-height: 20px;
text-decoration: none;
text-indent: 12px;
width: 160px;
&:visited {
color: blue;
width: 100%;
color: black;
&:hover {
color: red;
}
}
input#nav0:checked~& {
border-left: 1px solid LightGray;
right: 0px;
& * {
display: inline-block;
& p {
width: 90%;
text-align: center;
font-weight: bold;
font-style: italic;
font-size: large;
background-color: rgb(255,128,0);
border-radius: .25em;
color: white;
cursor: default;
margin: 5%
}
& .caret {
position: absolute;
left: 90%;
margin-top: 8px;
}
ul.metager-dropdown-menu {
list-style-type: none;
padding-left: 0;
top: 100%;
left: auto;
z-index: 1000;
float: left;
min-width: 160px;
margin: 2px 0 0;
margin-top: 0;
list-style: none;
font-size: 14px;
text-align: left;
background-color: @metager-dropdown-menu-background-color;
border-radius: 4px;
box-shadow: 0 6px 12px @metager-dropdown-menu-box-shadow-color;
background-clip: padding-box;
max-height: 0px;
overflow: hidden;
&>li>a {
display: block;
font-size: 12px;
padding: 3px 20px;
width: 100%;
clear: both;
font-weight: normal;
line-height: 1.42857143;
color: @metager-dropdown-menu-li-a-color;
&:hover {
text-decoration: none;
color: @metager-dropdown-menu-li-a-hover-color;
background-color: @metager-dropdown-menu-li-a-hover-background-color;
}
label:after {
content: "×";
}
label:after {
#navbar-static-pages {
z-index: 4;
width: 100%;
}
@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;
}
*:not(label) {
display: none;
}
#metager-static-nav-list > li: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-static-nav-list>li {
width: 100%;
padding-top: 10%;
padding-bottom: 10%;
border-bottom: 1px solid LightGray;
}
@media (max-width: 979px) {
#metager-static-nav-list {
width: 100%;
overflow: hidden;
}
#metager-static-nav-list:target {
max-height: 1000px;
}
ul.metager-dropdown-menu {
position: inherit;
width: 100%;
border-radius: 0;
box-shadow: initial;
}
}
input#nav0:checked {
& ~.sideBar {
right: 0px;
}
}
\ No newline at end of file
resources/assets/less/metager/static-pages.less
View file @ 9e67adbc
@quicktip-background-color: @static-pages-color-white;
@metager-dropdown-menu-background-color: @static-pages-color-white;
@metager-dropdown-menu-box-shadow-color: fade(@static-pages-color-black, 17.5%);
@metager-dropdown-menu-li-a-color: @static-pages-color-almost-black;
@metager-dropdown-menu-li-a-hover-color: @static-pages-color-strong-grey;
@metager-dropdown-menu-li-a-hover-background-color: @static-pages-color-almost-white;
@spruch-color: @static-pages-spruch-color;
@spruch-border-left-color: @spruch-color;
@spruch-author-color: @static-pages-color-grey;
@metager-dropdown-toggle-hover-or-focus-color: fade(@static-pages-color-black, 15%);
@metager-navbar-toggle-color: @static-pages-color-grey;
@metager-navbar-toggle-background-color: @static-pages-color-white;
@metager-navbar-toggle-border-color: @static-pages-color-almost-white;
@metager-navbar-toggle-visited-color: @static-pages-color-grey;
@metager-navbar-toggle-hover-background-color: @static-pages-color-almost-white;
@toggle-nav-hide-or-metager-navbar-toggle-background-color: @static-pages-color-almost-white;
@toggle-nav-hide-or-metager-navbar-toggle-background-color: rgb(255,128,0);
@more-information-ul-li-color: @static-pages-color-grey;
@more-information-h2-color: @static-pages-color-grey;
@div-right-background-color: @static-pages-color-almost-white;
......@@ -82,41 +76,6 @@ nav {
}
}
ul.metager-dropdown-menu {
list-style-type: none;
padding-left: 0;
top: 100%;
left: auto;
z-index: 1000;
float: left;
min-width: 160px;
margin: 2px 0 0;
margin-top: 0;
list-style: none;
font-size: 14px;
text-align: left;
background-color: @metager-dropdown-menu-background-color;
border-radius: 4px;
box-shadow: 0 6px 12px @metager-dropdown-menu-box-shadow-color;
background-clip: padding-box;
max-height: 0px;
overflow: hidden;
&>li>a {
display: block;
padding: 3px 20px;
clear: both;
font-weight: normal;
line-height: 1.42857143;
color: @metager-dropdown-menu-li-a-color;
white-space: nowrap;
&:hover {
text-decoration: none;
color: @metager-dropdown-menu-li-a-hover-color;
background-color: @metager-dropdown-menu-li-a-hover-background-color;
}
}
}
#mglogo {
color: rgb(255, 128, 0);
text-shadow: 2px 2px 10px rgba(150, 150, 150, 1);
......@@ -137,39 +96,6 @@ ul.metager-dropdown-menu {
}
}
#navbar-static-pages {
z-index: 4;
width: 100%;
}
@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-static-nav-list>li: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 {
color: @metager-navbar-toggle-color;
background-color: @metager-navbar-toggle-background-color;
......@@ -189,37 +115,6 @@ ul.metager-dropdown-menu {
background-color: @toggle-nav-hide-or-metager-navbar-toggle-background-color;
}
#metager-static-nav-list>li {
padding-top: 10%;
}
@media (max-width: 979px) {
#metager-static-nav-list {
width: 100%;
max-height: 40px;
overflow: hidden;
}
#metager-static-nav-list:target {
max-height: 1000px;
}
#metager-static-nav-list>li {
padding-top: 5px;
display: initial;
}
ul.metager-dropdown-menu {
position: inherit;
width: 100%;
border-radius: 0;
box-shadow: initial;
}
ul#metager-static-nav-list:target #toggle-nav-show {
display: none;
}
ul#metager-static-nav-list:target #toggle-nav-hide {
display: initial!important;
}
}
#color-chooser {
padding: 0;
a {
......
resources/views/layouts/sidebar.blade.php
View file @ 9e67adbc
<input name="nav" id="nav0" style="display: none;" type="checkbox">
<div class="sideBar"@if (isset($id)) id={{ $id }}@endif>
<label id="closeSidebar" role="button" for="nav0"></label>
<label role="button" for="nav0"></label>
<p> MetaGer </p>
<ul id="metager-static-nav-list" class="list-inline pull-right">
<li @if ( !isset($navbarFocus) || $navbarFocus === 'suche') class="active" @endif >
<a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/") }}" tabindex="200" id="navigationSuche">{{ trans('staticPages.nav1') }}</a>
<a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/") }}" tabindex="200" id="navigationSuche"><i class="fa fa-search" aria-hidden="true"></i>&nbsp;
{{ trans('staticPages.nav1') }}</a>
</li>
<li @if (isset($navbarFocus) && $navbarFocus === 'foerdern') class="metager-dropdown active" @else class="metager-dropdown" @endif >
<a class="metager-dropdown-toggle" role="button" aria-expanded="false" tabindex="201">{{ trans('staticPages.nav16') }}
<a class="metager-dropdown-toggle" role="button" aria-expanded="false" tabindex="201"><i class="fa fa-money" aria-hidden="true"></i>
&nbsp;{{ trans('staticPages.nav16') }}
<span class="caret"></span></a>
<ul class="metager-dropdown-menu">
<li>
......@@ -21,10 +24,12 @@
</ul>
</li>
<li @if (isset($navbarFocus) && $navbarFocus === 'datenschutz') class="active" @endif >
<a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/datenschutz/") }}" id="navigationPrivacy" tabindex="215">{{ trans('staticPages.nav3') }}</a>
<a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/datenschutz/") }}" id="navigationPrivacy" tabindex="215"><i class="fa fa-user-secret" aria-hidden="true"></i>&nbsp;
{{ trans('staticPages.nav3') }}</a>
</li>
<li @if (isset($navbarFocus) && $navbarFocus === 'hilfe') class="metager-dropdown active" @else class="metager-dropdown" @endif >
<a class="metager-dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" id="navigationHilfe" tabindex="216">{{ trans('staticPages.nav20') }}
<a class="metager-dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" id="navigationHilfe" tabindex="216"><i class="fa fa-info-circle" aria-hidden="true"></i>&nbsp;
{{ trans('staticPages.nav20') }}
<span class="caret"></span></a>
<ul class="metager-dropdown-menu">
<li>
......@@ -36,7 +41,8 @@
</ul>
</li>
<li @if (isset($navbarFocus) && $navbarFocus === 'kontakt') class="metager-dropdown active" @else class="metager-dropdown" @endif >
<a class="metager-dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" id="navigationKontakt" tabindex="219">{{ trans('staticPages.nav18') }}
<a class="metager-dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" id="navigationKontakt" tabindex="219"><i class="fa fa-comments-o" aria-hidden="true"></i>&nbsp;
{{ trans('staticPages.nav18') }}
<span class="caret"></span></a>
<ul class="metager-dropdown-menu">
<li>
......@@ -57,7 +63,8 @@
</ul>
</li>
<li @if (isset($navbarFocus) && $navbarFocus === 'dienste') class="metager-dropdown active" @else class="metager-dropdown" @endif >
<a class="metager-dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" tabindex="225">{{ trans('staticPages.nav15') }}
<a class="metager-dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" tabindex="225"><i class="fa fa-wrench" aria-hidden="true"></i>
&nbsp;{{ trans('staticPages.nav15') }}
<span class="caret"></span></a>
<ul class="metager-dropdown-menu">
<li>
......@@ -87,9 +94,10 @@
</ul>
</li>
<li class="metager-dropdown">
<a class="metager-dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" id="navigationSprache" tabindex="235">{{ trans('staticPages.nav19') }} ({{ LaravelLocalization::getSupportedLocales()[LaravelLocalization::getCurrentLocale()]['native'] }})
<a class="metager-dropdown-toggle" role="button" aria-haspopup="true" aria-expanded="false" id="navigationSprache" tabindex="235"><i class="fa fa-globe" aria-hidden="true"></i>&nbsp;
{{ trans('staticPages.nav19') }} ({{ LaravelLocalization::getSupportedLocales()[LaravelLocalization::getCurrentLocale()]['native'] }})
<span class="caret"></span></a>
<ul class="metager-dropdown-menu">
<ul class="metager-dropdown-menu">
@foreach(LaravelLocalization::getSupportedLocales() as $localeCode => $properties)
<li>
<a rel="alternate" hreflang="{{$localeCode}}" href="{{LaravelLocalization::getLocalizedURL($localeCode) }}" tabindex="{{235 + $loop->index}}">{{{ $properties['native'] }}}</a>
......
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