projects / website / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: e4514bf)
Basis-Layout für veraltete Browser (IE6 & Co.) eingeführt
authorKai Moritz <kai@juplo.de>
Sat, 7 Dec 2013 11:09:27 +0000 (12:09 +0100)
committerKai Moritz <kai@juplo.de>
Tue, 19 Jan 2016 16:45:35 +0000 (17:45 +0100)
src/main/webapp/WEB-INF/templates/html5page.jsp patch | blob | history
src/main/webapp/WEB-INF/wro.xml patch | blob | history
src/main/webapp/less/base/footer.less [deleted file] patch | blob | history
src/main/webapp/less/base/head.less [deleted file] patch | blob | history
src/main/webapp/less/base/layout.less [deleted file] patch | blob | history
src/main/webapp/less/base/navigation.less [deleted file] patch | blob | history
src/main/webapp/less/screen/footer.less [new file with mode: 0644] patch | blob
src/main/webapp/less/screen/head.less [new file with mode: 0644] patch | blob
src/main/webapp/less/screen/layout.less [new file with mode: 0644] patch | blob
src/main/webapp/less/screen/navigation.less [new file with mode: 0644] patch | blob

diff --git a/src/main/webapp/WEB-INF/templates/html5page.jsp b/src/main/webapp/WEB-INF/templates/html5page.jsp
index ba52ec5..f38e4a3 100644 (file)
--- a/src/main/webapp/WEB-INF/templates/html5page.jsp
+++ b/src/main/webapp/WEB-INF/templates/html5page.jsp
@@ -7,8 +7,11 @@
   <head>
     <title>juplo - <t:getAsString name="title"/></title>
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
   <head>
     <title>juplo - <t:getAsString name="title"/></title>
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
-    <base href="${pageContext.request.contextPath}/" />
-    <link rel="stylesheet" type="text/css" href="css/base.css"/>
+    <base href="http://${pageContext.request.serverName}:${pageContext.request.serverPort}${pageContext.request.contextPath}/" />
+    <link rel="stylesheet" type="text/css" href="css/base.css" />
+    <style type="text/css">
+      @import 'css/screen.css' screen
+    </style>
   </head>
   <body>
     <header id="header">
   </head>
   <body>
     <header id="header">
diff --git a/src/main/webapp/WEB-INF/wro.xml b/src/main/webapp/WEB-INF/wro.xml
index 73ce6ea..3c4da6f 100644 (file)
--- a/src/main/webapp/WEB-INF/wro.xml
+++ b/src/main/webapp/WEB-INF/wro.xml
@@ -5,12 +5,15 @@
     <css>/less/base/fonts.less</css>
     <css>/less/base/util.less</css>
     <css>/less/base/typo.less</css>
     <css>/less/base/fonts.less</css>
     <css>/less/base/util.less</css>
     <css>/less/base/typo.less</css>
-    <css>/less/base/layout.less</css>
-    <css>/less/base/head.less</css>
-    <css>/less/base/navigation.less</css>
     <css>/less/base/content.less</css>
     <css>/less/base/marginal.less</css>
     <css>/less/base/content.less</css>
     <css>/less/base/marginal.less</css>
-    <css>/less/base/footer.less</css>
+  </group>
+
+  <group name="screen">
+    <css>/less/screen/layout.less</css>
+    <css>/less/screen/head.less</css>
+    <css>/less/screen/navigation.less</css>
+    <css>/less/screen/footer.less</css>
   </group>
 
 </groups>
   </group>
 
 </groups>
