mirror of
https://github.com/PolarisSS13/Polaris.git
synced 2025-12-20 23:21:20 +00:00
- Completely reworks the powernet sensor system that i created. - Code mostly refactored to nice properly commented one. - Sensors now have (currently unused) proc for returning HTML encoded string (it's there if someone needs it) and (newly added) proc that returns assoc list of data. - Thanks to previous, the console has been fully reworked to utilize NanoUI. - This addresses most issues with old UI which was harder to use and somewhat buggy at specific situations (such as, showing lower load than suposed)
569 lines
8.3 KiB
CSS
569 lines
8.3 KiB
CSS
body {
|
|
padding: 0;
|
|
margin: 0;
|
|
font-size: 12px;
|
|
color: #ffffff;
|
|
line-height: 170%;
|
|
font-family: Verdana, Geneva, sans-serif;
|
|
background: #272727;
|
|
}
|
|
|
|
#uiNoScript {
|
|
position: fixed;
|
|
top: 50%;
|
|
left: 50%;
|
|
margin: -60px 0 0 -150px;
|
|
width: 280px;
|
|
height: 120px;
|
|
background: #ffffff;
|
|
border: 2px solid #ff0000;
|
|
color: #000000;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
z-index: 9999;
|
|
padding: 0px 10px;
|
|
text-align: center;
|
|
}
|
|
|
|
hr {
|
|
background-color: #40628a;
|
|
height: 1px;
|
|
}
|
|
|
|
.link, .linkOn, .linkOff, .selected, .disabled, .yellowButton, .redButton {
|
|
float: left;
|
|
min-width: 15px;
|
|
height: 16px;
|
|
text-align: center;
|
|
color: #ffffff;
|
|
text-decoration: none;
|
|
background: #40628a;
|
|
border: 1px solid #161616;
|
|
padding: 0px 4px 4px 4px;
|
|
margin: 0 2px 2px 0;
|
|
cursor: default;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.hasIcon {
|
|
padding: 0px 4px 4px 0px;
|
|
}
|
|
|
|
a:hover, .zoomLink:hover, .linkActive:hover {
|
|
background: #507aac;
|
|
}
|
|
|
|
.linkPending, .linkPending:hover {
|
|
color: #ffffff;
|
|
background: #507aac;
|
|
}
|
|
|
|
a.white, a.white:link, a.white:visited, a.white:active {
|
|
color: #40628a;
|
|
text-decoration: none;
|
|
background: #ffffff;
|
|
border: 1px solid #161616;
|
|
padding: 1px 4px 1px 4px;
|
|
margin: 0 2px 0 0;
|
|
cursor: default;
|
|
}
|
|
|
|
a.white:hover {
|
|
color: #ffffff;
|
|
background: #40628a;
|
|
}
|
|
|
|
.hidden {
|
|
display: none;
|
|
}
|
|
|
|
.linkOn, a.linkOn:link, a.linkOn:visited, a.linkOn:active, a.linkOn:hover, .selected, a.selected:link, a.selected:visited, a.selected:active, a.selected:hover {
|
|
color: #ffffff;
|
|
background: #2f943c;
|
|
}
|
|
|
|
.linkOff, a.linkOff:link, a.linkOff:visited, a.linkOff:active, a.linkOff:hover, .disabled, a.disabled:link, a.disabled:visited, a.disabled:active, a.disabled:hover {
|
|
color: #ffffff;
|
|
background: #999999;
|
|
border-color: #666666;
|
|
}
|
|
|
|
a.icon, .linkOn.icon, .linkOff.icon, .selected.icon, .disabled.icon {
|
|
position: relative;
|
|
padding: 1px 4px 2px 20px;
|
|
}
|
|
|
|
a.icon img, .linkOn.icon img, .linkOff.icon img, .selected.icon img, .disabled.icon img {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
|
|
.linkDanger, a.linkDanger:link, a.linkDanger:visited, a.linkDanger:active {
|
|
color: #ffffff;
|
|
background-color: #ff0000;
|
|
border-color: #aa0000;
|
|
}
|
|
|
|
.linkDanger:hover {
|
|
background-color: #ff6666;
|
|
}
|
|
|
|
ul {
|
|
padding: 4px 0 0 10px;
|
|
margin: 0;
|
|
list-style-type: none;
|
|
}
|
|
|
|
li {
|
|
padding: 0 0 2px 0;
|
|
}
|
|
|
|
img, a img {
|
|
border-style: none;
|
|
}
|
|
|
|
h1, h2, h3, h4, h5, h6 {
|
|
margin: 0;
|
|
padding: 12px 0 6px 0;
|
|
color: #517087;
|
|
clear: both;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 18px;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 16px;
|
|
}
|
|
|
|
h3 {
|
|
font-size: 14px;
|
|
}
|
|
|
|
h4 {
|
|
font-size: 12px;
|
|
}
|
|
|
|
.white {
|
|
color: white;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.good {
|
|
color: #4f7529;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.average {
|
|
color: #cd6500;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.bad {
|
|
color: #ee0000;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.idle {
|
|
color: #272727;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.redButton {
|
|
background: #ea0000;
|
|
}
|
|
|
|
.yellowButton {
|
|
background: #cacc00;
|
|
}
|
|
|
|
.highlight {
|
|
color: #8BA5C4;
|
|
}
|
|
|
|
.dark {
|
|
color: #272727;
|
|
}
|
|
|
|
.caption {
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
padding: 5px;
|
|
}
|
|
|
|
.footer {
|
|
font-size: 10px;
|
|
}
|
|
|
|
.noticePlaceholder {
|
|
position: relative;
|
|
font-size: 12px;
|
|
font-style: italic;
|
|
font-weight: bold;
|
|
padding: 3px 4px 3px 4px;
|
|
margin: 4px 0 4px 0;
|
|
}
|
|
|
|
.notice {
|
|
position: relative;
|
|
background: url(uiNoticeBackground.jpg) 50% 50%;
|
|
color: #000000;
|
|
font-size: 12px;
|
|
font-style: italic;
|
|
font-weight: bold;
|
|
padding: 3px 4px 3px 4px;
|
|
margin: 4px 0 4px 0;
|
|
}
|
|
|
|
.notice.icon {
|
|
padding: 2px 4px 0 20px;
|
|
}
|
|
|
|
.notice img {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
|
|
div.notice {
|
|
clear: both;
|
|
}
|
|
|
|
.itemGroup {
|
|
border: 1px solid #e9c183;
|
|
background: #2c2c2c;
|
|
padding: 4px;
|
|
clear: both;
|
|
}
|
|
|
|
.item {
|
|
width: 100%;
|
|
margin: 4px 0 0 0;
|
|
clear: both;
|
|
}
|
|
|
|
.itemLabel {
|
|
float: left;
|
|
width: 30%;
|
|
color: #e9c183;
|
|
}
|
|
|
|
.itemContent {
|
|
float: left;
|
|
width: 69%;
|
|
}
|
|
|
|
.itemLabelNarrow {
|
|
float: left;
|
|
width: 20%;
|
|
color: #e9c183;
|
|
}
|
|
|
|
.itemLabelWide {
|
|
float: left;
|
|
width: 45%;
|
|
color: #e9c183;
|
|
}
|
|
|
|
.itemContentWide {
|
|
float: left;
|
|
width: 79%;
|
|
}
|
|
|
|
.itemContentSmall {
|
|
float: left;
|
|
width: 33%;
|
|
}
|
|
|
|
.itemContentMedium {
|
|
float: left;
|
|
width: 55%;
|
|
}
|
|
|
|
.statusDisplay {
|
|
background: #000000;
|
|
color: #ffffff;
|
|
border: 1px solid #40628a;
|
|
padding: 4px;
|
|
margin: 3px 0;
|
|
}
|
|
|
|
.statusDisplayRecords {
|
|
background: #000000;
|
|
color: #ffffff;
|
|
border: 1px solid #40628a;
|
|
padding: 4px;
|
|
margin: 3px 0;
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.statusLabel {
|
|
width: 138px;
|
|
float: left;
|
|
overflow: hidden;
|
|
color: #98B0C3;
|
|
}
|
|
|
|
.statusValue {
|
|
float: left;
|
|
}
|
|
|
|
.block {
|
|
padding: 8px;
|
|
margin: 10px 4px 4px 4px;
|
|
border: 1px solid #40628a;
|
|
background-color: #202020;
|
|
}
|
|
|
|
.block h3 {
|
|
padding: 0;
|
|
}
|
|
|
|
.displayBar {
|
|
position: relative;
|
|
width: 236px;
|
|
height: 16px;
|
|
border: 1px solid #666666;
|
|
float: left;
|
|
margin: 0 5px 0 0;
|
|
overflow: hidden;
|
|
background: #000000;
|
|
}
|
|
|
|
.displayBarText {
|
|
position: absolute;
|
|
top: -2px;
|
|
left: 5px;
|
|
width: 100%;
|
|
height: 100%;
|
|
color: #ffffff;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.displayBarFill {
|
|
width: 0%;
|
|
height: 100%;
|
|
background: #40628a;
|
|
overflow: hidden;
|
|
float: left;
|
|
}
|
|
|
|
.displayBarFill.alignRight {
|
|
float: right;
|
|
}
|
|
|
|
.displayBarFill.good {
|
|
color: #ffffff;
|
|
background: #4f7529;
|
|
}
|
|
|
|
.displayBarFill.average {
|
|
color: #ffffff;
|
|
background: #cd6500;
|
|
}
|
|
|
|
.displayBarFill.bad {
|
|
color: #ffffff;
|
|
background: #ee0000;
|
|
}
|
|
|
|
.displayBarFill.highlight {
|
|
color: #ffffff;
|
|
background: #8BA5C4;
|
|
}
|
|
|
|
.clearBoth {
|
|
clear: both;
|
|
}
|
|
|
|
.clearLeft {
|
|
clear: left;
|
|
}
|
|
|
|
.clearRight {
|
|
clear: right;
|
|
}
|
|
|
|
.line {
|
|
width: 100%;
|
|
clear: both;
|
|
}
|
|
|
|
.inactive, a.inactive:link, a.inactive:visited, a.inactive:active, a.inactive:hover {
|
|
color: #ffffff;
|
|
background: #999999;
|
|
border-color: #666666;
|
|
}
|
|
|
|
.fixedLeft {
|
|
width: 110px;
|
|
float: left;
|
|
}
|
|
|
|
.fixedLeftWide {
|
|
width: 165px;
|
|
float: left;
|
|
}
|
|
|
|
.fixedLeftWider {
|
|
width: 220px;
|
|
float: left;
|
|
}
|
|
|
|
.fixedLeftWidest {
|
|
width: 250px;
|
|
float: left;
|
|
}
|
|
|
|
.fixedLeftWiderRed {
|
|
width: 220px;
|
|
float: left;
|
|
background: #ee0000;
|
|
}
|
|
|
|
.floatRight {
|
|
float: right;
|
|
}
|
|
|
|
/* Used in PDA */
|
|
|
|
.wholeScreen {
|
|
position: absolute;
|
|
color: #517087;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
|
|
.pdalink {
|
|
float: left;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
/* DNA Modifier UI (dna_modifier.tmpl) */
|
|
|
|
.dnaBlock {
|
|
float: left;
|
|
width: 90px;
|
|
padding: 0 0 5px 0;
|
|
}
|
|
|
|
.dnaBlockNumber {
|
|
font-family: Fixed, monospace;
|
|
float: left;
|
|
color: #ffffff;
|
|
background: #363636;
|
|
min-width: 20px;
|
|
height: 20px;
|
|
padding: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.dnaSubBlock {
|
|
font-family: Fixed, monospace;
|
|
float: left;
|
|
padding: 0;
|
|
min-width: 16px;
|
|
height: 20px;
|
|
text-align: center;
|
|
}
|
|
|
|
.mask {
|
|
position: fixed;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: url(uiMaskBackground.png);
|
|
}
|
|
|
|
.maskContent {
|
|
width: 100%;
|
|
height: 200px;
|
|
margin: 200px 0;
|
|
text-align: center;
|
|
}
|
|
|
|
/* Table stuffs for power monitor */
|
|
table.pmon {
|
|
border: 2px solid RoyalBlue;
|
|
}
|
|
|
|
table.pmon td, table.pmon th {
|
|
border-bottom: 1px dotted black;
|
|
padding: 0px 5px 0px 5px;
|
|
}
|
|
|
|
/* Table Stuffs for manifest*/
|
|
|
|
th.command {
|
|
background: #3333FF;
|
|
font-weight: bold;
|
|
color: #ffffff;
|
|
}
|
|
|
|
th.sec {
|
|
background: #8e0000;
|
|
font-weight: bold;
|
|
color: #ffffff;
|
|
}
|
|
|
|
th.med {
|
|
background: #006600;
|
|
font-weight: bold;
|
|
color: #ffffff;
|
|
}
|
|
|
|
th.eng {
|
|
background: #b27300;
|
|
font-weight: bold;
|
|
color: #ffffff;
|
|
}
|
|
|
|
th.sci {
|
|
background: #a65ba6;
|
|
font-weight: bold;
|
|
color: #ffffff;
|
|
}
|
|
|
|
th.civ {
|
|
background: #a32800;
|
|
font-weight: bold;
|
|
color: #ffffff;
|
|
}
|
|
|
|
th.misc {
|
|
background: #666666;
|
|
font-weight: bold;
|
|
color: #ffffff;
|
|
}
|
|
|
|
/* Damage colors for crew monitoring computer */
|
|
|
|
.burn {
|
|
color: orange;
|
|
}
|
|
|
|
.brute {
|
|
color: red;
|
|
}
|
|
|
|
.toxin {
|
|
color: green;
|
|
}
|
|
|
|
.oxyloss {
|
|
color: blue;
|
|
}
|
|
|
|
/* 75px width used in power monitoring console buttons */
|
|
.width75btn {
|
|
width: 75px;
|
|
} |