mirror of
https://github.com/ParadiseSS13/Paradise.git
synced 2026-07-17 18:13:34 +01:00
NanoUI Improvements Part 2: SEE ESS ESS
This commit is contained in:
Tigercat2000
@@ -164,9 +164,9 @@
|
||||
|
||||
var/datum/browser/popup = new(user, "traffic_control", "Telecommunication Traffic Control", 700, 500)
|
||||
//codemirror
|
||||
popup.add_script("codemirror-compressed", 'nano/js/codemirror-compressed.js') // A custom compressed JS file of codemirror, with CSS highlighting
|
||||
popup.add_stylesheet("codemirror", 'nano/css/codemirror.css') // this CSS sheet is common to all UIs, so all UIs can use codemirror
|
||||
popup.add_stylesheet("lesser-dark", 'nano/css/lesser-dark.css') //CSS styling for codemirror, dark theme
|
||||
popup.add_script("codemirror-compressed", 'nano/codemirror/codemirror-compressed.js') // A custom minified JavaScript file of CodeMirror, with the following plugins: CSS Mode, NTSL Mode, CSS-hint addon, Search addon, Sublime Keymap.
|
||||
popup.add_stylesheet("codemirror", 'nano/codemirror/codemirror.css') // A CSS sheet containing the basic stylings and formatting information for CodeMirror.
|
||||
popup.add_stylesheet("lesser-dark", 'nano/codemirror/lesser-dark.css') // A theme for CodeMirror to use, which closely resembles the rest of the NanoUI style.
|
||||
|
||||
popup.set_content(dat)
|
||||
popup.open()
|
||||
|
||||
@@ -187,21 +187,21 @@ proc/getFilesSlow(var/client/client, var/list/files, var/register_asset = TRUE)
|
||||
//DEFINITIONS FOR ASSET DATUMS START HERE.
|
||||
/datum/asset/simple/paper
|
||||
assets = list(
|
||||
"large_stamp-clown.png" = 'icons/paper_icons/large_stamp-clown.png',
|
||||
"large_stamp-deny.png" = 'icons/paper_icons/large_stamp-deny.png',
|
||||
"large_stamp-ok.png" = 'icons/paper_icons/large_stamp-ok.png',
|
||||
"large_stamp-hop.png" = 'icons/paper_icons/large_stamp-hop.png',
|
||||
"large_stamp-cmo.png" = 'icons/paper_icons/large_stamp-cmo.png',
|
||||
"large_stamp-ce.png" = 'icons/paper_icons/large_stamp-ce.png',
|
||||
"large_stamp-hos.png" = 'icons/paper_icons/large_stamp-hos.png',
|
||||
"large_stamp-rd.png" = 'icons/paper_icons/large_stamp-rd.png',
|
||||
"large_stamp-cap.png" = 'icons/paper_icons/large_stamp-cap.png',
|
||||
"large_stamp-qm.png" = 'icons/paper_icons/large_stamp-qm.png',
|
||||
"large_stamp-law.png" = 'icons/paper_icons/large_stamp-law.png',
|
||||
"large_stamp-cent.png" = 'icons/paper_icons/large_stamp-cent.png',
|
||||
"large_stamp-clown.png" = 'icons/paper_icons/large_stamp-clown.png',
|
||||
"large_stamp-deny.png" = 'icons/paper_icons/large_stamp-deny.png',
|
||||
"large_stamp-ok.png" = 'icons/paper_icons/large_stamp-ok.png',
|
||||
"large_stamp-hop.png" = 'icons/paper_icons/large_stamp-hop.png',
|
||||
"large_stamp-cmo.png" = 'icons/paper_icons/large_stamp-cmo.png',
|
||||
"large_stamp-ce.png" = 'icons/paper_icons/large_stamp-ce.png',
|
||||
"large_stamp-hos.png" = 'icons/paper_icons/large_stamp-hos.png',
|
||||
"large_stamp-rd.png" = 'icons/paper_icons/large_stamp-rd.png',
|
||||
"large_stamp-cap.png" = 'icons/paper_icons/large_stamp-cap.png',
|
||||
"large_stamp-qm.png" = 'icons/paper_icons/large_stamp-qm.png',
|
||||
"large_stamp-law.png" = 'icons/paper_icons/large_stamp-law.png',
|
||||
"large_stamp-cent.png" = 'icons/paper_icons/large_stamp-cent.png',
|
||||
"large_stamp-syndicate.png" = 'icons/paper_icons/large_stamp-syndicate.png',
|
||||
"talisman.png" = 'icons/paper_icons/talisman.png',
|
||||
"ntlogo.png" = 'icons/paper_icons/ntlogo.png'
|
||||
"talisman.png" = 'icons/paper_icons/talisman.png',
|
||||
"ntlogo.png" = 'icons/paper_icons/ntlogo.png'
|
||||
)
|
||||
|
||||
/datum/asset/nanoui
|
||||
@@ -209,8 +209,7 @@ proc/getFilesSlow(var/client/client, var/list/files, var/register_asset = TRUE)
|
||||
|
||||
var/list/common_dirs = list(
|
||||
"nano/assets/",
|
||||
"nano/css/",
|
||||
"nano/js/",
|
||||
"nano/codemirror/",
|
||||
"nano/images/",
|
||||
"nano/layouts/"
|
||||
)
|
||||
|
||||
@@ -106,14 +106,13 @@ nanoui is used to open and update nano browser uis
|
||||
*/
|
||||
/datum/nanoui/proc/add_common_assets()
|
||||
add_script("libraries.min.js") // A JS file comprising of jQuery, doT.js and jQuery Timer libraries (compressed together)
|
||||
add_script("nano.js") // A JS file of the NanoUI JavaScript concatenated into one file.
|
||||
add_stylesheet("shared.css") // this CSS sheet is common to all UIs
|
||||
add_stylesheet("icons.css") // this CSS sheet is common to all UIs
|
||||
add_script("nano.js") // A JS file of the NanoUI JavaScript compressed into one file.
|
||||
add_stylesheet("nanoui.css") // Concatenated CSS sheet common to all UIs, contains all of the standard NanoUI styling.
|
||||
|
||||
//codemirror
|
||||
add_script("codemirror-compressed.js") // A custom compressed JS file of codemirror, with CSS highlighting
|
||||
add_stylesheet("codemirror.css") // this CSS sheet is common to all UIs, so all UIs can use codemirror
|
||||
add_stylesheet("cm_lesser-dark.css") //CSS styling for codemirror, dark theme
|
||||
// CodeMirror
|
||||
add_script("codemirror-compressed.js") // A custom minified JavaScript file of CodeMirror, with the following plugins: CSS Mode, NTSL Mode, CSS-hint addon, Search addon, Sublime Keymap.
|
||||
add_stylesheet("codemirror.css") // A CSS sheet containing the basic stylings and formatting information for CodeMirror.
|
||||
add_stylesheet("cm_lesser-dark.css") // A theme for CodeMirror to use, which closely resembles the rest of the NanoUI style.
|
||||
|
||||
/**
|
||||
* Set the current status (also known as visibility) of this ui.
|
||||
|
||||
+25
-2
@@ -8,12 +8,14 @@ input =
|
||||
scripts:
|
||||
lib: "scripts/libraries"
|
||||
main: "scripts/nano"
|
||||
styles: "styles"
|
||||
|
||||
output =
|
||||
dir: "assets"
|
||||
scripts:
|
||||
lib: "libraries.min.js"
|
||||
main: "nano.js"
|
||||
css: "nanoui.css"
|
||||
|
||||
### Pacakages ###
|
||||
del = require "del"
|
||||
@@ -22,6 +24,13 @@ merge = require "merge-stream"
|
||||
|
||||
### Plugins ###
|
||||
g = require("gulp-load-plugins")({replaceString: /^gulp(-|\.)|-/g})
|
||||
p =
|
||||
autoprefixer: require "autoprefixer"
|
||||
gradient: require "postcss-filter-gradient"
|
||||
opacity: require "postcss-opacity"
|
||||
rgba: require "postcss-color-rgba-fallback"
|
||||
plsfilters: require "pleeease-filters"
|
||||
|
||||
|
||||
### Helpers ###
|
||||
|
||||
@@ -29,7 +38,7 @@ glob = (path) ->
|
||||
"#{path}/*"
|
||||
|
||||
### Tasks ###
|
||||
gulp.task "default", ["scripts"]
|
||||
gulp.task "default", ["scripts", "styles"]
|
||||
|
||||
gulp.task "clean", ->
|
||||
del glob output.dir
|
||||
@@ -45,4 +54,18 @@ gulp.task "scripts", ["clean"], ->
|
||||
.pipe g.if(s.min, g.uglify().on('error', util.log))
|
||||
.pipe gulp.dest output.dir
|
||||
|
||||
merge lib, main
|
||||
merge lib, main
|
||||
|
||||
gulp.task "styles", ["clean"], ->
|
||||
gulp.src glob input.styles
|
||||
.pipe g.filter(["*.less", "!_*.less"])
|
||||
.pipe g.less()
|
||||
.pipe g.postcss([
|
||||
p.autoprefixer({browsers: ["last 2 versions", "ie >= 8"]}),
|
||||
p.gradient,
|
||||
p.opacity,
|
||||
p.rgba({oldie: true}),
|
||||
p.plsfilters({oldIE: true})
|
||||
])
|
||||
.pipe g.concat(output.css)
|
||||
.pipe gulp.dest output.dir
|
||||
+14
-8
@@ -15,18 +15,14 @@ The assets folder is used by the Gulp compiling system, and stores the minified
|
||||
the NanoUI JavaScript Library and prerequisites. Everything within this folder is sent to
|
||||
the client as-is.
|
||||
|
||||
### /css
|
||||
This folder is used for the CSS components of NanoUI. Everything within this folder is
|
||||
sent to the client as-is.
|
||||
### /codemirror
|
||||
This folder contains all of the JavaScript and CSS for CodeMirror. It is sent to the
|
||||
client as-is. CodeMirror only has it's own folder due to the fact that it can't be
|
||||
directly compiled into the NanoUI files.
|
||||
|
||||
### /images
|
||||
This folder is used to store any image files. It is sent to the client as-is.
|
||||
|
||||
### /js
|
||||
This folder is for JavaScript which cannot be compiled and put in the assets folder.
|
||||
Currently, it is only used by the pre-minifed CodeMirror JavaScript. It is sent to the
|
||||
client as-is.
|
||||
|
||||
### /layouts
|
||||
This folder is used for the central "layout" template files, which is loaded before the
|
||||
UI's actual template file. It is sent to the client as-is.
|
||||
@@ -44,6 +40,16 @@ it contains jQuery, jQuery UI, jQuery timers, and the doT template system.
|
||||
#### /scripts/nano
|
||||
This folder contains the primary JavaScript for NanoUI.
|
||||
|
||||
### /styles
|
||||
This folder is used for NanoUI's LESS styles. These are compiled via gulp into the file
|
||||
`nanoui.css`. LESS is a system that expands upon CSS in order to make it better, as well
|
||||
as less complicated.
|
||||
|
||||
Any LESS file that is prefixed with the `_` character will be ignored during compilation.
|
||||
These files are still included, however, via `@import`, view the file
|
||||
[`nanoui.less`](http://github.com/ParadiseSS13/Paradise/blob/master/nano/styles/nanoui.less) to see how this works.
|
||||
|
||||
|
||||
### /templates
|
||||
This folder is used to store the .tmpl files which are later compiled by the NanoUtility
|
||||
JavaScript, using a modified version of the doT template engine. It is sent to the client
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,326 +0,0 @@
|
||||
/* Icons
|
||||
----------------------------------*/
|
||||
|
||||
.icon24
|
||||
{
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.icon24.uiStatusGood
|
||||
{
|
||||
background: url(uiIcons24.png) 0 0 no-repeat;
|
||||
}
|
||||
|
||||
.icon24.uiStatusAverage
|
||||
{
|
||||
background: url(uiIcons24.png) 0 -24px no-repeat;
|
||||
}
|
||||
|
||||
.icon24.uiStatusBad
|
||||
{
|
||||
background: url(uiIcons24.png) 0 -48px no-repeat;
|
||||
}
|
||||
|
||||
/* states and images */
|
||||
.uiIcon16 {
|
||||
float: left;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin: 2px 2px 0 2px;
|
||||
background-image: url(uiIcons16.png);
|
||||
}
|
||||
|
||||
.uiLinkPendingIcon {
|
||||
display: none;
|
||||
float: left;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin: 2px 2px 0 2px;
|
||||
background-image: url(uiLinkPendingIcon.gif);
|
||||
}
|
||||
|
||||
.linkPending .uiIcon16 {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.linkPending .uiLinkPendingIcon {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* positioning */
|
||||
.uiIcon16.icon-blank { background-position: 16px 16px; }
|
||||
.uiIcon16.icon-carat-1-n { background-position: 0 0; }
|
||||
.uiIcon16.icon-carat-1-ne { background-position: -16px 0; }
|
||||
.uiIcon16.icon-carat-1-e { background-position: -32px 0; }
|
||||
.uiIcon16.icon-carat-1-se { background-position: -48px 0; }
|
||||
.uiIcon16.icon-carat-1-s { background-position: -64px 0; }
|
||||
.uiIcon16.icon-carat-1-sw { background-position: -80px 0; }
|
||||
.uiIcon16.icon-carat-1-w { background-position: -96px 0; }
|
||||
.uiIcon16.icon-carat-1-nw { background-position: -112px 0; }
|
||||
.uiIcon16.icon-carat-2-n-s { background-position: -128px 0; }
|
||||
.uiIcon16.icon-carat-2-e-w { background-position: -144px 0; }
|
||||
.uiIcon16.icon-triangle-1-n { background-position: 0 -16px; }
|
||||
.uiIcon16.icon-triangle-1-ne { background-position: -16px -16px; }
|
||||
.uiIcon16.icon-triangle-1-e { background-position: -32px -16px; }
|
||||
.uiIcon16.icon-triangle-1-se { background-position: -48px -16px; }
|
||||
.uiIcon16.icon-triangle-1-s { background-position: -64px -16px; }
|
||||
.uiIcon16.icon-triangle-1-sw { background-position: -80px -16px; }
|
||||
.uiIcon16.icon-triangle-1-w { background-position: -96px -16px; }
|
||||
.uiIcon16.icon-triangle-1-nw { background-position: -112px -16px; }
|
||||
.uiIcon16.icon-triangle-2-n-s { background-position: -128px -16px; }
|
||||
.uiIcon16.icon-triangle-2-e-w { background-position: -144px -16px; }
|
||||
.uiIcon16.icon-arrow-1-n { background-position: 0 -32px; }
|
||||
.uiIcon16.icon-arrow-1-ne { background-position: -16px -32px; }
|
||||
.uiIcon16.icon-arrow-1-e { background-position: -32px -32px; }
|
||||
.uiIcon16.icon-arrow-1-se { background-position: -48px -32px; }
|
||||
.uiIcon16.icon-arrow-1-s { background-position: -64px -32px; }
|
||||
.uiIcon16.icon-arrow-1-sw { background-position: -80px -32px; }
|
||||
.uiIcon16.icon-arrow-1-w { background-position: -96px -32px; }
|
||||
.uiIcon16.icon-arrow-1-nw { background-position: -112px -32px; }
|
||||
.uiIcon16.icon-arrow-2-n-s { background-position: -128px -32px; }
|
||||
.uiIcon16.icon-arrow-2-ne-sw { background-position: -144px -32px; }
|
||||
.uiIcon16.icon-arrow-2-e-w { background-position: -160px -32px; }
|
||||
.uiIcon16.icon-arrow-2-se-nw { background-position: -176px -32px; }
|
||||
.uiIcon16.icon-arrowstop-1-n { background-position: -192px -32px; }
|
||||
.uiIcon16.icon-arrowstop-1-e { background-position: -208px -32px; }
|
||||
.uiIcon16.icon-arrowstop-1-s { background-position: -224px -32px; }
|
||||
.uiIcon16.icon-arrowstop-1-w { background-position: -240px -32px; }
|
||||
.uiIcon16.icon-arrowthick-1-n { background-position: 0 -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-ne { background-position: -16px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-e { background-position: -32px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-se { background-position: -48px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-s { background-position: -64px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-sw { background-position: -80px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-w { background-position: -96px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-nw { background-position: -112px -48px; }
|
||||
.uiIcon16.icon-arrowthick-2-n-s { background-position: -128px -48px; }
|
||||
.uiIcon16.icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
|
||||
.uiIcon16.icon-arrowthick-2-e-w { background-position: -160px -48px; }
|
||||
.uiIcon16.icon-arrowthick-2-se-nw { background-position: -176px -48px; }
|
||||
.uiIcon16.icon-arrowthickstop-1-n { background-position: -192px -48px; }
|
||||
.uiIcon16.icon-arrowthickstop-1-e { background-position: -208px -48px; }
|
||||
.uiIcon16.icon-arrowthickstop-1-s { background-position: -224px -48px; }
|
||||
.uiIcon16.icon-arrowthickstop-1-w { background-position: -240px -48px; }
|
||||
.uiIcon16.icon-arrowreturnthick-1-w { background-position: 0 -64px; }
|
||||
.uiIcon16.icon-arrowreturnthick-1-n { background-position: -16px -64px; }
|
||||
.uiIcon16.icon-arrowreturnthick-1-e { background-position: -32px -64px; }
|
||||
.uiIcon16.icon-arrowreturnthick-1-s { background-position: -48px -64px; }
|
||||
.uiIcon16.icon-arrowreturn-1-w { background-position: -64px -64px; }
|
||||
.uiIcon16.icon-arrowreturn-1-n { background-position: -80px -64px; }
|
||||
.uiIcon16.icon-arrowreturn-1-e { background-position: -96px -64px; }
|
||||
.uiIcon16.icon-arrowreturn-1-s { background-position: -112px -64px; }
|
||||
.uiIcon16.icon-arrowrefresh-1-w { background-position: -128px -64px; }
|
||||
.uiIcon16.icon-arrowrefresh-1-n { background-position: -144px -64px; }
|
||||
.uiIcon16.icon-arrowrefresh-1-e { background-position: -160px -64px; }
|
||||
.uiIcon16.icon-arrowrefresh-1-s { background-position: -176px -64px; }
|
||||
.uiIcon16.icon-arrow-4 { background-position: 0 -80px; }
|
||||
.uiIcon16.icon-arrow-4-diag { background-position: -16px -80px; }
|
||||
.uiIcon16.icon-extlink { background-position: -32px -80px; }
|
||||
.uiIcon16.icon-newwin { background-position: -48px -80px; }
|
||||
.uiIcon16.icon-refresh { background-position: -64px -80px; }
|
||||
.uiIcon16.icon-shuffle { background-position: -80px -80px; }
|
||||
.uiIcon16.icon-transfer-e-w { background-position: -96px -80px; }
|
||||
.uiIcon16.icon-transferthick-e-w { background-position: -112px -80px; }
|
||||
.uiIcon16.icon-radiation { background-position: -128px -80px; }
|
||||
.uiIcon16.icon-folder-collapsed { background-position: 0 -96px; }
|
||||
.uiIcon16.icon-folder-open { background-position: -16px -96px; }
|
||||
.uiIcon16.icon-document { background-position: -32px -96px; }
|
||||
.uiIcon16.icon-document-b { background-position: -48px -96px; }
|
||||
.uiIcon16.icon-note { background-position: -64px -96px; }
|
||||
.uiIcon16.icon-mail-closed { background-position: -80px -96px; }
|
||||
.uiIcon16.icon-mail-open { background-position: -96px -96px; }
|
||||
.uiIcon16.icon-suitcase { background-position: -112px -96px; }
|
||||
.uiIcon16.icon-comment { background-position: -128px -96px; }
|
||||
.uiIcon16.icon-person { background-position: -144px -96px; }
|
||||
.uiIcon16.icon-print { background-position: -160px -96px; }
|
||||
.uiIcon16.icon-trash { background-position: -176px -96px; }
|
||||
.uiIcon16.icon-locked { background-position: -192px -96px; }
|
||||
.uiIcon16.icon-unlocked { background-position: -208px -96px; }
|
||||
.uiIcon16.icon-bookmark { background-position: -224px -96px; }
|
||||
.uiIcon16.icon-tag { background-position: -240px -96px; }
|
||||
.uiIcon16.icon-home { background-position: 0 -112px; }
|
||||
.uiIcon16.icon-flag { background-position: -16px -112px; }
|
||||
.uiIcon16.icon-calendar { background-position: -32px -112px; }
|
||||
.uiIcon16.icon-cart { background-position: -48px -112px; }
|
||||
.uiIcon16.icon-pencil { background-position: -64px -112px; }
|
||||
.uiIcon16.icon-clock { background-position: -80px -112px; }
|
||||
.uiIcon16.icon-disk { background-position: -96px -112px; }
|
||||
.uiIcon16.icon-calculator { background-position: -112px -112px; }
|
||||
.uiIcon16.icon-zoomin { background-position: -128px -112px; }
|
||||
.uiIcon16.icon-zoomout { background-position: -144px -112px; }
|
||||
.uiIcon16.icon-search { background-position: -160px -112px; }
|
||||
.uiIcon16.icon-wrench { background-position: -176px -112px; }
|
||||
.uiIcon16.icon-gear { background-position: -192px -112px; }
|
||||
.uiIcon16.icon-heart { background-position: -208px -112px; }
|
||||
.uiIcon16.icon-star { background-position: -224px -112px; }
|
||||
.uiIcon16.icon-link { background-position: -240px -112px; }
|
||||
.uiIcon16.icon-cancel { background-position: 0 -128px; }
|
||||
.uiIcon16.icon-plus { background-position: -16px -128px; }
|
||||
.uiIcon16.icon-plusthick { background-position: -32px -128px; }
|
||||
.uiIcon16.icon-minus { background-position: -48px -128px; }
|
||||
.uiIcon16.icon-minusthick { background-position: -64px -128px; }
|
||||
.uiIcon16.icon-close { background-position: -80px -128px; }
|
||||
.uiIcon16.icon-closethick { background-position: -96px -128px; }
|
||||
.uiIcon16.icon-key { background-position: -112px -128px; }
|
||||
.uiIcon16.icon-lightbulb { background-position: -128px -128px; }
|
||||
.uiIcon16.icon-scissors { background-position: -144px -128px; }
|
||||
.uiIcon16.icon-clipboard { background-position: -160px -128px; }
|
||||
.uiIcon16.icon-copy { background-position: -176px -128px; }
|
||||
.uiIcon16.icon-contact { background-position: -192px -128px; }
|
||||
.uiIcon16.icon-image { background-position: -208px -128px; }
|
||||
.uiIcon16.icon-video { background-position: -224px -128px; }
|
||||
.uiIcon16.icon-script { background-position: -240px -128px; }
|
||||
.uiIcon16.icon-alert { background-position: 0 -144px; }
|
||||
.uiIcon16.icon-info { background-position: -16px -144px; }
|
||||
.uiIcon16.icon-notice { background-position: -32px -144px; }
|
||||
.uiIcon16.icon-help { background-position: -48px -144px; }
|
||||
.uiIcon16.icon-check { background-position: -64px -144px; }
|
||||
.uiIcon16.icon-bullet { background-position: -80px -144px; }
|
||||
.uiIcon16.icon-radio-on { background-position: -96px -144px; }
|
||||
.uiIcon16.icon-radio-off { background-position: -112px -144px; }
|
||||
.uiIcon16.icon-pin-w { background-position: -128px -144px; }
|
||||
.uiIcon16.icon-pin-s { background-position: -144px -144px; }
|
||||
.uiIcon16.icon-play { background-position: 0 -160px; }
|
||||
.uiIcon16.icon-pause { background-position: -16px -160px; }
|
||||
.uiIcon16.icon-seek-next { background-position: -32px -160px; }
|
||||
.uiIcon16.icon-seek-prev { background-position: -48px -160px; }
|
||||
.uiIcon16.icon-seek-end { background-position: -64px -160px; }
|
||||
.uiIcon16.icon-seek-start { background-position: -80px -160px; }
|
||||
/* uiIcon-seek-first is deprecated, use uiIcon-seek-start instead */
|
||||
.uiIcon16.icon-seek-first { background-position: -80px -160px; }
|
||||
.uiIcon16.icon-stop { background-position: -96px -160px; }
|
||||
.uiIcon16.icon-eject { background-position: -112px -160px; }
|
||||
.uiIcon16.icon-volume-off { background-position: -128px -160px; }
|
||||
.uiIcon16.icon-volume-on { background-position: -144px -160px; }
|
||||
.uiIcon16.icon-power { background-position: 0 -176px; }
|
||||
.uiIcon16.icon-signal-diag { background-position: -16px -176px; }
|
||||
.uiIcon16.icon-signal { background-position: -32px -176px; }
|
||||
.uiIcon16.icon-battery-0 { background-position: -48px -176px; }
|
||||
.uiIcon16.icon-battery-1 { background-position: -64px -176px; }
|
||||
.uiIcon16.icon-battery-2 { background-position: -80px -176px; }
|
||||
.uiIcon16.icon-battery-3 { background-position: -96px -176px; }
|
||||
.uiIcon16.icon-circle-plus { background-position: 0 -192px; }
|
||||
.uiIcon16.icon-circle-minus { background-position: -16px -192px; }
|
||||
.uiIcon16.icon-circle-close { background-position: -32px -192px; }
|
||||
.uiIcon16.icon-circle-triangle-e { background-position: -48px -192px; }
|
||||
.uiIcon16.icon-circle-triangle-s { background-position: -64px -192px; }
|
||||
.uiIcon16.icon-circle-triangle-w { background-position: -80px -192px; }
|
||||
.uiIcon16.icon-circle-triangle-n { background-position: -96px -192px; }
|
||||
.uiIcon16.icon-circle-arrow-e { background-position: -112px -192px; }
|
||||
.uiIcon16.icon-circle-arrow-s { background-position: -128px -192px; }
|
||||
.uiIcon16.icon-circle-arrow-w { background-position: -144px -192px; }
|
||||
.uiIcon16.icon-circle-arrow-n { background-position: -160px -192px; }
|
||||
.uiIcon16.icon-circle-zoomin { background-position: -176px -192px; }
|
||||
.uiIcon16.icon-circle-zoomout { background-position: -192px -192px; }
|
||||
.uiIcon16.icon-circle-check { background-position: -208px -192px; }
|
||||
.uiIcon16.icon-circlesmall-plus { background-position: 0 -208px; }
|
||||
.uiIcon16.icon-circlesmall-minus { background-position: -16px -208px; }
|
||||
.uiIcon16.icon-circlesmall-close { background-position: -32px -208px; }
|
||||
.uiIcon16.icon-squaresmall-plus { background-position: -48px -208px; }
|
||||
.uiIcon16.icon-squaresmall-minus { background-position: -64px -208px; }
|
||||
.uiIcon16.icon-squaresmall-close { background-position: -80px -208px; }
|
||||
.uiIcon16.icon-grip-dotted-vertical { background-position: 0 -224px; }
|
||||
.uiIcon16.icon-grip-dotted-horizontal { background-position: -16px -224px; }
|
||||
.uiIcon16.icon-grip-solid-vertical { background-position: -32px -224px; }
|
||||
.uiIcon16.icon-grip-solid-horizontal { background-position: -48px -224px; }
|
||||
.uiIcon16.icon-gripsmall-diagonal-se { background-position: -64px -224px; }
|
||||
.uiIcon16.icon-grip-diagonal-se { background-position: -80px -224px; }
|
||||
|
||||
.mapIcon16 {
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background-image: url(uiIcons16Green.png);
|
||||
background-position: -144px -96px;
|
||||
background-repeat: no-repeat;
|
||||
zoom: 0.125;
|
||||
margin-left: -1px;
|
||||
/*margin-bottom: -1px;*/
|
||||
}
|
||||
.mapIcon16.dead {
|
||||
background-image: url(uiIcons16Red.png);
|
||||
}
|
||||
|
||||
.mapIcon16.bad {
|
||||
background-image: url(uiIcons16Red.png);
|
||||
}
|
||||
|
||||
.mapIcon16.average {
|
||||
background-image: url(uiIcons16Orange.png);
|
||||
}
|
||||
|
||||
.mapIcon16.good {
|
||||
background-image: url(uiIcons16Green.png);
|
||||
}
|
||||
|
||||
/* AirAlarm */
|
||||
.mapIcon16.icon-airalarm { background-position: 0 -144px; }
|
||||
|
||||
/* Command Positions */
|
||||
.mapIcon16.rank-captain {
|
||||
background-position: -224px -112px;
|
||||
}
|
||||
.mapIcon16.rank-headofpersonnel {
|
||||
background-position: -112px -96px;
|
||||
}
|
||||
.mapIcon16.rank-headofsecurity {
|
||||
background-position: -112px -128px;
|
||||
}
|
||||
.mapIcon16.rank-chiefengineer {
|
||||
background-position: -176px -112px;
|
||||
}
|
||||
.mapIcon16.rank-researchdirector {
|
||||
background-position: -128px -128px;
|
||||
}
|
||||
.mapIcon16.rank-chiefmedicalofficer {
|
||||
background-position: -32px -128px;
|
||||
}
|
||||
|
||||
/* Engineering Positions */
|
||||
.mapIcon16.rank-stationengineer {
|
||||
background-position: -176px -112px;
|
||||
}
|
||||
.mapIcon16.rank-atmospherictechnician {
|
||||
background-position: -176px -112px;
|
||||
}
|
||||
|
||||
/* Medical Positions */
|
||||
.mapIcon16.rank-medicaldoctor {
|
||||
background-position: -32px -128px;
|
||||
}
|
||||
.mapIcon16.rank-geneticist {
|
||||
background-position: -32px -128px;
|
||||
}
|
||||
.mapIcon16.rank-psychiatrist {
|
||||
background-position: -32px -128px;
|
||||
}
|
||||
.mapIcon16.rank-chemist {
|
||||
background-position: -32px -128px;
|
||||
}
|
||||
|
||||
/* Science Positions */
|
||||
.mapIcon16.rank-scientist {
|
||||
background-position: -128px -128px;
|
||||
}
|
||||
.mapIcon16.rank-geneticist {
|
||||
background-position: -128px -128px;
|
||||
}
|
||||
.mapIcon16.rank-roboticist {
|
||||
background-position: -128px -128px;
|
||||
}
|
||||
.mapIcon16.rank-xenobiologist {
|
||||
background-position: -128px -128px;
|
||||
}
|
||||
|
||||
/* Security Positions */
|
||||
.mapIcon16.rank-warden {
|
||||
background-position: -112px -128px;
|
||||
}
|
||||
.mapIcon16.rank-detective {
|
||||
background-position: -112px -128px;
|
||||
}
|
||||
.mapIcon16.rank-securityofficer {
|
||||
background-position: -112px -128px;
|
||||
}
|
||||
|
||||
@@ -1,650 +0,0 @@
|
||||
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: #FFFFFF;
|
||||
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;
|
||||
}
|
||||
|
||||
.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;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.itemContentNarrow, .itemContent {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.itemContentNarrow {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.itemContent {
|
||||
width: 69%;
|
||||
}
|
||||
|
||||
.itemLabelNarrow, .itemLabel, .itemLabelWide, .itemLabelWider, .itemLabelWidest {
|
||||
float: left;
|
||||
color: #e9c183;
|
||||
}
|
||||
|
||||
.itemLabelNarrow {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.itemLabel {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.itemLabelWide {
|
||||
width: 45%;
|
||||
}
|
||||
|
||||
.itemLabelWider {
|
||||
width: 69%;
|
||||
}
|
||||
|
||||
.itemLabelWidest {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.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;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.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.notgood {
|
||||
color: #ffffff;
|
||||
background: #ffb400;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.floatRight {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.floatLeft {
|
||||
float: left;
|
||||
}
|
||||
|
||||
/* PDA styling */
|
||||
.wholeScreen {
|
||||
position: absolute;
|
||||
color: #517087;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pdalink {
|
||||
float: left;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.pdanote {
|
||||
color: #cd6500;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* DNA Modifier styling */
|
||||
.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.fixed {
|
||||
table-layout:fixed;
|
||||
}
|
||||
|
||||
table.fixed td {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Table styling for the 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 styling for the crew 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;
|
||||
}
|
||||
|
||||
/* Table styling for Med Scanner */
|
||||
.striped tr:nth-child(even) {
|
||||
background-color: #404040
|
||||
}
|
||||
|
||||
/* Damage colors for crew monitoring computer */
|
||||
.burn {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
.brute {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.toxin {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.toxin_light {
|
||||
color: #3ADF00;
|
||||
}
|
||||
|
||||
.oxyloss {
|
||||
color: blue;
|
||||
}
|
||||
|
||||
.oxyloss_light {
|
||||
color: #6698FF;
|
||||
}
|
||||
|
||||
/* Wire colors for nuclear bomb defusion */
|
||||
.Red {
|
||||
color: #FF0000;
|
||||
}
|
||||
|
||||
.Blue {
|
||||
color: #0000FF;
|
||||
}
|
||||
|
||||
.Green {
|
||||
color: #00FF00;
|
||||
}
|
||||
|
||||
.Marigold {
|
||||
color: #FDA505;
|
||||
}
|
||||
|
||||
.Fuschia {
|
||||
color: #FF0080;
|
||||
}
|
||||
|
||||
.Black {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.Pearl {
|
||||
color: #C6CACB;
|
||||
}
|
||||
|
||||
/* Status bar colors for sleeper temperatures */
|
||||
.cold1 {
|
||||
color: #94B8FF;
|
||||
}
|
||||
|
||||
.cold2 {
|
||||
color: #6699FF;
|
||||
}
|
||||
|
||||
.cold3 {
|
||||
color: #293D66;
|
||||
}
|
||||
|
||||
.hot1 {
|
||||
color: #FF9966;
|
||||
}
|
||||
|
||||
.hot2 {
|
||||
color: #993D00;
|
||||
}
|
||||
|
||||
.hot3 {
|
||||
color: #FF6600;
|
||||
}
|
||||
+9
-1
@@ -2,14 +2,22 @@
|
||||
"name": "nanoui",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"autoprefixer": "^6.2.2",
|
||||
"del": "^2.2.0",
|
||||
"gulp": "^3.9.0",
|
||||
"gulp-concat": "^2.6.0",
|
||||
"gulp-coffee": "^2.3.1",
|
||||
"gulp-filter": "^3.0.1",
|
||||
"gulp-if": "^2.0.0",
|
||||
"gulp-less": "^3.0.5",
|
||||
"gulp-load-plugins": "^1.1.0",
|
||||
"gulp-postcss": "^6.0.1",
|
||||
"gulp-uglify": "^1.5.1",
|
||||
"gulp-util": "^3.0.7",
|
||||
"merge-stream": "^1.0.0"
|
||||
"merge-stream": "^1.0.0",
|
||||
"pleeease-filters": "^2.0.0",
|
||||
"postcss-color-rgba-fallback": "git+https://github.com/postcss/postcss-color-rgba-fallback",
|
||||
"postcss-filter-gradient": "^0.2.1",
|
||||
"postcss-opacity": "^3.0.0"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,57 @@
|
||||
.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.notgood {
|
||||
color: #ffffff;
|
||||
background: #ffb400;
|
||||
}
|
||||
|
||||
.displayBarFill.average {
|
||||
color: #ffffff;
|
||||
background: #cd6500;
|
||||
}
|
||||
|
||||
.displayBarFill.bad {
|
||||
color: #ffffff;
|
||||
background: #ee0000;
|
||||
}
|
||||
|
||||
.displayBarFill.highlight {
|
||||
color: #ffffff;
|
||||
background: #8BA5C4;
|
||||
}
|
||||
@@ -0,0 +1,119 @@
|
||||
.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;
|
||||
}
|
||||
|
||||
/* Damage colors for crew monitoring computer */
|
||||
.burn {
|
||||
color: orange;
|
||||
}
|
||||
|
||||
.brute {
|
||||
color: red;
|
||||
}
|
||||
|
||||
.toxin {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.toxin_light {
|
||||
color: #3ADF00;
|
||||
}
|
||||
|
||||
.oxyloss {
|
||||
color: blue;
|
||||
}
|
||||
|
||||
.oxyloss_light {
|
||||
color: #6698FF;
|
||||
}
|
||||
|
||||
/* Wire colors for nuclear bomb defusion */
|
||||
.Red {
|
||||
color: #FF0000;
|
||||
}
|
||||
|
||||
.Blue {
|
||||
color: #0000FF;
|
||||
}
|
||||
|
||||
.Green {
|
||||
color: #00FF00;
|
||||
}
|
||||
|
||||
.Marigold {
|
||||
color: #FDA505;
|
||||
}
|
||||
|
||||
.Fuschia {
|
||||
color: #FF0080;
|
||||
}
|
||||
|
||||
.Black {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.Pearl {
|
||||
color: #C6CACB;
|
||||
}
|
||||
|
||||
/* Status bar colors for sleeper temperatures */
|
||||
.cold1 {
|
||||
color: #94B8FF;
|
||||
}
|
||||
|
||||
.cold2 {
|
||||
color: #6699FF;
|
||||
}
|
||||
|
||||
.cold3 {
|
||||
color: #293D66;
|
||||
}
|
||||
|
||||
.hot1 {
|
||||
color: #FF9966;
|
||||
}
|
||||
|
||||
.hot2 {
|
||||
color: #993D00;
|
||||
}
|
||||
|
||||
.hot3 {
|
||||
color: #FF6600;
|
||||
}
|
||||
@@ -0,0 +1,157 @@
|
||||
.itemGroup {
|
||||
border: 1px solid #e9c183;
|
||||
background: #2c2c2c;
|
||||
padding: 4px;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
|
||||
.item {
|
||||
width: 100%;
|
||||
margin: 4px 0 0 0;
|
||||
clear: both;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.itemContentNarrow, .itemContent {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.itemContentNarrow {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.itemContent {
|
||||
width: 69%;
|
||||
}
|
||||
|
||||
.itemLabelNarrow, .itemLabel, .itemLabelWide, .itemLabelWider, .itemLabelWidest {
|
||||
float: left;
|
||||
color: #e9c183;
|
||||
}
|
||||
|
||||
.itemLabelNarrow {
|
||||
width: 20%;
|
||||
}
|
||||
|
||||
.itemLabel {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.itemLabelWide {
|
||||
width: 45%;
|
||||
}
|
||||
|
||||
.itemLabelWider {
|
||||
width: 69%;
|
||||
}
|
||||
|
||||
.itemLabelWidest {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.itemContentWide {
|
||||
float: left;
|
||||
width: 79%;
|
||||
}
|
||||
|
||||
.itemContentSmall {
|
||||
float: left;
|
||||
width: 33%;
|
||||
}
|
||||
|
||||
.itemContentMedium {
|
||||
float: left;
|
||||
width: 55%;
|
||||
}
|
||||
|
||||
.block {
|
||||
padding: 8px;
|
||||
margin: 10px 4px 4px 4px;
|
||||
border: 1px solid #40628a;
|
||||
background-color: #202020;
|
||||
}
|
||||
|
||||
.block h3 {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.clearBoth {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.clearLeft {
|
||||
clear: left;
|
||||
}
|
||||
|
||||
.clearRight {
|
||||
clear: right;
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 100%;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.fixedLeft {
|
||||
width: 110px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fixedLeftWide {
|
||||
width: 165px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fixedLeftWider {
|
||||
width: 220px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.fixedLeftWidest {
|
||||
width: 250px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.floatRight {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.floatLeft {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
.statusDisplay {
|
||||
background: #000000;
|
||||
color: #ffffff;
|
||||
border: 1px solid #40628a;
|
||||
padding: 4px;
|
||||
margin: 3px 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
@@ -0,0 +1,270 @@
|
||||
/* Icons
|
||||
----------------------------------*/
|
||||
|
||||
.icon24
|
||||
{
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
|
||||
.icon24.uiStatusGood
|
||||
{
|
||||
background: url(uiIcons24.png) 0 0 no-repeat;
|
||||
}
|
||||
|
||||
.icon24.uiStatusAverage
|
||||
{
|
||||
background: url(uiIcons24.png) 0 -24px no-repeat;
|
||||
}
|
||||
|
||||
.icon24.uiStatusBad
|
||||
{
|
||||
background: url(uiIcons24.png) 0 -48px no-repeat;
|
||||
}
|
||||
|
||||
/* states and images */
|
||||
.uiLinkPendingIcon {
|
||||
display: none;
|
||||
float: left;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin: 2px 2px 0 2px;
|
||||
background-image: url(uiLinkPendingIcon.gif);
|
||||
}
|
||||
|
||||
.linkPending .uiIcon16 {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.linkPending .uiLinkPendingIcon {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.uiIcon16 {
|
||||
float: left;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin: 2px 2px 0 2px;
|
||||
background-image: url(uiIcons16.png);
|
||||
}
|
||||
|
||||
/* positioning */
|
||||
.uiIcon16.icon-blank { background-position: 16px 16px; }
|
||||
.uiIcon16.icon-carat-1-n { background-position: 0 0; }
|
||||
.uiIcon16.icon-carat-1-ne { background-position: -16px 0; }
|
||||
.uiIcon16.icon-carat-1-e { background-position: -32px 0; }
|
||||
.uiIcon16.icon-carat-1-se { background-position: -48px 0; }
|
||||
.uiIcon16.icon-carat-1-s { background-position: -64px 0; }
|
||||
.uiIcon16.icon-carat-1-sw { background-position: -80px 0; }
|
||||
.uiIcon16.icon-carat-1-w { background-position: -96px 0; }
|
||||
.uiIcon16.icon-carat-1-nw { background-position: -112px 0; }
|
||||
.uiIcon16.icon-carat-2-n-s { background-position: -128px 0; }
|
||||
.uiIcon16.icon-carat-2-e-w { background-position: -144px 0; }
|
||||
.uiIcon16.icon-triangle-1-n { background-position: 0 -16px; }
|
||||
.uiIcon16.icon-triangle-1-ne { background-position: -16px -16px; }
|
||||
.uiIcon16.icon-triangle-1-e { background-position: -32px -16px; }
|
||||
.uiIcon16.icon-triangle-1-se { background-position: -48px -16px; }
|
||||
.uiIcon16.icon-triangle-1-s { background-position: -64px -16px; }
|
||||
.uiIcon16.icon-triangle-1-sw { background-position: -80px -16px; }
|
||||
.uiIcon16.icon-triangle-1-w { background-position: -96px -16px; }
|
||||
.uiIcon16.icon-triangle-1-nw { background-position: -112px -16px; }
|
||||
.uiIcon16.icon-triangle-2-n-s { background-position: -128px -16px; }
|
||||
.uiIcon16.icon-triangle-2-e-w { background-position: -144px -16px; }
|
||||
.uiIcon16.icon-arrow-1-n { background-position: 0 -32px; }
|
||||
.uiIcon16.icon-arrow-1-ne { background-position: -16px -32px; }
|
||||
.uiIcon16.icon-arrow-1-e { background-position: -32px -32px; }
|
||||
.uiIcon16.icon-arrow-1-se { background-position: -48px -32px; }
|
||||
.uiIcon16.icon-arrow-1-s { background-position: -64px -32px; }
|
||||
.uiIcon16.icon-arrow-1-sw { background-position: -80px -32px; }
|
||||
.uiIcon16.icon-arrow-1-w { background-position: -96px -32px; }
|
||||
.uiIcon16.icon-arrow-1-nw { background-position: -112px -32px; }
|
||||
.uiIcon16.icon-arrow-2-n-s { background-position: -128px -32px; }
|
||||
.uiIcon16.icon-arrow-2-ne-sw { background-position: -144px -32px; }
|
||||
.uiIcon16.icon-arrow-2-e-w { background-position: -160px -32px; }
|
||||
.uiIcon16.icon-arrow-2-se-nw { background-position: -176px -32px; }
|
||||
.uiIcon16.icon-arrowstop-1-n { background-position: -192px -32px; }
|
||||
.uiIcon16.icon-arrowstop-1-e { background-position: -208px -32px; }
|
||||
.uiIcon16.icon-arrowstop-1-s { background-position: -224px -32px; }
|
||||
.uiIcon16.icon-arrowstop-1-w { background-position: -240px -32px; }
|
||||
.uiIcon16.icon-arrowthick-1-n { background-position: 0 -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-ne { background-position: -16px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-e { background-position: -32px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-se { background-position: -48px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-s { background-position: -64px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-sw { background-position: -80px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-w { background-position: -96px -48px; }
|
||||
.uiIcon16.icon-arrowthick-1-nw { background-position: -112px -48px; }
|
||||
.uiIcon16.icon-arrowthick-2-n-s { background-position: -128px -48px; }
|
||||
.uiIcon16.icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
|
||||
.uiIcon16.icon-arrowthick-2-e-w { background-position: -160px -48px; }
|
||||
.uiIcon16.icon-arrowthick-2-se-nw { background-position: -176px -48px; }
|
||||
.uiIcon16.icon-arrowthickstop-1-n { background-position: -192px -48px; }
|
||||
.uiIcon16.icon-arrowthickstop-1-e { background-position: -208px -48px; }
|
||||
.uiIcon16.icon-arrowthickstop-1-s { background-position: -224px -48px; }
|
||||
.uiIcon16.icon-arrowthickstop-1-w { background-position: -240px -48px; }
|
||||
.uiIcon16.icon-arrowreturnthick-1-w { background-position: 0 -64px; }
|
||||
.uiIcon16.icon-arrowreturnthick-1-n { background-position: -16px -64px; }
|
||||
.uiIcon16.icon-arrowreturnthick-1-e { background-position: -32px -64px; }
|
||||
.uiIcon16.icon-arrowreturnthick-1-s { background-position: -48px -64px; }
|
||||
.uiIcon16.icon-arrowreturn-1-w { background-position: -64px -64px; }
|
||||
.uiIcon16.icon-arrowreturn-1-n { background-position: -80px -64px; }
|
||||
.uiIcon16.icon-arrowreturn-1-e { background-position: -96px -64px; }
|
||||
.uiIcon16.icon-arrowreturn-1-s { background-position: -112px -64px; }
|
||||
.uiIcon16.icon-arrowrefresh-1-w { background-position: -128px -64px; }
|
||||
.uiIcon16.icon-arrowrefresh-1-n { background-position: -144px -64px; }
|
||||
.uiIcon16.icon-arrowrefresh-1-e { background-position: -160px -64px; }
|
||||
.uiIcon16.icon-arrowrefresh-1-s { background-position: -176px -64px; }
|
||||
.uiIcon16.icon-arrow-4 { background-position: 0 -80px; }
|
||||
.uiIcon16.icon-arrow-4-diag { background-position: -16px -80px; }
|
||||
.uiIcon16.icon-extlink { background-position: -32px -80px; }
|
||||
.uiIcon16.icon-newwin { background-position: -48px -80px; }
|
||||
.uiIcon16.icon-refresh { background-position: -64px -80px; }
|
||||
.uiIcon16.icon-shuffle { background-position: -80px -80px; }
|
||||
.uiIcon16.icon-transfer-e-w { background-position: -96px -80px; }
|
||||
.uiIcon16.icon-transferthick-e-w { background-position: -112px -80px; }
|
||||
.uiIcon16.icon-radiation { background-position: -128px -80px; }
|
||||
.uiIcon16.icon-folder-collapsed { background-position: 0 -96px; }
|
||||
.uiIcon16.icon-folder-open { background-position: -16px -96px; }
|
||||
.uiIcon16.icon-document { background-position: -32px -96px; }
|
||||
.uiIcon16.icon-document-b { background-position: -48px -96px; }
|
||||
.uiIcon16.icon-note { background-position: -64px -96px; }
|
||||
.uiIcon16.icon-mail-closed { background-position: -80px -96px; }
|
||||
.uiIcon16.icon-mail-open { background-position: -96px -96px; }
|
||||
.uiIcon16.icon-suitcase { background-position: -112px -96px; }
|
||||
.uiIcon16.icon-comment { background-position: -128px -96px; }
|
||||
.uiIcon16.icon-person { background-position: -144px -96px; }
|
||||
.uiIcon16.icon-print { background-position: -160px -96px; }
|
||||
.uiIcon16.icon-trash { background-position: -176px -96px; }
|
||||
.uiIcon16.icon-locked { background-position: -192px -96px; }
|
||||
.uiIcon16.icon-unlocked { background-position: -208px -96px; }
|
||||
.uiIcon16.icon-bookmark { background-position: -224px -96px; }
|
||||
.uiIcon16.icon-tag { background-position: -240px -96px; }
|
||||
.uiIcon16.icon-home { background-position: 0 -112px; }
|
||||
.uiIcon16.icon-flag { background-position: -16px -112px; }
|
||||
.uiIcon16.icon-calendar { background-position: -32px -112px; }
|
||||
.uiIcon16.icon-cart { background-position: -48px -112px; }
|
||||
.uiIcon16.icon-pencil { background-position: -64px -112px; }
|
||||
.uiIcon16.icon-clock { background-position: -80px -112px; }
|
||||
.uiIcon16.icon-disk { background-position: -96px -112px; }
|
||||
.uiIcon16.icon-calculator { background-position: -112px -112px; }
|
||||
.uiIcon16.icon-zoomin { background-position: -128px -112px; }
|
||||
.uiIcon16.icon-zoomout { background-position: -144px -112px; }
|
||||
.uiIcon16.icon-search { background-position: -160px -112px; }
|
||||
.uiIcon16.icon-wrench { background-position: -176px -112px; }
|
||||
.uiIcon16.icon-gear { background-position: -192px -112px; }
|
||||
.uiIcon16.icon-heart { background-position: -208px -112px; }
|
||||
.uiIcon16.icon-star { background-position: -224px -112px; }
|
||||
.uiIcon16.icon-link { background-position: -240px -112px; }
|
||||
.uiIcon16.icon-cancel { background-position: 0 -128px; }
|
||||
.uiIcon16.icon-plus { background-position: -16px -128px; }
|
||||
.uiIcon16.icon-plusthick { background-position: -32px -128px; }
|
||||
.uiIcon16.icon-minus { background-position: -48px -128px; }
|
||||
.uiIcon16.icon-minusthick { background-position: -64px -128px; }
|
||||
.uiIcon16.icon-close { background-position: -80px -128px; }
|
||||
.uiIcon16.icon-closethick { background-position: -96px -128px; }
|
||||
.uiIcon16.icon-key { background-position: -112px -128px; }
|
||||
.uiIcon16.icon-lightbulb { background-position: -128px -128px; }
|
||||
.uiIcon16.icon-scissors { background-position: -144px -128px; }
|
||||
.uiIcon16.icon-clipboard { background-position: -160px -128px; }
|
||||
.uiIcon16.icon-copy { background-position: -176px -128px; }
|
||||
.uiIcon16.icon-contact { background-position: -192px -128px; }
|
||||
.uiIcon16.icon-image { background-position: -208px -128px; }
|
||||
.uiIcon16.icon-video { background-position: -224px -128px; }
|
||||
.uiIcon16.icon-script { background-position: -240px -128px; }
|
||||
.uiIcon16.icon-alert { background-position: 0 -144px; }
|
||||
.uiIcon16.icon-info { background-position: -16px -144px; }
|
||||
.uiIcon16.icon-notice { background-position: -32px -144px; }
|
||||
.uiIcon16.icon-help { background-position: -48px -144px; }
|
||||
.uiIcon16.icon-check { background-position: -64px -144px; }
|
||||
.uiIcon16.icon-bullet { background-position: -80px -144px; }
|
||||
.uiIcon16.icon-radio-on { background-position: -96px -144px; }
|
||||
.uiIcon16.icon-radio-off { background-position: -112px -144px; }
|
||||
.uiIcon16.icon-pin-w { background-position: -128px -144px; }
|
||||
.uiIcon16.icon-pin-s { background-position: -144px -144px; }
|
||||
.uiIcon16.icon-play { background-position: 0 -160px; }
|
||||
.uiIcon16.icon-pause { background-position: -16px -160px; }
|
||||
.uiIcon16.icon-seek-next { background-position: -32px -160px; }
|
||||
.uiIcon16.icon-seek-prev { background-position: -48px -160px; }
|
||||
.uiIcon16.icon-seek-end { background-position: -64px -160px; }
|
||||
.uiIcon16.icon-seek-start { background-position: -80px -160px; }
|
||||
/* uiIcon-seek-first is deprecated, use uiIcon-seek-start instead */
|
||||
.uiIcon16.icon-seek-first { background-position: -80px -160px; }
|
||||
.uiIcon16.icon-stop { background-position: -96px -160px; }
|
||||
.uiIcon16.icon-eject { background-position: -112px -160px; }
|
||||
.uiIcon16.icon-volume-off { background-position: -128px -160px; }
|
||||
.uiIcon16.icon-volume-on { background-position: -144px -160px; }
|
||||
.uiIcon16.icon-power { background-position: 0 -176px; }
|
||||
.uiIcon16.icon-signal-diag { background-position: -16px -176px; }
|
||||
.uiIcon16.icon-signal { background-position: -32px -176px; }
|
||||
.uiIcon16.icon-battery-0 { background-position: -48px -176px; }
|
||||
.uiIcon16.icon-battery-1 { background-position: -64px -176px; }
|
||||
.uiIcon16.icon-battery-2 { background-position: -80px -176px; }
|
||||
.uiIcon16.icon-battery-3 { background-position: -96px -176px; }
|
||||
.uiIcon16.icon-circle-plus { background-position: 0 -192px; }
|
||||
.uiIcon16.icon-circle-minus { background-position: -16px -192px; }
|
||||
.uiIcon16.icon-circle-close { background-position: -32px -192px; }
|
||||
.uiIcon16.icon-circle-triangle-e { background-position: -48px -192px; }
|
||||
.uiIcon16.icon-circle-triangle-s { background-position: -64px -192px; }
|
||||
.uiIcon16.icon-circle-triangle-w { background-position: -80px -192px; }
|
||||
.uiIcon16.icon-circle-triangle-n { background-position: -96px -192px; }
|
||||
.uiIcon16.icon-circle-arrow-e { background-position: -112px -192px; }
|
||||
.uiIcon16.icon-circle-arrow-s { background-position: -128px -192px; }
|
||||
.uiIcon16.icon-circle-arrow-w { background-position: -144px -192px; }
|
||||
.uiIcon16.icon-circle-arrow-n { background-position: -160px -192px; }
|
||||
.uiIcon16.icon-circle-zoomin { background-position: -176px -192px; }
|
||||
.uiIcon16.icon-circle-zoomout { background-position: -192px -192px; }
|
||||
.uiIcon16.icon-circle-check { background-position: -208px -192px; }
|
||||
.uiIcon16.icon-circlesmall-plus { background-position: 0 -208px; }
|
||||
.uiIcon16.icon-circlesmall-minus { background-position: -16px -208px; }
|
||||
.uiIcon16.icon-circlesmall-close { background-position: -32px -208px; }
|
||||
.uiIcon16.icon-squaresmall-plus { background-position: -48px -208px; }
|
||||
.uiIcon16.icon-squaresmall-minus { background-position: -64px -208px; }
|
||||
.uiIcon16.icon-squaresmall-close { background-position: -80px -208px; }
|
||||
.uiIcon16.icon-grip-dotted-vertical { background-position: 0 -224px; }
|
||||
.uiIcon16.icon-grip-dotted-horizontal { background-position: -16px -224px; }
|
||||
.uiIcon16.icon-grip-solid-vertical { background-position: -32px -224px; }
|
||||
.uiIcon16.icon-grip-solid-horizontal { background-position: -48px -224px; }
|
||||
.uiIcon16.icon-gripsmall-diagonal-se { background-position: -64px -224px; }
|
||||
.uiIcon16.icon-grip-diagonal-se { background-position: -80px -224px; }
|
||||
|
||||
.mapIcon16 {
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
background-image: url(uiIcons16Green.png);
|
||||
background-position: -144px -96px;
|
||||
background-repeat: no-repeat;
|
||||
zoom: 0.125;
|
||||
margin-left: -1px;
|
||||
/*margin-bottom: -1px;*/
|
||||
}
|
||||
.mapIcon16.dead { background-image: url(uiIcons16Red.png); }
|
||||
.mapIcon16.bad { background-image: url(uiIcons16Red.png); }
|
||||
.mapIcon16.average { background-image: url(uiIcons16Orange.png); }
|
||||
.mapIcon16.good { background-image: url(uiIcons16Green.png); }
|
||||
/* AirAlarm */
|
||||
.mapIcon16.icon-airalarm { background-position: 0 -144px; }
|
||||
/* Command Positions */
|
||||
.mapIcon16.rank-captain { background-position: -224px -112px; }
|
||||
.mapIcon16.rank-headofpersonnel { background-position: -112px -96px; }
|
||||
.mapIcon16.rank-headofsecurity { background-position: -112px -128px; }
|
||||
.mapIcon16.rank-chiefengineer { background-position: -176px -112px; }
|
||||
.mapIcon16.rank-researchdirector { background-position: -128px -128px; }
|
||||
.mapIcon16.rank-chiefmedicalofficer { background-position: -32px -128px; }
|
||||
/* Engineering Positions */
|
||||
.mapIcon16.rank-stationengineer { background-position: -176px -112px; }
|
||||
.mapIcon16.rank-atmospherictechnician { background-position: -176px -112px; }
|
||||
/* Medical Positions */
|
||||
.mapIcon16.rank-medicaldoctor {background-position: -32px -128px; }
|
||||
.mapIcon16.rank-geneticist {background-position: -32px -128px; }
|
||||
.mapIcon16.rank-psychiatrist {background-position: -32px -128px; }
|
||||
.mapIcon16.rank-chemist { background-position: -32px -128px; }
|
||||
/* Science Positions */
|
||||
.mapIcon16.rank-scientist { background-position: -128px -128px; }
|
||||
.mapIcon16.rank-geneticist { background-position: -128px -128px; }
|
||||
.mapIcon16.rank-roboticist { background-position: -128px -128px; }
|
||||
.mapIcon16.rank-xenobiologist { background-position: -128px -128px; }
|
||||
/* Security Positions */
|
||||
.mapIcon16.rank-warden { background-position: -112px -128px; }
|
||||
.mapIcon16.rank-detective { background-position: -112px -128px; }
|
||||
.mapIcon16.rank-securityofficer { background-position: -112px -128px; }
|
||||
@@ -0,0 +1,82 @@
|
||||
.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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.inactive, a.inactive:link, a.inactive:visited, a.inactive:active, a.inactive:hover {
|
||||
color: #ffffff;
|
||||
background: #999999;
|
||||
border-color: #666666;
|
||||
}
|
||||
@@ -0,0 +1,75 @@
|
||||
ul {
|
||||
padding: 4px 0 0 10px;
|
||||
margin: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
li {
|
||||
padding: 0 0 2px 0;
|
||||
}
|
||||
|
||||
table.fixed {
|
||||
table-layout:fixed;
|
||||
}
|
||||
|
||||
table.fixed td {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Table styling for the 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 styling for the crew 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;
|
||||
}
|
||||
|
||||
/* Table styling for Med Scanner */
|
||||
.striped tr:nth-child(even) {
|
||||
background-color: #404040
|
||||
}
|
||||
@@ -0,0 +1,127 @@
|
||||
#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;
|
||||
}
|
||||
|
||||
/**********************************
|
||||
.notice | Caution Stripes
|
||||
**********************************/
|
||||
.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;
|
||||
}
|
||||
|
||||
.noticePlaceholder {
|
||||
position: relative;
|
||||
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;
|
||||
}
|
||||
/********************\
|
||||
\********************/
|
||||
|
||||
|
||||
/**********************************
|
||||
PDA, DNA Modifier styles
|
||||
Don't fit anywhere else.
|
||||
**********************************/
|
||||
|
||||
/* PDA styling */
|
||||
.wholeScreen {
|
||||
position: absolute;
|
||||
color: #517087;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pdalink {
|
||||
float: left;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.pdanote {
|
||||
color: #cd6500;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* DNA Modifier styling */
|
||||
.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;
|
||||
}
|
||||
/********************\
|
||||
\********************/
|
||||
@@ -0,0 +1,41 @@
|
||||
body {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
color: #ffffff;
|
||||
line-height: 170%;
|
||||
font-family: Verdana, Geneva, sans-serif;
|
||||
background: #272727;
|
||||
}
|
||||
|
||||
hr {
|
||||
background-color: #40628a;
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
img, a img {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin: 0;
|
||||
padding: 12px 0 6px 0;
|
||||
color: #FFFFFF;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: 12px;
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
@charset "utf-8";
|
||||
|
||||
@import "_native";
|
||||
@import "_icon";
|
||||
@import "_lists";
|
||||
@import "_formatting";
|
||||
@import "_link";
|
||||
@import "_color";
|
||||
@import "_bars";
|
||||
@import "_misc";
|
||||
Reference in New Issue
Block a user