src/main/webapp/lightpit.css

Sun, 08 Jan 2023 17:07:26 +0100

author
Mike Becker <universe@uap-core.de>
date
Sun, 08 Jan 2023 17:07:26 +0100
changeset 268
ca5501d851fa
parent 266
65c72e65ff67
child 283
ea6181255423
permissions
-rw-r--r--

#15 add issue filters

     1 /*
     2  * DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS HEADER.
     3  * 
     4  * Copyright 2021 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 @font-face {
    31     font-family: LightPIT;
    32     src: url('fonts/MPLUS1p-Thin.ttf');
    33     font-weight: 100;
    34 }
    36 @font-face {
    37     font-family: LightPIT;
    38     src: url('fonts/MPLUS1p-Light.ttf');
    39     font-weight: 300;
    40 }
    42 @font-face {
    43     font-family: LightPIT;
    44     src: url('fonts/MPLUS1p-Regular.ttf');
    45     font-weight: 400;
    46 }
    48 @font-face {
    49     font-family: LightPIT;
    50     src: url('fonts/MPLUS1p-Medium.ttf');
    51     font-weight: 500;
    52 }
    54 @font-face {
    55     font-family: LightPIT;
    56     src: url('fonts/MPLUS1p-Bold.ttf');
    57     font-weight: 700;
    58 }
    60 html {
    61     font-family: LightPIT,sans-serif;
    62     font-size: 11pt;
    63     background: white;
    64     color: #1c204e;
    65     margin: 0;
    66     padding: 0;
    67     height: 100vh;
    68 }
    70 body {
    71     height: 100%;
    72     margin: 0;
    73     padding: 0;
    74 }
    76 h2 {
    77     margin: 0.75em 0;
    78 }
    80 h3 {
    81     margin: 0.25em 0;
    82 }
    84 textarea, input, button, select {
    85     font-family: inherit;
    86     font-size: inherit;
    87 }
    89 a {
    90     cursor: pointer;
    91     color: #3060f8;
    92     text-decoration: none;
    93 }
    95 #body-area {
    96     display: grid;
    97     grid-template-columns: min-content auto;
    98     grid-template-rows: max-content 1fr;
    99     height: 100%;
   100 }
   102 #mainMenu {
   103     grid-row: 1;
   104     grid-column: 1 / span 2;
   105     width: 100%;
   106     display: flex;
   107     flex-flow: row wrap;
   108     border-image-source: linear-gradient(to right, #606060, rgba(60, 60, 60, .25));
   109     border-image-slice: 1;
   110     border-bottom-style: solid;
   111     border-bottom-width: thin;
   112     font-size: 1.2rem;
   113     background: #e0e0e5;
   114 }
   116 #sideMenu {
   117     grid-row: 2;
   118     grid-column: 1;
   119     min-width: 15vw;
   120     display: flex;
   121     flex-flow: column;
   122     color: #3060f8;
   123     border-image-source: linear-gradient(to bottom, #606060, rgba(60, 60, 60, .25));
   124     border-image-slice: 1;
   125     border-right-style: solid;
   126     border-right-width: thin;
   127     background: #f7f7ff;
   128 }
   130 #sideMenuFiller {
   131     grid-row: 2;
   132     grid-column: 1;
   133 }
   135 #mainMenu .menuEntry {
   136     padding: .25em 1em .25em 1em;
   137     border-right-style: solid;
   138     border-right-width: thin;
   139     border-right-color: #9095a1;
   140 }
   142 #sideMenu .menuEntry {
   143     white-space: nowrap;
   144     padding-right: 2em;
   145     padding-top: .25em;
   146     padding-bottom: .25em;
   147     border-bottom-style: solid;
   148     border-bottom-width: thin;
   149     border-bottom-color: #d7d7df;
   150 }
   152 #mainMenu .menuEntry[data-active] {
   153     background: #d0d0d5;
   154 }
   156 #sideMenu .menuEntry[data-active] {
   157     background: #e7e7ef
   158 }
   160 #sideMenu .level-0 {
   161     padding-left: .75em;
   162 }
   164 #sideMenu .level-1 {
   165     padding-left: 1.25em;
   166 }
   168 #sideMenu .level-2 {
   169     padding-left: 2.5em;
   170 }
   172 #content-area {
   173     grid-row: 2;
   174     grid-column: 2;
   175     padding: 1.5em;
   176 }
   178 button, a.button {
   179     display: inline-block;
   180     font-size: medium;
   181     border-style: solid;
   182     border-width: thin;
   183     border-color: #606060;
   184     color: inherit;
   185     background: #f0f0f0;
   187     padding: .25em .5em .25em .5em;
   188     cursor: default;
   189     text-decoration: none;
   190     text-align: center;
   191     font-variant-caps: small-caps;
   192 }
   194 button:hover, a.button:hover {
   195     background: #f0f0ff;
   196 }
   198 button[data-toggle], a.button[data-toggle] {
   199     border-color: #1040a0;
   200     background: #d0d0d5;
   201 }
   203 button[type=submit], a.button.submit {
   204     background: #20a0ff;
   205     color: white;
   206 }
   208 button[type=submit]:hover, a.button.submit:hover {
   209     background: #1090cf;
   210 }
   212 th {
   213     text-align: left;
   214 }
   216 table.datatable {
   217     border-style: solid;
   218     border-width: thin;
   219     border-color: silver;
   220     border-collapse: collapse;
   221 }
   223 table.datatable th {
   224     white-space: nowrap;
   225     font-weight: bold;
   226     background: #f7f7ff;
   227 }
   229 table.datatable th, table.datatable td {
   230     border-style: solid;
   231     border-width: thin;
   232     border-color: lightgray;
   233     padding: .4em;
   234 }
   236 table.datatable tr:nth-child(2n) {
   237     background: #faffff;
   238 }
   240 table.formtable {
   241     border-style: none;
   242     border-collapse: separate;
   243     border-spacing: 1em;
   244 }
   246 table.formtable th {
   247     font-weight: bold;
   248     text-align: left;
   249     vertical-align: center;
   250     white-space: nowrap;
   251 }
   253 table.formtable tbody td > * {
   254     margin: 0;
   255     box-sizing: border-box;
   256 }
   258 table.formtable input[type=text],
   259 table.formtable input[type=number],
   260 table.formtable select,
   261 table.formtable textarea {
   262     width: 100%;
   263 }
   265 table.formtable tfoot td {
   266     text-align: right;
   267 }
   269 .fullwidth {
   270     width: 100%;
   271 }
   273 .vtop {
   274     vertical-align: top;
   275 }
   277 .hcenter {
   278     text-align: center;
   279 }
   281 .hright {
   282     text-align: right;
   283 }
   285 .smalltext {
   286     font-size: smaller;
   287 }
   289 .nowrap {
   290     white-space: nowrap;
   291 }
   293 .medskip {
   294     margin-top: .5em;
   295 }
   297 .info-box, .error-box, .warn-box {
   298     margin: 1.5em;
   299     border-style: dashed;
   300     border-width: thin;
   301     border-color: deepskyblue;
   302     padding: 1em;
   303 }
   305 .error-box {
   306     border-style: outset;
   307     border-color: red;
   308     background: lightcoral;
   309 }
   311 .warn-box {
   312     border-style: outset;
   313     border-color: gold;
   314     background: lightgoldenrodyellow;
   315 }
   317 .table {
   318     display: table;
   319     border-spacing: .5em;
   320     margin: -.5em;
   321 }
   323 .row {
   324     display: table-row;
   325 }
   327 .caption {
   328     font-weight: bold;
   329 }
   331 .row > div {
   332     display: table-cell;
   333 }
   335 /* MARKDOWN STYLES */
   337 div.markdown-styled p:first-child {
   338     margin-top: 0;
   339 }
   341 div.markdown-styled table {
   342     border-collapse: collapse;
   343 }
   345 div.markdown-styled td,
   346 div.markdown-styled th {
   347     padding: 0.25em;
   348     border-style: solid;
   349     border-color: darkgray;
   350     border-width: thin;
   351 }

mercurial