Bildschirmbreiten für die Media-Query-Weichen als LESS-Variablen definiert

diff --git a/src/main/webapp/WEB-INF/wro.xml b/src/main/webapp/WEB-INF/wro.xml
index 8dcf19d86729ce1df6eef380db4d50d45638a5e3..390b28f1dc1fc8a9c818f129c3a6e62ac8172126 100644 (file)
--- a/src/main/webapp/WEB-INF/wro.xml
+++ b/src/main/webapp/WEB-INF/wro.xml
@@ -1,11 +1,13 @@
 <groups xmlns="http://www.isdc.ro/wro">
 
   <group name="base">
+    <css>/less/variables.less</css>
     <css>/less/base.less</css>
     <js>/js/prettify.js</js>
   </group>
 
   <group name="screen">
+    <css>/less/variables.less</css>
     <css>/less/screen.less</css>
     <css>/less/tablet.less</css>
     <css>/less/phone.less</css>

diff --git a/src/main/webapp/less/base.less b/src/main/webapp/less/base.less
index c8ab1eec52664ee0bc12dac15fc0de8363b617ef..f3a05859f9443145f799a6f51e477753505b5fb7 100644 (file)
--- a/src/main/webapp/less/base.less
+++ b/src/main/webapp/less/base.less
@@ -1,4 +1,3 @@
-@import 'variables.less';
 @import 'base/browserreset.less';
 @import 'base/fonts.less';
 @import 'base/util.less';

diff --git a/src/main/webapp/less/phone.less b/src/main/webapp/less/phone.less
index 86d429b6b0f1fc80ecfe8ae37a58cedb80a99143..f14a170c27cbefd360e0bd1332b05acdfd119cb8 100644 (file)
--- a/src/main/webapp/less/phone.less
+++ b/src/main/webapp/less/phone.less
@@ -1,6 +1,5 @@
-@media screen and (max-width: 599px)
+@media screen and (max-width: @maxphone)
 {
-  @import 'variables.less';
   @import 'phone/typo.less';
   @import 'phone/navigation.less';
 }

diff --git a/src/main/webapp/less/screen.less b/src/main/webapp/less/screen.less
index 110dc86d0c51550303d3a665756aac501ef3fc3f..eae175a45ca373560ea0b68bb0a245a0c045f416 100644 (file)
--- a/src/main/webapp/less/screen.less
+++ b/src/main/webapp/less/screen.less
@@ -1,6 +1,5 @@
-@media screen and (min-width: 750px)
+@media screen and (min-width: @minscreen)
 {
-  @import 'variables.less';
   @import 'screen/typo.less';
   @import 'screen/layout.less';
   @import 'screen/head.less';

diff --git a/src/main/webapp/less/tablet.less b/src/main/webapp/less/tablet.less
index 60456d964b71204385ff1dd5c6fb121442c7a803..7bd3ac647006ba5f0c446fedeb1ebdc598182e65 100644 (file)
--- a/src/main/webapp/less/tablet.less
+++ b/src/main/webapp/less/tablet.less
@@ -1,6 +1,5 @@
-@media screen and (min-width: 750px) and (max-width: 939px)
+@media screen and (min-width: @minscreen) and (max-width: @maxtablet)
 {
-  @import 'variables.less';
   @import 'tablet/layout.less';
   @import 'tablet/footer.less';
 }

diff --git a/src/main/webapp/less/tiny.less b/src/main/webapp/less/tiny.less
index ef1470b55eb89b4dfe1a48c1ff19ca101cc35d58..3d339444e97cf5e5f6192a1991dd5bc5465a772a 100644 (file)
--- a/src/main/webapp/less/tiny.less
+++ b/src/main/webapp/less/tiny.less
@@ -1,6 +1,5 @@
-@media screen and (max-width: 399px)
+@media screen and (max-width: @maxtiny)
 {
-  @import 'variables.less';
   @import 'tiny/typo.less';
   @import 'tiny/navigation.less';
 }

diff --git a/src/main/webapp/less/variables.less b/src/main/webapp/less/variables.less
index cdb90c79d04627ce66c87c859dabc19f5f3ccc19..19058314b8fc5d486a8ec4e5d05cedf9e65728fa 100644 (file)
--- a/src/main/webapp/less/variables.less
+++ b/src/main/webapp/less/variables.less
@@ -17,6 +17,14 @@
 @fehlerhell:  tint(@fehler, 70%);
 
 
+/** Bildschirmbreiten für Media-Query */
+
+@minscreen:   750px;
+@maxtablet:   939px;
+@maxphone:    599px;
+@maxtiny:     399px;
+
+
 /** Schriften */
 
 .droid ()