<?php header('Content-Type: text/css'); ?>
@CHARSET "UTF-8";
/*
* <title>CSS for PointedEars' LCARS, version 2.054, stardate 200712.02</title>
*/
/* basic fonts */
@font-face {
font-family: "Downloadable LCARS";
font-style: normal;
font-weight: normal;
src: url(fonts/LCARS.ttf);
}
/* EOT font created with WEFT on 2002-03-23 */
@font-face {
font-family: "Downloadable Haettenschweiler";
font-style: normal;
font-weight: normal;
src: url(fonts/HAETTEN0.eot), url(fonts/HAETTENS.ttf);
}
/*
@font-face {
font-family:Webdings;
font-style:normal;
font-weight:normal;
src:url(WEBDING0.eot);
}
*/
@font-face {
font-family: "Downloadable Zurich XCn BT";
font-style: normal;
font-weight: normal;
src: url(fonts/ZurichXCn.pfr);
}
/* basic display */
* {
font-family: LCARS, "Downloadable LCARS", Haettenschweiler,
"Downloadable Haettenschweiler", "Zurich XCn BT",
"Downloadable Zurich XCn BT", impact, Verdana, Geneva, Arial,
Helvetica, sans-serif;
font-weight: normal;
}
<?php
$colors = array(
'primary' => array(
'elbo' => '#f1df6f',
'offline1' => '#300',
'offline2' => '#f00',
'n/a' => '#39f',
'primary' => '#9cf',
'color1' => '#ff3',
'color2' => '#ffc'
),
'secondary' => array(
'elbo' => '#b19f7a',
'offline1' => '#300',
'offline2' => '#f00',
'n/a' => '#5355de',
'primary' => '#9cf',
'color1' => '#fc0',
'color2' => '#ff9'
),
'ancillary' => array(
'elbo' => '#f1b1af',
'offline1' => '#300',
'offline2' => '#f00',
'n/a' => '#a27fa5',
'primary' => '#adacd8',
'color1' => '#ff3',
'color2' => '#e6b0d4'
),
'database' => array(
'elbo' => '#c66',
'offline1' => '#300',
'offline2' => '#f00',
'n/a' => '#ccf',
'primary' => '#9cf',
'color1' => '#f90',
'text' => '#99f',
'old_text' => '#669',
'new_text' => '#9cf',
'link' => '#fc9',
'visited' => '#c9c',
'hover' => '#f90',
'active' => '#fff'
),
'red_alert' => array(
'elbo' => '#f00',
'offline1' => '#300',
'offline2' => '#f00',
'n/a' => '#f00',
'primary' => '#f00',
'color1' => '#f00',
'color2' => '#f00'
),
'multi-display' => array(
'upper_elbo' => '#9cf',
'lower_elbo' => '#c66',
'color1' => '#f90',
'color2' => '#c9c',
'text1' => '#fff',
'text2' => '#f90',
)
);
?>
*[lang^="vuh-Latn"] {
font-family: cursive;
}
body {
margin: 0 10px;
/* IE 5.5+ scrollbar colors */
/* from Mozilla LCARS Theme (2D style) */
scrollbar-3dlight-color: #000;
scrollbar-arrow-color: #000;
scrollbar-base-color: #000;
scrollbar-darkshadow-color: #000;
scrollbar-face-color: #99f;
scrollbar-highlight-color: #99f;
scrollbar-track-color: #000;
scrollbar-shadow-color: #99f;
background-color: #000;
color:
<?php echo $colors['database']['text']; ?>;
font-size: 131%; /* 134% */
}
/* headings */
h1 {
font-size: 120%; /* 191% */
font-weight: normal;
color: #fff; /* #c96 */
background-color: black;
}
h2 {
font-size: 120%; /* 129% */
font-weight: normal;
color: #fff; /* #fc6 */
background-color: black;
text-transform: uppercase;
}
h3 {
margin-top: 0;
margin-bottom: 1em;
font-size: 123%;
font-weight: normal;
color: #fff; /* #fc6 */
background-color: black;
text-transform: uppercase;
}
h4 {
margin-top: 2em;
margin-bottom: 1em;
font-size: 116%;
font-weight: normal;
color: #fc6;
background-color: black;
}
table+h4 {
margin-top: 1em;
}
/*
a.h4:link:hover,a.h4:visited:hover {
color: #fc6;
background-color: black;
}
a.h4:link:active,a.h4:visited:active {
color: #fff;
background-color: black;
}
*/
h5 {
margin-top: 2em;
margin-bottom: 1em;
background-color: black;
color:
<?php echo $colors['multi-display']['text1']; ?>; /* #fc6 */
font-size: 111%;
font-weight: normal;
}
h6 {
margin-top: 2em;
margin-bottom: 1em;
font-size: 104%;
font-weight: normal;
color: #fc6;
background-color: black;
}
div.body { /* width:95%; */
}
span.alt { /* span with alternative text color */
color: #f93;
background-color: #000;
}
/* for JavaScript processing messages */
.standby {
font-size: 166%;
background-color: #000;
color: #99f;
}
div.standby {
position: absolute;
top: 0;
visibility: hidden;
}
/* font styles */
p {
margin-top: 0;
margin-bottom: 1em;
}
div,p,li,th,td {
max-width: 60ex;
}
small {
font-size: 100%;
}
b, strong {
color:
<?php echo $colors['multi-display']['text1']; ?>; /* #f93 */
background-color: #000;
font-weight: normal;
}
i, cite, blockquote, em {
background-color: #000;
color:
<?php echo $colors['multi-display']['text1']; ?>; /* #f93 */
font-style: normal;
}
abbr {
white-space: nowrap;
}
abbr, acronym {
border-bottom: 1px dotted;
cursor: help;
}
del {
background-color: #000;
color:
<?php echo $colors['database']['old_text']; ?>;
text-decoration: line-through;
}
ins {
background-color: #000;
color:
<?php echo $colors['database']['new_text']; ?>;
text-decoration: none;
}
span.cap {
font-variant: small-caps;
}
ul.filelist li {
background-color: #000;
color:
<?php echo $colors['database']['n/a']; ?>;
cursor: not-allowed;
}
/* LCARS specific anchors */
/* order is important to buggy IE;
TODO: [IE] links focus color, visited links hover color */
a:link:hover,
a:link:active,
a:link:focus
{
background-color: #000;
color:
<?php echo $colors['database']['hover']; ?>; /* #fc0 */
text-decoration: none;
}
a:link {
background-color: #000;
color:
<?php echo $colors['database']['link']; ?>; /* white */
text-decoration: none;
}
a:visited:hover {
background-color: #000;
color:
<?php echo $colors['database']['hover']; ?>; /* #fc3 */
text-decoration: none;
}
a:visited:active {
background-color: #000;
color:
<?php echo $colors['database']['active']; ?>; /* #fff */
text-decoration: none;
}
a:visited:focus {
background-color: #000;
color:
<?php echo $colors['database']['hover']; ?>; /* #fc3; */
text-decoration: none;
}
a:visited {
background-color: #000;
color:
<?php echo $colors['database']['visited']; ?>; /* #fc9 */
text-decoration: none;
}
/* buttons */
a.button:link:focus,a.button:visited:focus,a.button:link:hover,a.button:visited:hover
{
color: #000;
background-color: #c9c;
text-decoration: none;
}
a.button:link:active,a.button:visited:active {
color: #000;
background-color: #fff;
cursor: default;
text-decoration: none;
}
a.button:link,a.button:visited {
background-color: #969;
color: #000;
padding-left: 1px;
vertical-align: middle;
font-size: 110%;
text-decoration: none;
}
a.stop:link,a.stop:visited {
background-color: #c66;
color: #000;
padding-left: 1px;
vertical-align: middle;
font-size: 110%;
text-decoration: none;
}
a.stop:link:hover,a.stop:visited:hover {
background-color: #f66;
color: #000;
text-decoration: none;
}
a.stop:link:active,a.stop:visited:active {
background-color: #fff;
color: #000;
text-decoration: none;
}
a.go:link,a.go:visited {
background-color: #6c6;
color: #000;
padding-left: 1px;
vertical-align: middle;
font-size: 110%;
text-decoration: none;
}
a.go:link:hover,a.go:visited:hover {
background-color: #6f6;
color: #000;
text-decoration: none;
}
a.go:link:active,a.go:visited:active {
background-color: #fff;
color: #000;
text-decoration: none;
}
span.symbol {
font-family: Webdings, fantasy;
font-style: normal;
font-weight: normal;
font-size: 110%;
}
/* form elements */
input {
background-color: black;
font-size: 104%;
color: white;
}
input.button { /* offset-width:auto; */
border-style: none;
border-width: 0px;
color: #000;
background-color: #969;
font-size: 123%;
cursor: pointer;
}
textarea {
background-color: #000;
font-size: 104%;
color: white;
}
select {
color: white;
background-color: #000;
border-color: white;
font-size: 104%;
cursor: pointer;
}
option {
cursor: pointer;
}
/* table elements */
table {
border-collapse: separate;
margin-top: 0;
margin-bottom: 1em;
}
/*
* Not for IE 6 and below.
* Bugfix for IE 7 is provided by lcars-ie7.css which should be
* included as follows:
<link rel="stylesheet" href="/styles/lcars.css" type="text/css">
<!--[if IE 7]>
<link rel="stylesheet" href="/styles/lcars-ie7.css" type="text/css">
<![endif]-->
*/
table>tbody.scroll {
height: 11em;
overflow: auto;
/*
* In current implementations, the scrollbar is displayed within
* the tbody area, so we disable horizontal scrolling for that ...
*/
overflow-x: hidden !important;
}
table>tbody.scroll tr {
height: auto;
}
/*
* ... and make enough room so that the text won't flow under the
* vertical scrollbar. However, that is still a dirty hack as we
* assume that the vertical scrollbar is not wider than 20px.
*/
table>tbody.scroll td:last-child {
padding-right: 20px;
}
tr {
vertical-align: top;
vertical-align: baseline;
}
th {
padding-left: 3px;
/* border-right:2px solid black; */
text-align: left;
background-color: #c66;
color: #000;
font-size: 133%;
font-weight: normal;
}
thead th:first-child {
padding-left: 12px;
border-radius: 12px 0 0 0;
-moz-border-radius: 12px 0 0 0;
-webkit-border-radius: 12px 0 0 0;
}
table.left th,thead.left th,tbody.left th,th.left {
background-color: inherit;
color: inherit;
text-transform: uppercase;
text-align: right;
}
th,td {
padding-right: 3px;
}
td {
padding-left: 4px;
background-color: inherit;
color: inherit;
font-size: 133%;
}
/* hover table */
table.hover thead th:hover,thead.hover th:hover,tbody.hover th:hover,table.hover tbody tr:hover th,tbody.hover tr:hover th
{
background-color: #f99;
color: #000;
}
table.hover tbody tr:hover,tbody.hover tr:hover {
color: #fc3;
}
table.hover tbody tr:hover a,tbody.hover tr:hover a {
background-color: inherit;
}
/* Lowlight all rows except that with the active/focused element */
table.hover tbody:active,table.hover tbody:focus,tbody.hover:active,tbody.hover:focus
{
background-color: #000;
color: #99c;
}
table.hover tbody tr:active,tbody.hover tr:active,table.hover tbody tr:focus,tbody.hover tr:focus
{
background-color: #000;
color: #fff;
}
/* This to invert display on hover does not seem proper LCARS design */
/*
table.hover tbody tr:hover a:link,
tbody.hover tr:hover a:link {
color:#fff;
}
table.hover tbody tr:hover a:visited,
tbody.hover tr:hover a:visited {
background-color:inherit;
color:#963;
}
table.hover tbody tr:hover a:link:focus,
table.hover tbody tr:hover a:visited:focus,
table.hover tbody tr:hover a:link:hover,
table.hover tbody tr:hover a:visited:hover,
table.hover tbody tr:hover a:link:active,
tbody.hover tr:hover a:link:focus,
tbody.hover tr:hover a:visited:focus,
tbody.hover tr:hover a:link:hover,
tbody.hover tr:hover a:visited:hover,
tbody.hover tr:hover a:link:active {
background-color:inherit;
color:#960;
}
table.hover tbody tr:hover a:visited:active,
tbody.hover tr:hover a:visited:active {
background-color:inherit;
color:#c63;
}
*/