X-Git-Url: https://juplo.de/gitweb/?p=website;a=blobdiff_plain;f=src%2Fmain%2Fwebapp%2Fless%2Ftablet%2Flayout.less;h=9e5c2df3ce1ea1cc6135e5fe5d61fa5212bc3708;hp=3d9787fa5aa5d27c9d80fb019ae43cfff0c2bf14;hb=742e9e70700208183bd2bf94cc639b288e5e05c9;hpb=9d7e47972b8f9fcb0bc688e4b5ec62f133d67ca2 diff --git a/src/main/webapp/less/tablet/layout.less b/src/main/webapp/less/tablet/layout.less index 3d9787fa..9e5c2df3 100644 --- a/src/main/webapp/less/tablet/layout.less +++ b/src/main/webapp/less/tablet/layout.less @@ -1,7 +1,6 @@ /** Seite gesamt (Abmessungen, Aussenabstände etc.) */ -body.menu, -body.nomenu +body { padding: 0; } @@ -23,7 +22,7 @@ body.nomenu } .nomenu .content { - padding-bottom: 5em; + padding: 0 0 5em 0; @media (max-width: @maxsmalltablet) { padding-bottom: 4em; @@ -33,22 +32,21 @@ body.nomenu padding-bottom: 3.25em; } } -.menu .content.cf:before, -.menu .content.cf:after +.content.cf:before, +.content.cf:after { clear: none; content: none; display: inline; } -.menu .content > .main, -.nomenu .content > .main +.content > .main { float: none; width: auto; padding: 0 3em 0 5em; @media (max-width: @maxsmalltablet) { - padding: 0 2em 0 3.5em; + padding: 0 2em 0 3em; } @media (max-width: @maxsmallertablet) { @@ -60,27 +58,21 @@ body.nomenu border-top: 1px solid @hintergrund; border-bottom: 1px solid @hintergrund; } +.content > .marginal +{ + position: static; + width: 100%; +} .menu .content > .marginal { margin: 3em 0 -994em -15em; padding: 2em 0 999em 0; - width: 100%; - position: static; } .nomenu .content > .marginal { - margin: 3em 0 -999em 0; - padding: 0 3em 999em 5em; - @media (max-width: @maxsmalltablet) - { - padding-left: 3.5em; - padding-right: 2em; - } - @media (max-width: @maxsmallertablet) - { - padding-left: 2.5em; - padding-right: 1em; - } + margin: 3em 0 -994em 0; + padding: 0 0 999em 0; + background-color: transparent; } @@ -92,7 +84,7 @@ body.nomenu @media (max-width: @maxsmalltablet) { margin-left: -1.5em; - padding: .5em 2em 0 3.5em; + padding: .5em 2em 0 3em; } @media (max-width: @maxsmallertablet) { @@ -104,7 +96,7 @@ body.nomenu /** Bereichsauswahl positionieren */ -.menu .content > .marginal > #nav +.menu #nav { position: static; border-right: .125em solid @hintergrund; @@ -123,11 +115,20 @@ body.nomenu } width: auto; } +.nomenu #nav +{ + position: absolute; + top: 0; + right: 0; /** Hier eigentlich nicht nötig, aber für Tablet-Style erforderrlich! */ + width: 100%; +} + .nomenu #menu, .menu #menu { position: absolute; width: auto; + top: -7em; right: 3em; @media (max-width: @maxsmalltablet) { @@ -219,7 +220,7 @@ body.nomenu { font-size: 87.5%; /* 14px */ top: 7.2em; - left: 10.3em; + left: 9.8em; } @media (max-width: @maxsmallertablet) { @@ -233,11 +234,21 @@ body.nomenu .nomenu .content > .marginal aside.m { - margin: 3.5em -3em -999em -5em; + margin: 3.5em 0 -999em 0; padding: 2em 3em 995em 5em; background-color: @heller; position: relative; top: -4.5em; + @media (max-width: @maxsmalltablet) + { + padding-left: 3em; + padding-right: 2em; + } + @media (max-width: @maxsmallertablet) + { + padding-left: 2.5em; + padding-right: 1em; + } } .menu .content > .marginal > aside.m {