src/main/webapp/lightpit.css

Sat, 29 Aug 2020 11:49:53 +0200

author
Mike Becker <universe@uap-core.de>
date
Sat, 29 Aug 2020 11:49:53 +0200
changeset 101
c34c81b87674
parent 98
5c406eef0e5c
child 103
3d0d030dffa7
permissions
-rw-r--r--

minor visual improvements

     1 /*
     2  * DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS HEADER.
     3  * 
     4  * Copyright 2018 Mike Becker. All rights reserved.
     5  * 
     6  * Redistribution and use in source and binary forms, with or without
     7  * modification, are permitted provided that the following conditions are met:
     8  *
     9  *   1. Redistributions of source code must retain the above copyright
    10  *      notice, this list of conditions and the following disclaimer.
    11  *
    12  *   2. Redistributions in binary form must reproduce the above copyright
    13  *      notice, this list of conditions and the following disclaimer in the
    14  *      documentation and/or other materials provided with the distribution.
    15  *
    16  * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
    17  * AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
    18  * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
    19  * ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
    20  * LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
    21  * CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
    22  * SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
    23  * INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
    24  * CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
    25  * ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
    26  * POSSIBILITY OF SUCH DAMAGE.
    27  * 
    28  */
    30 html {
    31     font-family: sans-serif;
    32     font-size: 11pt;
    33     background: white;
    34     color: #1c204e;
    35     margin: 0;
    36     padding: 0;
    37 }
    39 body {
    40     height: 100%;
    41     margin: 0;
    42     padding: 0;
    43 }
    45 a {
    46     color: #3060f8;
    47     text-decoration: none;
    48 }
    50 #mainMenu {
    51     position: fixed;
    52     z-index: 2;
    53     width: 100%;
    54     display: flex;
    55     flex-flow: row wrap;
    56     border-image-source: linear-gradient(to right, #606060, rgba(60, 60, 60, .25));
    57     border-image-slice: 1;
    58     border-bottom-style: solid;
    59     border-bottom-width: 1pt;
    60 }
    62 #sideMenu {
    63     display: flex;
    64     z-index: 1;
    65     flex-flow: column;
    66     position: fixed;
    67     height: 100%;
    68     width: 30ch;
    69     padding-top: 2.25rem;
    70     border-image-source: linear-gradient(to bottom, #606060, rgba(60, 60, 60, .25));
    71     border-image-slice: 1;
    72     border-right-style: solid;
    73     border-right-width: 1pt;
    74 }
    76 #content-area.sidebar-spacing {
    77     margin-left: 30ch;
    78 }
    80 #mainMenu {
    81     font-size: 1.2rem;
    82     background: #e0e0e5;
    83 }
    85 #sideMenu {
    86     background: #f7f7ff;
    87     overflow-x: scroll;
    88 }
    90 #mainMenu .menuEntry {
    91     padding: .25em 1em .25em 1em;
    92     border-right-style: solid;
    93     border-right-width: 1pt;
    94     border-right-color: #9095a1;
    95 }
    97 #sideMenu .menuEntry {
    98     padding-top: .25em;
    99     padding-bottom: .25em;
   100     border-bottom-style: solid;
   101     border-bottom-width: 1pt;
   102     border-bottom-color: #d7d7df;
   103 }
   105 #mainMenu .menuEntry[data-active] {
   106     background: #d0d0d5;
   107 }
   109 #sideMenu .menuEntry[data-active] {
   110     background: #e7e7ef
   111 }
   113 #sideMenu .level-0 {
   114     padding-left: .25em;
   115 }
   117 #sideMenu .level-1 {
   118     padding-left: .75em;
   119 }
   121 #sideMenu .level-2 {
   122     padding-left: 2em;
   123 }
   125 #content-area {
   126     padding: 2.75rem 1em 1em;
   127 }
   129 button, a.button {
   130     display: inline-block;
   131     font-size: medium;
   132     border-style: outset;
   133     border-width: 2pt;
   134     border-color: #6060cc;
   135     color: inherit;
   136     background: #f0f0f0;
   138     padding: .25em .5em .25em .5em;
   139     cursor: default;
   140     text-decoration: none;
   141 }
   143 button:hover, a.button:hover {
   144     background: #f0f0ff;
   145 }
   147 button[type=submit] {
   148     background: #20a0ff;
   149     color: white;
   150 }
   152 button[type=submit]:hover {
   153     background: #1090cf;
   154 }
   156 th {
   157     text-align: left;
   158 }
   160 table.datatable {
   161     border-style: solid;
   162     border-width: 1pt;
   163     border-color: silver;
   164     border-collapse: collapse;
   165 }
   167 table.datatable th {
   168     white-space: nowrap;
   169     font-weight: bold;
   170     background: lightsteelblue;
   171 }
   173 table.datatable th, table.datatable td {
   174     border-style: solid;
   175     border-width: 1pt;
   176     border-color: black;
   177     padding: .4em;
   178 }
   180 table.datatable tr:nth-child(2n) {
   181     background: #f0ffff;
   182 }
   184 table.formtable {
   185     border-style: none;
   186     border-collapse: separate;
   187     border-spacing: 1em;
   188 }
   190 table.formtable th {
   191     font-weight: bold;
   192     text-align: left;
   193     vertical-align: center;
   194     white-space: nowrap;
   195 }
   197 table.formtable tbody td > * {
   198     width: 100%;
   199 }
   201 table.formtable input[type=date] {
   202     width: auto;
   203 }
   205 table.formtable tfoot td {
   206     text-align: right;
   207 }
   209 .fullwidth {
   210     width: 100%;
   211 }
   213 .vtop {
   214     vertical-align: top;
   215 }
   217 .hcenter {
   218     text-align: center;
   219 }
   221 .hright {
   222     text-align: right;
   223 }
   225 .smalltext {
   226     font-size: smaller;
   227 }
   229 .nowrap {
   230     white-space: nowrap;
   231 }
   233 .medskip {
   234     margin-top: .5em;
   235 }
   237 .info-box, .error-box, .warn-box {
   238     margin: 2em;
   239     border-style: dashed;
   240     border-width: 1pt;
   241     border-color: deepskyblue;
   242     padding: 1em;
   243 }
   245 .error-box {
   246     border-color: red;
   247 }
   249 .warn-box {
   250     border-color: gold;
   251 }
   253 .table {
   254     display: table;
   255     border-spacing: .5em;
   256     margin: -.5em;
   257 }
   259 .row {
   260     display: table-row;
   261 }
   263 .caption {
   264     font-weight: bold;
   265 }
   267 .row > div {
   268     display: table-cell;
   269 }

mercurial