Merge branch 'navbar' into 'master'

Design changes to navbar

See merge request !139
This commit is contained in:
Felix Hamann 2019-02-10 19:51:34 +01:00
commit 744347474d
3 changed files with 4 additions and 46 deletions

View File

@ -161,14 +161,6 @@ h4 {
/* LAYOUT */
.main {
position: relative;
min-height: calc(100vh - var(--header-height));
}
@media (max-width: 768px) {
.main {
min-height: calc(100vh - var(--header-height-collapsed));
}
}
.main__content {

View File

@ -32,7 +32,7 @@ $newline never
<i .fas.fa-#{fromMaybe "none" menuItemIcon}>
<div .navbar__link-label>_{SomeMessage menuItemLabel}
$of NavbarSecondary
<li .navbar__list-item.navbar__list-item--secondary :highlight (urlRoute menuItemRoute):.navbar__list-item--active>
<li .navbar__list-item :highlight (urlRoute menuItemRoute):.navbar__list-item--active>
$if menuItemModal
<div .modal.js-modal #modal-#{menuIdent} data-trigger=#{menuIdent} data-closeable data-dynamic>
<a .navbar__link-wrapper href=#{route} ##{menuIdent}>

View File

@ -37,9 +37,9 @@
left: var(--asidenav-width-xl);
height: var(--header-height);
background: var(--color-darker); /* Old browsers */
background: -moz-linear-gradient(bottom, var(--color-dark) 0%, var(--color-darker) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(bottom, var(--color-dark) 0%,var(--color-darker) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to top, var(--color-dark) 0%,var(--color-darker) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
background: -moz-linear-gradient(bottom, var(--color-primary) 0%, var(--color-primary) 80%, var(--color-dark) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(bottom, var(--color-primary) 0%, var(--color-primary) 80%, var(--color-dark) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to top, var(--color-primary) 0%, var(--color-primary) 80%, var(--color-dark) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
color: white;
z-index: 20;
box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
@ -207,40 +207,6 @@
}
}
.navbar__list-item--secondary {
margin-left: 20px;
color: var(--color-grey);
.navbar__link-wrapper {
color: var(--color-grey);
}
}
@media (min-width: 769px) {
.navbar__list-item--secondary {
.navbar__link-wrapper {
border: 1px solid var(--color-grey);
}
}
}
@media (max-width: 768px) {
.navbar__list-item--secondary {
margin-left: 0;
.navbar__link-wrapper {
box-shadow: none;
}
}
}
.navbar__list-item--secondary + .navbar__list-item--secondary {
margin-left: 0;
border-left: 0;
}
.navbar__list-item--active {
background-color: var(--color-lightwhite);
color: var(--color-dark);