diff gnv/src/main/webapp/styles/gnv.css @ 710:5f29bfeb61bd

Improved the design and layout of the user interface. gnv/trunk@980 c6561f87-3c4e-4783-a992-168aeb5c3f6f
author Ingo Weinzierl <ingo.weinzierl@intevation.de>
date Sun, 25 Apr 2010 21:05:44 +0000
parents
children e021b07b4d71
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/gnv/src/main/webapp/styles/gnv.css	Sun Apr 25 21:05:44 2010 +0000
@@ -0,0 +1,283 @@
+body {
+    background-color: #FFFFFF;
+    font-family:      verdana, arial, Helvetica, sans-serif;
+    font-size:        0.7em;
+    height:           100%;
+    margin:           0;
+    padding:          0;
+}
+
+fieldset {
+    margin: 5px 0 0 10px;
+    padding-left: 10px;
+    padding-right: 10px;
+    border: 1px solid #003A66;
+    background-color: #F2F1F5;
+    background-repeat: repeat-x;
+    background-position: top left;
+    display: block;
+}
+
+legend {
+    border: 1px solid #003A66;
+    padding: 4px 5px;
+    margin: 0 0 0 0;
+    background-color: white;
+    font-weight: bolder;
+    color: #003A66;
+    clear: both;
+}
+
+input, select, textarea {
+    font-family: verdana, arial, Helvetica, sans-serif;
+}
+
+input {
+    font-size: 0.9em;
+}
+
+img {
+    border: 0px;
+}
+
+a {
+    color:           #FF6600;
+    font-size:       1.2em;
+    text-decoration: underline;
+}
+
+/* Some classes for the header */
+#headerElement {
+    float:    left;
+    top:      0px;
+    width:    100%;
+}
+
+#header {
+    background-color: #143B62;
+    margin: 0;
+    padding: 0;
+    height: 50px;
+}
+
+#headline {
+    color: #4C7594;
+    font-family: "Arial Black",Arial,Helvetica,sans-serif;
+    font-weight: bold;
+    line-height: 1.1em;
+    padding-left: 5px;
+    width: 533px;
+}
+
+.headline {
+    border-top: 2px solid #CCe0f4;
+    border-bottom: 2px solid #CCe0f4;
+    color: #4C7594;
+    padding: 10px;
+}
+
+.headerTableLinks {
+    width: 100%;
+    background-color: #003a66;
+}
+
+.headerLineLinks {
+    color:          #FFFFFF;
+    font-family:    Arial,Helvetica,sans-serif;
+    text-decoration:none;
+}
+
+/* Some classes for the project load/save bar */
+#project {
+    background-color: #e9e8f0;
+    height:           5%;
+    left:             0px;
+    padding:          0px;
+    text-align:       left;
+    top:              0px;
+    width:            100%;
+}
+
+#projectload {
+    visibility: hidden;
+}
+
+#browseDiv {
+    float: left;
+}
+
+#loadDiv {
+    float:       left;
+    margin-left: 5px;
+}
+
+/* Some classes for the content */
+#contentElement {
+    float:  left;
+    height: 90%;
+    width:  100%;
+    margin: 0px 0px 10px 0px;
+}
+
+#contentRow {
+    vertical-align: top;
+}
+
+#parameterColumn {
+    width: 400px;
+}
+
+#parameterPanel {
+    float:  left;
+    width:  350px;
+}
+
+.static {
+    background-color: #F2F1F5;
+    width: 300px;
+}
+
+.parameter {
+    color:          #003A66;
+    font-weight:    bold;
+    padding-left:   5px;
+    text-align:     left;
+    vertical-align: top;
+    width:          110px;
+}
+
+.historyback {
+    padding-left:   10px;
+    vertical-align: top;
+    text-align: right;
+}
+
+.statistics {
+    width: 350px;
+}
+
+div.outerMap {
+    float:  left;
+    width:  555px;
+    height: 436px;
+}
+
+div.wms {
+    top: 10%;
+    left: 0px;
+    height: 30px;
+    border: 1px solid red;
+}
+
+div#map {
+    top: 65px;
+    left: 0px;
+    width: 555px;
+    height: 381px;
+    border: 1px solid #CCD5DE;
+}
+
+
+/* Some classes for the footer */
+#footerElement {
+    clear:    left;
+    bottom:   20px;
+    width:    100%;
+    height:   20px;
+}
+
+.footerTable {
+    width:            100%; 
+    background-color: white;
+}
+
+.footerLine {
+    color:          #003A66;
+    font-family:    Arial,Helvetica,sans-serif;
+    line-height:    1.1em;
+    padding-left:   1px;
+}
+
+.footerTableLinks {
+    width: 100%;
+    background-color: #003a66;
+}
+
+.footerLineLinks {
+    color:          #FFFFFF;
+    font-family:    Arial,Helvetica,sans-serif;
+    text-decoration:none;
+}
+
+
+/* ---------- OVERLAY ------------------------- */
+#overlay {
+    visibility: hidden;
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    text-align: center;
+    z-index: 100;
+    background-color: white;
+    -moz-opacity: 0.5;
+    opacity: 0.5;
+}
+
+#overlayContent {
+    visibility: hidden;
+    position: relative;
+    z-index: 101;
+    width: 300px;
+    margin: 150px auto;
+    background-color: #fff;
+    border: 1px solid #000;
+    padding: 75px;
+    text-align: right;
+    background-image: url( ../images/bsh_logo.gif );
+    background-repeat: no-repeat;
+}
+
+
+/* warnings and errors */
+.projectException {
+    color:       red;
+    font-size:   10px;
+    font-weight: bold;
+    margin-bottom:  2px;
+    border:         2px solid red;
+    padding:        2px;
+}
+
+.chartException {
+    color:       red;
+    font-size:   10px;
+    font-weight: bold;
+    margin-bottom:  2px;
+    border:         2px solid red;
+    padding:        2px;
+}
+
+.inputException {
+    color:          red;
+    font-size:      10px;
+    font-weight:    bold;
+    margin-bottom:  2px;
+    border:         2px solid red;
+    padding:        2px;
+}
+
+.error {
+    color: #CD3426;
+    font-size: 10px;
+    font-weight: bold;
+    margin-bottom:  2px;
+    border:         2px solid red;
+    padding:        2px;
+}
+
+.errormsg {
+    color: red;
+    font-weight: bold;
+}

http://dive4elements.wald.intevation.org