fraport/fradrive-old
Archived
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

more consistent spacing for main_content and favorites only .logged-in

Browse Source
This commit is contained in:
Felix Hamann 2018-07-16 00:50:57 +02:00
parent 16315e55fb
commit 30dd841048
6 changed files with 69 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
templates/default-layout.lucius
View File

@ -154,12 +154,14 @@ h4 {
.main { .main {
position: relative; position: relative;
min-height: calc(100vh - var(--header-height)); min-height: calc(100vh - var(--header-height));
padding: 20px;
} }
@media (max-width: 768px) { @media (max-width: 768px) {
.main { .main {
min-height: calc(100vh - var(--header-height-collapsed)); min-height: calc(100vh - var(--header-height-collapsed));
padding: 10px;
} }
} }
@ -167,7 +169,6 @@ h4 {
position: relative; position: relative;
background-color: white; background-color: white;
overflow: hidden; overflow: hidden;
padding-left: 24%;
transition: padding-left .2s ease-out; transition: padding-left .2s ease-out;
> .container { > .container {
@ -183,42 +184,36 @@ h4 {
} }
} }
@media (max-width: 768px) {
.logged-in {
.main__content {
padding-left: 60px;
}
}
}
@media (max-width: 425px) {
.logged-in {
.main__content {
padding-left: 0;
}
}
}
@media (min-width: 769px) {
.logged-in {
.main__content {
padding-left: calc(24% + 30px);
}
}
}
@media (min-width: 1200px) { @media (min-width: 1200px) {
.main__content { .logged-in {
padding-left: 300px; .main__content {
} padding-left: 320px;
} }
@media (max-width: 768px) {
.main__content {
padding-left: 50px;
}
}
@media (max-width: 425px) {
.main__content {
padding-left: 0;
}
}
.main__content-body {
padding: 30px 40px 60px;
}
@media (max-width: 768px) {
.main__content-body {
padding: 30px 20px 60px;
}
}
@media (max-width: 425px) {
.main__content-body {
padding: 20px 10px 60px;
} }
} }
@ -420,7 +415,7 @@ input[type="button"].btn-info:hover,
} }
/* LIST MODIFIERS */ /* LIST MODIFIERS */
.list--inline > li { .list--inline li {
display: inline-block; display: inline-block;
} }

3
templates/standalone/alerts.lucius
View File

@ -97,13 +97,14 @@
font-weight: 600; font-weight: 600;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
text-align: left;
} }
@media (max-width: 768px) { @media (max-width: 768px) {
.alert__content { .alert__content {
padding: 4px 7px; padding: 4px 7px;
padding-left: 20px; padding-left: 25px;
} }
} }

1
templates/widgets/asidenav.julius
View File

@ -8,6 +8,7 @@
function init() { function init() {
var favoritesBtn = document.querySelector('.navbar__list-item--favorite'); var favoritesBtn = document.querySelector('.navbar__list-item--favorite');
favoritesBtn.addEventListener('click', function(event) { favoritesBtn.addEventListener('click', function(event) {
favoritesBtn.classList.toggle('navbar__list-item--active');
asideEl.classList.toggle('main__aside--expanded'); asideEl.classList.toggle('main__aside--expanded');
event.preventDefault(); event.preventDefault();
}, true); }, true);

9
templates/widgets/asidenav.lucius
View File

@ -1,8 +1,11 @@
.main__aside { .main__aside {
position: absolute; position: absolute;
display: none;
background-color: var(--color-dark); background-color: var(--color-dark);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
z-index: 1; z-index: 1;
top: 0;
left: 0;
flex: 0 0 300px; flex: 0 0 300px;
min-height: calc(100% - var(--header-height)); min-height: calc(100% - var(--header-height));
transition: all .2s ease-out; transition: all .2s ease-out;
@ -10,6 +13,12 @@
height: 100%; height: 100%;
} }
.logged-in {
.main__aside {
display: block;
}
}
/* maximum width of 300px for wide screens */ /* maximum width of 300px for wide screens */
@media (min-width: 1200px) { @media (min-width: 1200px) {
.main__aside { .main__aside {

17
templates/widgets/breadcrumbs.lucius
View File

@ -1,26 +1,9 @@
.breadcrumbs__container { .breadcrumbs__container {
position: relative; position: relative;
color: var(--color-font); color: var(--color-font);
margin-left: 40px;
margin-top: 15px;
margin-bottom: 10px; margin-bottom: 10px;
} }
@media (max-width: 768px) {
.breadcrumbs__container {
margin-left: 20px;
}
}
@media (max-width: 425px) {
.breadcrumbs__container {
margin-left: 10px;
margin-top: 10px;
}
}
.breadcrumbs__link { .breadcrumbs__link {
&:hover { &:hover {

35
templates/widgets/navbar.lucius
View File

@ -115,6 +115,10 @@
color: var(--color-lightwhite); color: var(--color-lightwhite);
transition: height .2s cubic-bezier(0.03, 0.43, 0.58, 1); transition: height .2s cubic-bezier(0.03, 0.43, 0.58, 1);
box-shadow: 0 0 0 1px inset var(--color-lmu-box-border); box-shadow: 0 0 0 1px inset var(--color-lmu-box-border);
&:hover {
color: var(--color-lightwhite);
}
} }
.navbar__link-label { .navbar__link-label {
@ -217,20 +221,33 @@
} }
} }
/* "Favorites" list item, only visible on small screens */ /* "Favorites" list item, only visible on small screens and logged in */
.navbar__list { .navbar__list-item {
&.navbar__list-item--favorite {
.navbar__list-item--favorite {
display: none; display: none;
background-color: var(--color-primary); }
}
.navbar__list-item--favorite {
display: none;
background-color: var(--color-primary);
}
.logged-in {
.navbar__list {
li.navbar__list-item--favorite,
.navbar__list-item--favorite {
display: inline-block;
}
} }
} }
@media (max-width: 425px) { @media (min-width: 426px) {
.navbar__list { .logged-in {
.navbar__list-item--favorite { .navbar__list {
display: inline-block; .navbar__list-item--favorite {
display: none !important;
}
} }
} }
} }