X-Git-Url: https://juplo.de/gitweb/?p=website;a=blobdiff_plain;f=src%2Fmain%2Fwebapp%2Fless%2Fscreen%2Flayout.less;h=e99be0446ca2ad68e1efd6ed2a20dfbba0081038;hp=2af6cd6fe25d3333ffd4c5476eda51d452af4ad9;hb=173a4c37630f1d30aacc1ab5af8d0f57adc234b3;hpb=136db10a69e7fbfd778a17bd269cd26166939348 diff --git a/src/main/webapp/less/screen/layout.less b/src/main/webapp/less/screen/layout.less index 2af6cd6f..e99be044 100644 --- a/src/main/webapp/less/screen/layout.less +++ b/src/main/webapp/less/screen/layout.less @@ -9,21 +9,24 @@ body { position: relative; } -.content.cols_2 +.cols_2 > .content { padding: 0 27em 0 0; - background-image: url('../../img/bg.gif'); - background-repeat: repeat-y; - background-position: right top; + margin-right: -24.375em; } -.content.cols_2 > .main +.cols_2 > .content > .main { float: left; min-height: 1em; position: relative; width: 100%; } -.content.cols_2 > .marginal +.cols_1 > .content > .marginal +{ + margin: 3em 0; + background-color: @heller; +} +.cols_2 > .content > .marginal { float: left; margin: 0 -27em 0 2.625em; @@ -32,27 +35,38 @@ body width: 20.375em; background-color: @heller; } -.cols_2 > .content > .marginal h1, -.cols_2 > .content > .marginal h2, -.cols_2 > .content > .marginal h3, -.cols_2 > .content > .marginal h4 +.content > .marginal h1, +.content > .marginal h2, +.content > .marginal h3, +.content > .marginal h4 { color: @hintergrund; } +.content > .marginal h1:first-child, +.content > .marginal h2:first-child, +.content > .marginal h3:first-child, +.content > .marginal h4:first-child +{ + margin-top: 0; +} +.cols_1 > .content > .marginal div.m +{ + padding: 2em; +} .content #nav { position: absolute; top: 0; width: 100%; } -.content.cols_2 #nav +.cols_2 > .content #nav { position: relative; top: auto; right: auto; width: 22.375em; /** 358px = 326px + 32px*/ } -.content.cols_2 #nav > #menu +.cols_2 > .content #nav > #menu { margin: 0 0 -2.125em 0; /** 0 0 -34px 0 */ } @@ -70,7 +84,28 @@ body { overflow-y: scroll; } /** Center content, when screen is bigger than 1240 */ #page { + max-width: 62.375em; /** 608px + 390px (Marginalspalte) = ca. 1000px */ position: relative; - max-width: 1000px; margin: 0 auto; } + +/** Faux-Column-Hack-Eigengewächs */ +#page.cols_2 +{ + max-width: 38em; /** 608px + 390px (Marginalspalte) = ca. 1000px */ + border-right: 24.375em solid @heller; +} +.cols_2 > #header +{ + margin-right: -24.375em; + background-color: @hintergrund; +} +.cols_2 > #breadcrumb +{ + right: -24.375em; /** Weil der Breadcrumb sonst an der Faux-Column umbricht! */ +} +.cols_2 > #footer +{ + margin-right: -24.375em; + background-color: @hintergrund; +}