Marginal-Box auf fast leeren einspaltigen Seiten korrigiert
authorKai Moritz <kai@juplo.de>
Thu, 23 Jan 2014 00:36:35 +0000 (01:36 +0100)
committerKai Moritz <kai@juplo.de>
Tue, 19 Jan 2016 16:45:41 +0000 (17:45 +0100)
src/main/webapp/WEB-INF/templates/marginalcontent.jsp
src/main/webapp/less/screen/layout.less
src/main/webapp/less/tablet/footer.less
src/main/webapp/less/tablet/layout.less

index 29f67bd..e8c225c 100644 (file)
@@ -13,3 +13,9 @@
     culpa qui officia deserunt mollit anim id est laborum.
   </p>
 </aside>
+<aside class="m">
+  <h1>More nasty stuff</h1>
+  <p>
+    This one is really short!
+  </p>
+</aside>
index 92cc19a..bf77320 100644 (file)
@@ -26,10 +26,17 @@ body
   position: relative;
   width: 100%;
 }
-.cols_1 > .content > .marginal
+.cols_1 > .content > .main
 {
-  margin-top: 3em;
+  margin-bottom: 7em;
+}
+.cols_1 > .content > .marginal aside.m
+{
+  margin: 3.5em 0 -999em 0;
+  padding: 2em 2em 995em 2em;
   background-color: @heller;
+  position: relative;
+  top: -4.5em;
 }
 .cols_2 > .content > .marginal
 {
@@ -54,10 +61,6 @@ body
 {
   margin-top: 0;
 }
-.cols_1 > .content > .marginal aside.m
-{
-  padding: 2em;
-}
 #nav
 {
   position: absolute;
@@ -113,6 +116,11 @@ body { overflow-y: scroll; }
 {
   right: -24.375em; /** Weil der Breadcrumb sonst an der Faux-Column umbricht! */
 }
+.cols_1 > #footer
+{
+  border-top: 1.5em solid @hintergrund;
+  background-color: @hintergrund;
+}
 .cols_2 > #footer
 {
   margin-right: -24.375em;
index ffe1695..bfb951d 100644 (file)
@@ -1,20 +1,30 @@
 .cols_1 > #footer
 {
-  padding: 2em 3em 1.5em 5em;
+  padding: 0 3em 1.5em 5em;
   @media (max-width: @maxsmalltablet)
   {
-    padding: 1.5em 2em 1em 3em;
+    padding: 0 2em 1em 3em;
   }
   @media (max-width: @maxsmallertablet)
   {
-    padding: 1em 1em .75em 2.5em;
+    padding: 0 1em .75em 2.5em;
   }
   background-color: @heller;
 }
 .cols_1 > #footer > #footerlinks
 {
   position: static;
-  border-style: none;
+  margin: -.125em;
+  padding-top: 1.5em;
+  @media (max-width: @maxsmalltablet)
+  {
+    padding-top: 1em;
+  }
+  @media (max-width: @maxsmallertablet)
+  {
+    padding-top: .5em;
+  }
+  border-top: .125em solid @hintergrund;
 }
 .cols_1 > #footer > #footerlinks > li.f
 {
index ddaa34a..b6f7082 100644 (file)
@@ -63,8 +63,9 @@ body
 }
 .cols_1 > .content > .marginal aside.m
 {
-  padding: 2em 0;
-  border-bottom: .125em solid @hintergrund;
+  margin: 3.5em -3em -999em -5em;
+  padding: 2em 3em 995em 5em;
+  border-style: none;
 }
 .cols_2 > .content > .marginal
 {
@@ -73,9 +74,13 @@ body
   width: 100%;
   position: static;
 }
+.cols_1 > #footer
+{
+  border-style: none;
+}
 .cols_2 > .content > .marginal > aside.m
 {
-  margin: 0 -12em 0 17.5em;
+  margin: 0 -12em 1em 17.5em;
   @media (max-width: @maxsmalltablet)
   {
     margin-right: -13em;