WebSVN - LCARS - Path Comparison - /trunk/styles/lcars.css Rev 19 and /trunk/styles/lcars.css.php Rev 36

Ignore whitespace Rev 19 → Rev 36

 /trunk/styles/lcars.css.php/lcars.css
 ,9 → 1,11
+<?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;
 ,7 → 29,6
   src:url(WEBDING0.eot);
 }
 */
 @font-face {
   font-family: "Downloadable Zurich XCn BT";
   font-style: normal;
 ,163 → 37,247
 }
 /* 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-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^="x-vulcan-latin"] {
+  font-family: cursive;
+}
 body {
-  cursor:default;
-  font-size:134%; /*129%*/
-  background-color:#000;
-  color:#ccf; /* #afbfe0; #69F; */
-  margin:0 10px;
+  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;
+  /* 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% */
 }
-div.body {
-  /* width:95%; */
+/* headings */
+h1 {
+  font-size: 120%; /* 191% */
+  font-weight: normal;
+  color: #fff; /* #c96 */
+  background-color: black;
 }
-span.alt { /* span with alternative text color */
-  color:#f93;
-  background-color:#000;
+h2 {
+  font-size: 120%; /* 129% */
+  font-weight: normal;
+  color: #fff; /* #fc6 */
+  background-color: black;
+  text-transform: uppercase;
 }
-/* for JavaScript processing messages */
+h3 {
+  margin-top: 0;
+  margin-bottom: 1em;
+  font-size: 123%;
+  font-weight: normal;
+  color: #fff; /* #fc6 */
+  background-color: black;
+  text-transform: uppercase;
+}
-.standby {
-  font-size:166%;
-  background-color:#000;
-  color:#99f;
+h4 {
+  margin-top: 2em;
+  margin-bottom: 1em;
+  font-size: 116%;
+  font-weight: normal;
+  color: #fc6;
+  background-color: black;
 }
-div.standby {
-  position:absolute;
-  top:0;
-  visibility:hidden;
+table+h4 {
+  margin-top: 1em;
 }
-/* font styles  */
+/*
+a.h4:link:hover,a.h4:visited:hover {
+  color: #fc6;
+  background-color: black;
+}
-p {
-  margin-top:0;
-  margin-bottom:1em;
+a.h4:link:active,a.h4:visited:active {
+  color: #fff;
+  background-color: black;
 }
+*/
-div, p, li, th, td {
-  max-width: 60ex;
+h5 {
+  margin-top: 2em;
+  margin-bottom: 1em;
+  background-color: black;
+  color: <?php echo $colors['multi-display']['text1']; ?>; /* #fc6 */
+  font-size: 111%;
+  font-weight: normal;
 }
-small  {
-  font-size:100%;
+h6 {
+  margin-top: 2em;
+  margin-bottom: 1em;
+  font-size: 104%;
+  font-weight: normal;
+  color: #fc6;
+  background-color: black;
 }
-b, strong {
-  color:#f93;
-  background-color:#000;
-  font-weight:normal;
+div.body { /* width:95%; */
 }
-i, cite, blockquote, em {
-  background-color:#000;
-  color:#f93;
-  font-style:normal;
+span.alt { /* span with alternative text color */
+  color: #f93;
+  background-color: #000;
 }
-abbr {
-  white-space:nowrap;
+/* for JavaScript processing messages */
+.standby {
+  font-size: 166%;
+  background-color: #000;
+  color: #99f;
 }
-abbr, acronym {
-  border-bottom: 1px solid dotted;
-  cursor: help;
+div.standby {
+  position: absolute;
+  top: 0;
+  visibility: hidden;
 }
-span.cap {
-  font-variant:small-caps;
+/* font styles  */
+p {
+  margin-top: 0;
+  margin-bottom: 1em;
 }
-/* headings */
+div,p,li,th,td {
+  max-width: 60ex;
+}
-h1 {
-  font-size:191%;
-  font-weight:normal;
-  color:#c96;
-  background-color:black;
+small {
+  font-size: 100%;
 }
-h2 {
-  font-size:129%;
-  font-weight:normal;
-  color:#fc6;
-  background-color:black;
-  text-transform: uppercase;
+b, strong {
+  color: <?php echo $colors['multi-display']['text1']; ?>; /* #f93 */
+  background-color: #000;
+  font-weight: normal;
 }
-h3 {
-  margin-top:0;
-  margin-bottom:1em;
-  font-size:123%;
-  font-weight:normal;
-  color:#fc6;
-  background-color:black;
-  text-transform: uppercase;
+i, cite, blockquote, em {
+  background-color: #000;
+  color: <?php echo $colors['multi-display']['text1']; ?>; /* #f93 */
+  font-style: normal;
 }
-h4 {
-  margin-top:2em;
-  margin-bottom:1em;
-  font-size:116%;
-  font-weight:normal;
-  color:#fc6;
-  background-color:black;
+abbr {
+  white-space: nowrap;
 }
-table + h4 {
-  margin-top:1em;
+abbr, acronym {
+  border-bottom: 1px dotted;
+  cursor: help;
 }
-a.h4:link:hover, a.h4:visited:hover {
-  color:#fc6;
-  background-color:black;
+del {
+  background-color: #000;
+  color: <?php echo $colors['database']['old_text']; ?>;
+  text-decoration: line-through;
 }
-a.h4:link:active, a.h4:visited:active {
-  color:#fff;
-  background-color:black;
+ins {
+  background-color: #000;
+  color: <?php echo $colors['database']['new_text']; ?>;
+  text-decoration: none;
 }
-h5 {
-  margin-top:2em;
-  margin-bottom:1em;
-  font-size:111%;
-  font-weight:normal;
-  color:#fc6;
-  background-color:black;
+span.cap {
+  font-variant: small-caps;
 }
-h6 {
-  margin-top:2em;
-  margin-bottom:1em;
-  font-size:104%;
-  font-weight:normal;
-  color:#fc6;
-  background-color:black;
+ul.filelist li  {
+  background-color: #000;
+  color: <?php echo $colors['database']['n/a']; ?>;
+  cursor: not-allowed;
 }
 /* LCARS specific anchors */
 ,160 → 284,157
 /* 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:#fc0;
-  text-decoration:none;
+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:black;
-  color:white;
-  text-decoration:none;
+  background-color: #000;
+  color: <?php echo $colors['database']['link']; ?>; /* white */
+  text-decoration: none;
 }
 a:visited:hover {
-  background-color:#000;
-  color:#fc3;
-  text-decoration:none;
+  background-color: #000;
+  color: <?php echo $colors['database']['hover']; ?>; /* #fc3 */
+  text-decoration: none;
 }
 a:visited:active {
-  background-color:black;
-  color:#fff;
-  text-decoration:none;
+  background-color: #000;
+  color: <?php echo $colors['database']['active']; ?>; /* #fff */
+  text-decoration: none;
 }
 a:visited:focus {
-  background-color:#000;
-  color:#fc3;
-  text-decoration:none;
+  background-color: #000;
+  color: <?php echo $colors['database']['hover']; ?>; /* #fc3; */
+  text-decoration: none;
 }
 a:visited {
-  background-color:black;
-  color:#fc9;
-  text-decoration:none;
+  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: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: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.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,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: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.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,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: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;
+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%;
+  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 {
+  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;
+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;
+textarea {
+  background-color: #000;
+  font-size: 104%;
+  color: white;
 }
-select
- {
-  color:white;
-  background-color:#000;
-  border-color:white;
-  font-size:104%;
-  cursor:pointer;
+select {
+  color: white;
+  background-color: #000;
+  border-color: white;
+  font-size: 104%;
+  cursor: pointer;
 }
 option {
-  cursor:pointer;
+  cursor: pointer;
 }
 /* table elements */
 table {
   border-collapse: separate;
-  margin-top:0;
-  margin-bottom:1em;
+  margin-top: 0;
+  margin-bottom: 1em;
 }
 /*
 ,8 → 448,8
    <![endif]-->
  */
 table>tbody.scroll {
-  height:11em;
-  overflow:auto;
+  height: 11em;
+  overflow: auto;
   /*
    * In current implementations, the scrollbar is displayed within
    * the tbody area, so we disable horizontal scrolling for that ...
 ,24 → 465,24
  * ... 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: top;
   vertical-align: baseline;
 }
 th {
-  padding-left:3px;
+  padding-left: 3px;
   /* border-right:2px solid black; */
-  text-align:left;
-  background-color:#c66;
-  color:#000;
+  text-align: left;
+  background-color: #c66;
+  color: #000;
   font-size: 133%;
-  font-weight:normal;
+  font-weight: normal;
 }
 thead th:first-child {
 ,60 → 492,50
   -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;
+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;
+th,td {
+  padding-right: 3px;
 }
 td {
-  padding-left:4px;
-  background-color:inherit;
-  color:inherit;
-  font-size:133%;
+  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 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,tbody.hover tr:hover {
+  color: #fc3;
 }
-table.hover tbody tr:hover a,
-tbody.hover tr:hover a {
-  background-color:inherit;
+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: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;
+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 */

Subversion Repositories LCARS

Compare Revisions

Last modification

Ignore whitespace Rev 19 → Rev 36