SPR-950: optimate Headerstyling in Mobile

This commit is contained in:
Silke Pisulla 2017-04-21 14:43:56 +02:00
commit 5b90468832
3 changed files with 48 additions and 8 deletions

View file

@ -8,14 +8,13 @@
#dokuwiki__header {
@header-font-opacity: 1;
@media @screen_max-xxs {
min-height: 120px;
}
/* + + + wiki logo + + + */
@media @screen_min-md {
div.claim {
display: table-cell;
height: 100%;
vertical-align: middle;
}
.logo {
padding: 1rem 0 .3rem;
@ -48,7 +47,7 @@
}
/* + + + wiki title + claim + + + */
/* + + + + + DESKTOP - wiki title + claim + + + + + */
.main-title.desktop-only {
@media @screen_min-md {
display: table-cell;
@ -70,14 +69,24 @@
display: block;
padding-bottom: 1rem;
}
@media @screen_max-xxs {
padding-right: (@toggle-size + @headericons-margin-xxs);
}
}
}
/* + + + + + MOBILE - wiki title wrapper + + + + + */
.main-title:not([class*="desktop-only"]) {
@media @screen_max-md {
display: table-cell;
vertical-align: middle;
}
@media @screen_max-xxs {
padding-right: (@toggle-size + @headericons-margin-xxs);
}
}
@ -101,6 +110,16 @@
}
/* + + + + + DESKTOP - wiki claim, logo, title wrapper + + + + + */
@media @screen_min-md {
div.claim {
display: table-cell;
height: 100%;
vertical-align: middle;
}
}
/* + + + wiki claim + + + */
p.claim {
opacity: @header-font-opacity;
@ -116,7 +135,9 @@
/* + + + mobile nav togglelink + + + */
.menu-togglelink {
margin: .45rem -(@very-small-spacing) 0 0;
position: relative;
z-index: 1;
margin: @headericons-margin-xxs -(@very-small-spacing) 0 0;
a {
.fontello();