Layout für Smartphones und sehr kleine Bildschirmgrößen überarbeitet

[website] / src / main / webapp / less / tiny / layout.less

diff --git a/src/main/webapp/less/tiny/layout.less b/src/main/webapp/less/tiny/layout.less
new file mode 100644 (file)
index 0000000..ede7f87
--- /dev/null
+++ b/src/main/webapp/less/tiny/layout.less
@@ -0,0 +1,47 @@
+body
+{
+  font-size: 75%; /** 12px */
+}
+.marginal
+{
+  margin-bottom: -991em;
+}
+
+@media (max-width: 210px)
+{
+  #header
+  {
+    font-size: 75%;
+    margin: 0 .5em 0 1em;
+  }
+  .content > .marginal
+  {
+    padding: 1em .5em 999em .5em;
+  }
+  .content > .main,
+  #footer
+  {
+    margin: 0;
+    padding: 0 .5em;
+  }
+  #breadcrumb
+  {
+    top: .3em;
+    right: .3em;
+  }
+}
+@media (max-width: 150px)
+{
+  #header
+  {
+    font-size: 50%;
+  }
+  #header > hr.h
+  {
+    display: block;
+  }
+  #slogan
+  {
+    display: none;
+  }
+}