diff --git a/src/main/webapp/less/base/footer.less b/src/main/webapp/less/base/footer.less
deleted file mode 100644 (file)
index addab87..0000000
--- a/src/main/webapp/less/base/footer.less
+++ /dev/null
@@ -1,46 +0,0 @@
-@import '../variables.less';
-
-#footer
-{
-  margin: 2em 0;
-}
-#footerlinks
-{
-  font-family: 'BPreplay', Helvetica, Arial, sans-serif;
-  font-weight: bold;
-  position: relative;
-  border-top: 1.25em solid @normal; /** 20px */
-  margin: 0;
-  padding: 0;
-  list-style-type: none;
-}
-#footerlinks > li.f
-{
-  font-size: 137.5%; /** 22 px */
-  line-height: .6666666667em; /* 20px */
-  display: inline-block;
-  margin: .5em 1em 0 0;
-  color: @normal;
-  vertical-align: top;
-}
-#footerlinks > li#copyright
-{
-  position: absolute;
-  right: .625em;
-  top: -1em; /** 30px */
-  line-height: 1.4em; /* 42px */
-  color: @hintergrund;
-  margin: 0;
-  font-size: 187.5%; /** 30px */
-}
-#footerlinks a.f
-{
-  color: @normal;
-  border-color: @normal;
-}
-#footerlinks a.f:hover
-{
-  color: @dunkler;
-  border-color: @dunkler;
-  border-style: solid;
-}
diff --git a/src/main/webapp/less/base/head.less b/src/main/webapp/less/base/head.less
deleted file mode 100644 (file)
index 6befe52..0000000
--- a/src/main/webapp/less/base/head.less
+++ /dev/null
@@ -1,48 +0,0 @@
-@import '../variables.less';
-
-#header
-{
-  font-family: 'BPreplay', Helvetica, Arial, sans-serif;
-  font-weight: bold;
-  margin-left: -4em;
-}
-#header > hr
-{
-  display: none;
-}
-#logo
-{
-  display: inline-block;
-  font-size: 812.5%; /* 130px */
-  line-height: 1em;
-  padding: 0 0 0 .230769231em; /* 30px */
-  color: @normal;
-  text-shadow: .092307692em .046153846em 0 @hintergrund; /** 12px 6px */
-  border: none;
-  position: relative;
-  z-index: 1;
-}
-#logo:hover
-{
-  color: @dunkler;
-}
-#slogan
-{
-  display: block;
-  color: @hintergrund;
-  background-color: @normal;
-  font-size: 187.5%; /** 30px */
-  line-height: .6666666667em; /* 20px */
-  height: .6em; /* 18px */
-  padding: .066666667em .066666667em 0 0; /** 2px 2px 0 0 */
-  margin-left: 10em; /* 300px */
-  position: relative;
-  z-index: 0;
-  top: -1.3em; /* 39px */
-  text-align: right;
-}
-#slogan > strong{
-  display: inline-block;
-  position: relative;
-  top: -.2em; /* -6px */
-}
diff --git a/src/main/webapp/less/base/layout.less b/src/main/webapp/less/base/layout.less
deleted file mode 100644 (file)
index efeddf9..0000000
--- a/src/main/webapp/less/base/layout.less
+++ /dev/null
@@ -1,56 +0,0 @@
-@import '../variables.less';
-
-.content
-{
-  position: relative;
-}
-.content.cols_2
-{
-  padding: 0 27em 0 0;
-  background-image: url('../../img/bg.gif');
-  background-repeat: repeat-y;
-  background-position: right top;
-}
-.content.cols_2 > .main
-{
-  float: left;
-  min-height: 1em;
-  position: relative;
-  width: 100%;
-}
-.content.cols_2 > .marginal
-{
-  float: left;
-  margin: 0 -27em 0 2.625em;
-  padding: 0 2em 1.0625em 2em;
-  position: relative;
-  width: 20.375em;
-  background-color: @heller;
-}
-.content #nav
-{
-  position: absolute;
-  top: 0;
-  width: 100%;
-}
-.content.cols_2 #nav
-{
-  position: relative;
-  top: auto;
-  right: auto;
-  width: 22.375em; /** 358px = 326px + 32px*/
-}
-.content.cols_2 #nav > #menu
-{
-  margin: 0 0 -2.125em 0; /** 0 0 -34px 0 */
-}
-.content.cols_1 #nav > #menu
-{
-  position: absolute;
-  top: -7em; /** 112px */
-  right: 0;
-  margin: 0;
-}
-
-/** Always display vertical scroll-bars */
-body { overflow-y: scroll; }
diff --git a/src/main/webapp/less/base/navigation.less b/src/main/webapp/less/base/navigation.less
deleted file mode 100644 (file)
index 10e1572..0000000
--- a/src/main/webapp/less/base/navigation.less
+++ /dev/null
@@ -1,187 +0,0 @@
-@import '../variables.less';
-
-#menu
-{
-  position: relative;
-  width: 200%;
-  top: -7em;
-  right: 100%;
-  text-align: right;
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-}
-#menu > li.m
-{
-  display: inline-block;
-  padding: 0 0 0 4em;
-}
-#menu > li.m > .m
-{
-  font-family: 'BPreplay', Helvetica, Arial, sans-serif;
-  font-weight: bold;
-  font-size: 250%; /** 40px */
-  color: @normal;
-}
-#menu > li.m > a.m
-{
-  border-color: @normal;
-}
-#menu > li.m > a.m:hover
-{
-  border-color: @dunkler;
-}
-#menu > li.m > a.m:hover,
-#menu > li.m > strong.m
-{
-  border-style: solid;
-}
-#menu > li.m > a.m:hover
-{
-  color: @dunkler;
-}
-#menu > li.m > a.m:hover:before,
-#menu > li.m > a.m.selected:before,
-#menu > li.m > strong.m:before
-{
-  content: '> ';
-  margin-left: -.92em;
-}
-
-#breadcrumb
-{
-  position: absolute;
-  top: 8.4em;
-  left: 13.4em;
-  z-index: 3;
-  font-family: 'BPreplay', Helvetica, Arial, sans-serif;
-  font-weight: bold;
-  color: @normal;
-}
-#breadcrumb > strong.b
-{
-  float: left;
-}
-#breadcrumb > ol.b
-{
-  display: inline;
-  margin: 0;
-  padding: 0;
-  list-style-type: none;
-}
-#breadcrumb > ol.b > li.b
-{
-  float: left;
-  margin: 0 .5em 0 0;
-  padding: 0;
-}
-#breadcrumb > ol.b > li.b:before
-{
-  content: '> ';
-  margin-right: .25em;
-}
-#breadcrumb > ol.b > li.b:first-child:before
-{
-  content: '';
-  margin: 0 0 0 1em;
-}
-#breadcrumb > ol.b > li.b > strong.b
-{
-  border-bottom: 1px solid @normal;
-}
-#breadcrumb > ol.b > li.b > a.b
-{
-  color: @normal;
-}
-#breadcrumb > ol.b > li.b > a.b:hover,
-#breadcrumb > ol.b > li.b > a.b:focus,
-#breadcrumb > ol.b > li.b > a.b:active
-{
-  color: @dunkler;
-}
-
-#nav > h1.nav,
-#nav > h2.nav.menu
-{
-  display: none;
-}
-#nav > h2.nav.submenu
-{
-  font-size: 125%; /** 20px */
-  line-height: 1em; /** 20px */
-  margin: 1.5em 0 .5em 0; /** 30px 0 10px 0 */
-  padding: 0 0 0 1.65em; /** 0 0 0 33px */
-}
-#nav > h2.nav.submenu:before
-{
-  content: 'V ';
-  margin: 0 .75em 0 -1.7em; /** 0 15em 0 -34px */
-}
-#nav > h2.nav.submenu > span.s
-{
-  display: none;
-}
-#nav > h2.nav.submenu > a.s
-{
-  color: @hintergrund;
-  border-style: dashed;
-  border-color: @hintergrund;
-}
-#nav > h2.nav.submenu > a.s:hover,
-#nav > h2.nav.submenu > a.s:focus,
-#nav > h2.nav.submenu > a.s:active
-{
-  border-style: solid;
-}
-
-#submenu
-{
-  font-family: 'BPreplay', Helvetica, Arial, sans-serif;
-  font-weight: bold;
-  font-size: 125%; /** 20 px */
-  list-style-type: none;
-  margin: 1em 0 4em 0;
-  padding: 0 0 0 1.65em; /** 0 0 0 33px */
-}
-#submenu ul.s
-{
-  margin: 1em 0 0 0; /** 16px 0 0 0 */
-  padding: 0;
-  list-style-type: none;
-}
-#submenu li.s
-{
-  margin: 0 0 .5em 0; /** 0 0 10px 0 */
-  padding: 0;
-}
-#submenu li.s.off
-{
-  display: none;
-}
-#submenu li.s > a.selected,
-#submenu li.s > strong.s
-{
-  color: @hintergrund;
-  border-color: @hintergrund;
-}
-#submenu li.s > strong.s
-{
-  border-bottom: 1px solid @hintergrund;
-}
-#submenu li.s > a.s.selected:before,
-#submenu li.s > a.s:hover:before,
-#submenu li.s > a.s:focus:before,
-#submenu li.s > a.s:active:before,
-#submenu li.s > strong.s:before
-{
-  content: '> ';
-  margin: 0 .75em 0 -1.7em; /** 0 15px 0 -34px = Warum auch immer?!? */
-}
-#submenu li.s.sub > a.s.selected:before,
-#submenu li.s.sub > a.s:hover:before,
-#submenu li.s.sub > a.s:focus:before,
-#submenu li.s.sub > a.s:active:before,
-#submenu li.s.sub > strong.s:before
-{
-  content: 'V ';
-}
diff --git a/src/main/webapp/less/screen/footer.less b/src/main/webapp/less/screen/footer.less
new file mode 100644 (file)
index 0000000..addab87
--- /dev/null
+++ b/src/main/webapp/less/screen/footer.less
@@ -0,0 +1,46 @@
+@import '../variables.less';
+
+#footer
+{
+  margin: 2em 0;
+}
+#footerlinks
+{
+  font-family: 'BPreplay', Helvetica, Arial, sans-serif;
+  font-weight: bold;
+  position: relative;
+  border-top: 1.25em solid @normal; /** 20px */
+  margin: 0;
+  padding: 0;
+  list-style-type: none;
+}
+#footerlinks > li.f
+{
+  font-size: 137.5%; /** 22 px */
+  line-height: .6666666667em; /* 20px */
+  display: inline-block;
+  margin: .5em 1em 0 0;
+  color: @normal;
+  vertical-align: top;
+}
+#footerlinks > li#copyright
+{
+  position: absolute;
+  right: .625em;
+  top: -1em; /** 30px */
+  line-height: 1.4em; /* 42px */
+  color: @hintergrund;
+  margin: 0;
+  font-size: 187.5%; /** 30px */
+}
+#footerlinks a.f
+{
+  color: @normal;
+  border-color: @normal;
+}
+#footerlinks a.f:hover
+{
+  color: @dunkler;
+  border-color: @dunkler;
+  border-style: solid;
+}
diff --git a/src/main/webapp/less/screen/head.less b/src/main/webapp/less/screen/head.less
new file mode 100644 (file)
index 0000000..6befe52
--- /dev/null
+++ b/src/main/webapp/less/screen/head.less
@@ -0,0 +1,48 @@
+@import '../variables.less';
+
+#header
+{
+  font-family: 'BPreplay', Helvetica, Arial, sans-serif;
+  font-weight: bold;
+  margin-left: -4em;
+}
+#header > hr
+{
+  display: none;
+}
+#logo
+{
+  display: inline-block;
+  font-size: 812.5%; /* 130px */
+  line-height: 1em;
+  padding: 0 0 0 .230769231em; /* 30px */
+  color: @normal;
+  text-shadow: .092307692em .046153846em 0 @hintergrund; /** 12px 6px */
+  border: none;
+  position: relative;
+  z-index: 1;
+}
+#logo:hover
+{
+  color: @dunkler;
+}
+#slogan
+{
+  display: block;
+  color: @hintergrund;
+  background-color: @normal;
+  font-size: 187.5%; /** 30px */
+  line-height: .6666666667em; /* 20px */
+  height: .6em; /* 18px */
+  padding: .066666667em .066666667em 0 0; /** 2px 2px 0 0 */
+  margin-left: 10em; /* 300px */
+  position: relative;
+  z-index: 0;
+  top: -1.3em; /* 39px */
+  text-align: right;
+}
+#slogan > strong{
+  display: inline-block;
+  position: relative;
+  top: -.2em; /* -6px */
+}
diff --git a/src/main/webapp/less/screen/layout.less b/src/main/webapp/less/screen/layout.less
new file mode 100644 (file)
index 0000000..efeddf9
--- /dev/null
+++ b/src/main/webapp/less/screen/layout.less
@@ -0,0 +1,56 @@
+@import '../variables.less';
+
+.content
+{
+  position: relative;
+}
+.content.cols_2
+{
+  padding: 0 27em 0 0;
+  background-image: url('../../img/bg.gif');
+  background-repeat: repeat-y;
+  background-position: right top;
+}
+.content.cols_2 > .main
+{
+  float: left;
+  min-height: 1em;
+  position: relative;
+  width: 100%;
+}
+.content.cols_2 > .marginal
+{
+  float: left;
+  margin: 0 -27em 0 2.625em;
+  padding: 0 2em 1.0625em 2em;
+  position: relative;
+  width: 20.375em;
+  background-color: @heller;
+}
+.content #nav
+{
+  position: absolute;
+  top: 0;
+  width: 100%;
+}
+.content.cols_2 #nav
+{
+  position: relative;
+  top: auto;
+  right: auto;
+  width: 22.375em; /** 358px = 326px + 32px*/
+}
+.content.cols_2 #nav > #menu
+{
+  margin: 0 0 -2.125em 0; /** 0 0 -34px 0 */
+}
+.content.cols_1 #nav > #menu
+{
+  position: absolute;
+  top: -7em; /** 112px */
+  right: 0;
+  margin: 0;
+}
+
+/** Always display vertical scroll-bars */
+body { overflow-y: scroll; }
diff --git a/src/main/webapp/less/screen/navigation.less b/src/main/webapp/less/screen/navigation.less
new file mode 100644 (file)
index 0000000..10e1572
--- /dev/null
+++ b/src/main/webapp/less/screen/navigation.less
@@ -0,0 +1,187 @@
+@import '../variables.less';
+
+#menu
+{
+  position: relative;
+  width: 200%;
+  top: -7em;
+  right: 100%;
+  text-align: right;
+  list-style-type: none;
+  margin: 0;
+  padding: 0;
+}
+#menu > li.m
+{
+  display: inline-block;
+  padding: 0 0 0 4em;
+}
+#menu > li.m > .m
+{
+  font-family: 'BPreplay', Helvetica, Arial, sans-serif;
+  font-weight: bold;
+  font-size: 250%; /** 40px */
+  color: @normal;
+}
+#menu > li.m > a.m
+{
+  border-color: @normal;
+}
+#menu > li.m > a.m:hover
+{
+  border-color: @dunkler;
+}
+#menu > li.m > a.m:hover,
+#menu > li.m > strong.m
+{
+  border-style: solid;
+}
+#menu > li.m > a.m:hover
+{
+  color: @dunkler;
+}
+#menu > li.m > a.m:hover:before,
+#menu > li.m > a.m.selected:before,
+#menu > li.m > strong.m:before
+{
+  content: '> ';
+  margin-left: -.92em;
+}
+
+#breadcrumb
+{
+  position: absolute;
+  top: 8.4em;
+  left: 13.4em;
+  z-index: 3;
+  font-family: 'BPreplay', Helvetica, Arial, sans-serif;
+  font-weight: bold;
+  color: @normal;
+}
+#breadcrumb > strong.b
+{
+  float: left;
+}
+#breadcrumb > ol.b
+{
+  display: inline;
+  margin: 0;
+  padding: 0;
+  list-style-type: none;
+}
+#breadcrumb > ol.b > li.b
+{
+  float: left;
+  margin: 0 .5em 0 0;
+  padding: 0;
+}
+#breadcrumb > ol.b > li.b:before
+{
+  content: '> ';
+  margin-right: .25em;
+}
+#breadcrumb > ol.b > li.b:first-child:before
+{
+  content: '';
+  margin: 0 0 0 1em;
+}
+#breadcrumb > ol.b > li.b > strong.b
+{
+  border-bottom: 1px solid @normal;
+}
+#breadcrumb > ol.b > li.b > a.b
+{
+  color: @normal;
+}
+#breadcrumb > ol.b > li.b > a.b:hover,
+#breadcrumb > ol.b > li.b > a.b:focus,
+#breadcrumb > ol.b > li.b > a.b:active
+{
+  color: @dunkler;
+}
+
+#nav > h1.nav,
+#nav > h2.nav.menu
+{
+  display: none;
+}
+#nav > h2.nav.submenu
+{
+  font-size: 125%; /** 20px */
+  line-height: 1em; /** 20px */
+  margin: 1.5em 0 .5em 0; /** 30px 0 10px 0 */
+  padding: 0 0 0 1.65em; /** 0 0 0 33px */
+}
+#nav > h2.nav.submenu:before
+{
+  content: 'V ';
+  margin: 0 .75em 0 -1.7em; /** 0 15em 0 -34px */
+}
+#nav > h2.nav.submenu > span.s
+{
+  display: none;
+}
+#nav > h2.nav.submenu > a.s
+{
+  color: @hintergrund;
+  border-style: dashed;
+  border-color: @hintergrund;
+}
+#nav > h2.nav.submenu > a.s:hover,
+#nav > h2.nav.submenu > a.s:focus,
+#nav > h2.nav.submenu > a.s:active
+{
+  border-style: solid;
+}
+
+#submenu
+{
+  font-family: 'BPreplay', Helvetica, Arial, sans-serif;
+  font-weight: bold;
+  font-size: 125%; /** 20 px */
+  list-style-type: none;
+  margin: 1em 0 4em 0;
+  padding: 0 0 0 1.65em; /** 0 0 0 33px */
+}
+#submenu ul.s
+{
+  margin: 1em 0 0 0; /** 16px 0 0 0 */
+  padding: 0;
+  list-style-type: none;
+}
+#submenu li.s
+{
+  margin: 0 0 .5em 0; /** 0 0 10px 0 */
+  padding: 0;
+}
+#submenu li.s.off
+{
+  display: none;
+}
+#submenu li.s > a.selected,
+#submenu li.s > strong.s
+{
+  color: @hintergrund;
+  border-color: @hintergrund;
+}
+#submenu li.s > strong.s
+{
+  border-bottom: 1px solid @hintergrund;
+}
+#submenu li.s > a.s.selected:before,
+#submenu li.s > a.s:hover:before,
+#submenu li.s > a.s:focus:before,
+#submenu li.s > a.s:active:before,
+#submenu li.s > strong.s:before
+{
+  content: '> ';
+  margin: 0 .75em 0 -1.7em; /** 0 15px 0 -34px = Warum auch immer?!? */
+}
+#submenu li.s.sub > a.s.selected:before,
+#submenu li.s.sub > a.s:hover:before,
+#submenu li.s.sub > a.s:focus:before,
+#submenu li.s.sub > a.s:active:before,
+#submenu li.s.sub > strong.s:before
+{
+  content: 'V ';
+}
Unnamed repository; edit this file 'description' to name the repository.