/*
* OIDplus 2.0
* Copyright 2019 Daniel Marschall, ViaThinkSoft
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/*************************************************************************************
** ATTENTION: **
*************************************************************************************
** Please do NOT edit this file, since a software update might override **
** your changes. **
** To create an individual theme, please clone this file to oidplus_base.local.css **
** When the file oidplus_base.local.css is present, OIDplus will use **
** this file instead of oidplus_base.css **
** Note: **
** - If you just want to change colors, then the color plugin in the admin area **
** could an option for you. **
** - Please regularly check if oidplus_base.css gets changed or extended **
** during software updates, and apply the changes to your oidplus_base.local.css **
*************************************************************************************/
@media print {
/* Printing */
.ui-layout-west, .ui-layout-resizer {
display:none !important;
}
.ui-layout-center {
left:0px !important;
width:100% !important;
}
#oidtree, .ui-layout-center {
position:relative !important;
width:100% !important;
top: 0 !important;
}
#content_window {
top: 0 !important;
}
}
@media only screen and (max-width: 800px) {
/* Mobile */
.ui-layout-west, .ui-layout-resizer {
display:none !important;
}
.ui-layout-center {
left:0px !important;
width:100% !important;
}
#oidtree, .ui-layout-center {
position:relative !important;
width:100% !important;
padding-right:10px !important;
top: 0 !important;
}
#content_window {
top: 0 !important;
}
#frames {
display:flex;
flex-direction:column;
align-items: flex-start;
}
#system_title_bar {
order:0;
flex:none;
}
#oidtree {
order:1;
flex:none;
}
#content_window {
order:2;
flex:none;
}
#system_title_text {
overflow-x:scroll; /* TODO: at computer browser, you see a scroll bar */
}
}
@media only screen and (min-width: 801px) {
/* Desktop */
#system_title_menu {
display:none !important;
}
}
#system_title_bar {
width:100% !important;
position:relative !important;
white-space: nowrap;
}
body, #frames {
width:100%;
height:100%;
}
.wrap {
overflow-x: auto;
margin: 0 auto;
width:100%;
}
.gray_footer_font {
color:#808080;
font-size:0.9em;
}
label.padding_label {
font-weight: normal !important;
display: inline-block;
clear: left;
width: 100px;
text-align: right;
padding-top: 3px;
margin-right: 8px;
}
.box {
width:auto !important;
padding:20px;
background-color:#fff;
border:1px solid #ccc;
border-radius:5px;
margin-top:10px;
}
#titleedit {
width:100%;
}
#system_title_1 {
color:#2D6A9F;
margin-left:5px;
}
#system_title_2 {
color:#2B336F;
font-size:2em;
margin-left:5px;
}
/* Mobile menu button */
#bar1, #bar2, #bar3 {
width: 27px;
height: 5px;
background-color: #FFA500;
margin: 6px 0;
transition: 0.4s;
margin-left:14px;
}
#system_title_menu.active {
background-color: #FFA500;
}
.active #bar1 {
-webkit-transform: rotate(-45deg) translate(-7.5px, 7.5px);
transform: rotate(-45deg) translate(-7.5px, 7.5px);
background-color: #000;
}
.active #bar2 {
opacity: 0;
background-color: #000;
}
.active #bar3 {
-webkit-transform: rotate(45deg) translate(-8px, -8px);
transform: rotate(45deg) translate(-8px, -8px);
background-color: #000;
}
.hover #bar1, .hover #bar2, .hover #bar3 {
background-color:#fff;
}
#system_title_menu {
width:55px;
height:55px;
padding-top:8px;
text-decoration: none;
font-size: 19px;
display: none; /* will be set to 'block' by JavaScript */
background-color: #000;
float:left;
cursor: pointer;
}
/* Title bar */
#system_title_bar {
line-height:1.75em;
height:55px !important;
font-style:italic;
font-weight:bolder;
float:left;
border-bottom:1px;
width:100%; /* required for NoScript */
padding-left:5px;/* required for NoScript */
padding-right:5px;/* required for NoScript */
padding-left:0px;
margin-left:0px;
display:block;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a0d8ef+0,ddf1f9+65,feffff+100 */
background: #a0d8ef; /* Old browsers */
background: -moz-linear-gradient(left, #a0d8ef 0%, #ddf1f9 65%, #feffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #a0d8ef 0%,#ddf1f9 65%,#feffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #a0d8ef 0%,#ddf1f9 65%,#feffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a0d8ef', endColorstr='#feffff',GradientType=1 ); /* IE6-9 */
overflow:hidden;
}
#system_title_bar a {
text-decoration:none;
}
/* OID-Tree */
@media only screen and (max-width: 800px) {
/* Mobile */
#content_window {
padding-left:16px;
padding-top:0px;
}
}
@media only screen and (min-width: 801px) {
/* Desktop */
#oidtree {
position:absolute;
left:0px;
bottom:0px;
top:55px; /* required for NoScript */
width:400px; /* required for NoScript */
padding-top:5px;
white-space:nowrap; /* required for NoScript */
overflow:scroll; /* required for NoScript */
}
#content_window {
position:absolute;
left:400px;
right:0px;
bottom:0px;
top:55px; /* required for NoScript */
padding-left:20px;
padding-right:20px;
}
}
#oidtree {
padding-top:5px !important;
padding-left:5px;/* required for NoScript */
padding-right:5px;/* required for NoScript */
}
html {
margin:0;
padding:0;
height:100%;
font-family:Helvetica;
}
body {
margin:0px;
padding:0px;
font-size:0.85em;
height:100%;
/* Bootstrap adds "Helvetica Neue",Helvetica at the beginning which causes bold font in IE11+Win10 */
font-family:Arial,sans-serif !important;
}
@media only screen and (min-width: 801px) {
/* Desktop */
body {
overflow:hidden;
}
.borderbox {
border:1px solid silver;
}
}
.borderbox {
overflow:auto;
}
h1 {
font-size:1.8em;
}
h2 {
font-size:1.6em !important;
}
textarea,input[type="text"],input[type="password"],select {
/* for dark themes, this looks better */
/*background:transparent;*/
background:rgba(255,255,255,0.4);
border: #AAAAAA 1px solid;
}
input[type=button], input[type=submit], input[type=reset],
input[type=button]:link, input[type=submit]:link, input[type=reset]:link,
input[type=button]:visited, input[type=submit]:visited, input[type=reset]:visited,
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
border: 1px solid #a2a2a2;
padding-top:2px;
padding-bottom:2px;
padding-left:7px;
padding-right:7px;
text-decoration:none;
background: #ffffff;
color: #0066CC;
}
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover {
background: #f4f4ff;
}
.hand, input[type=button], input[type=submit], input[type=reset] {
/* www.drweb.de/magazin/browser-cursor-hand */
cursor: hand; cursor: pointer;
}
/**
* Splitter / uiLayout
*/
.ui-layout-pane { /* all 'panes' */
border: 1px solid #BBB;
}
.ui-layout-pane-center { /* content body */
padding: 0;
margin: 0;
}
.ui-layout-pane-west { /* west pane */
padding: 0 10px;
background-color: #f9f9f9 !important;
overflow: auto;
}
.ui-layout-resizer { /* all 'resizer-bars' */
background: #DDD;
top:55px !important; /* DM 13.03.2019 */
}
.ui-layout-resizer-open:hover { /* mouse-over */
background: #9D9;
}
.ui-layout-resizer-north {
background:#2b336f !important;
z-index:10 !important; /* DM 13.03.2019 */
}
.ui-layout-toggler { /* all 'toggler-buttons' */
background: #AAA;
}
.ui-layout-toggler-closed { /* closed toggler-button */
background: #CCC;
border-bottom: 1px solid #BBB;
}
.ui-layout-toggler .content { /* toggler-text */
font: 14px bold Verdana, Verdana, Arial, Helvetica, sans-serif;
}
.ui-layout-toggler:hover { /* mouse-over */
background: #DCA;
}
.ui-layout-toggler:hover .content { /* mouse-over */
color: #009;
}
/* masks are usually transparent - make them visible (must 'override' default) */
.ui-layout-mask {
background: #C00 !important;
opacity: .20 !important;
filter: alpha(opacity=20) !important;
}
/* Language box */
@media only screen and (min-width: 801px) {
/* Desktop */
#languageBox {
position:absolute;
right:420px;
top:15px;
}
}
.lng_flag {
cursor: pointer;
border: 1px solid #000 !important;
}
.picture_ghost {
opacity: 0.5;
}
/* Goto box */
@media only screen and (max-width: 800px) {
/* Mobile */
#gotobox {
/*max-width:350px;*/
width:75%;
}
.mobilehidden {
display:none !important;
}
}
@media only screen and (min-width: 801px) {
/* Desktop */
#gotobox {
position:absolute;
right:10px;
top:10px;
width:30%;
max-width:400px;
}
}
#gotobox {
display: none; /* will be set to 'block' by JavaScript */
line-height:1.75em;
height:55px !important;
font-style:italic;
font-weight:bolder;
float:left;
border-bottom:1px;
width:100%; /* required for NoScript */
padding-left:5px;/* required for NoScript */
padding-right:5px;/* required for NoScript */
padding-left:0px;
margin-left:0px;
}
#gotobox input[type="text"] {
width:calc(100% - 45px);
}
#gotobox input[type="button"] {
width:40px;
}
/* Logbook severities (shared between plugins ra099, ra200, admin600)
.severity_0 {
/* Undefined */
}
.severity_1 {
/* Success */
color: DarkGreen;
}
.severity_2 {
/* Informational */
color: CornflowerBlue;
}
.severity_3 {
/* Warning */
color: DarkGoldenRod;
}
.severity_4 {
/* Error */
color: DarkRed;
}
.severity_5 {
/* Critical */
color: DarkMagenta;
}