projects
/
tricorder.git
/ blobdiff
commit
grep
author
committer
pickaxe
?
search:
re
summary
|
shortlog
|
log
|
commit
|
commitdiff
|
tree
raw
|
inline
| side by side
try adding the developer name to the manifest
[tricorder.git]
/
style
/
tricorder.css
diff --git
a/style/tricorder.css
b/style/tricorder.css
index 700a72a78126770fa34de40710bb4e8f31712166..843d225b3cd2a90ca86806d690504c49d782e391 100644
(file)
--- a/
style/tricorder.css
+++ b/
style/tricorder.css
@@
-2,15
+2,16
@@
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at http://mozilla.org/MPL/2.0/. */
* License, v. 2.0. If a copy of the MPL was not distributed with this file,
* You can obtain one at http://mozilla.org/MPL/2.0/. */
-@font-face {
- font-family: DVSC; /* Original in Star Trek is Helvetica Ultra Condensed */
- src: url("DejaVuSansCondensed.ttf");
-}
+/* The original LCARS font in Star Trek is Helvetica Ultra Condensed.
+ * We try to use open stuff here, so we use OSP-DIN from
+ * http://openfontlibrary.org/en/font/osp-din, which is licensed under the
+ * SIL OFL - http://scripts.sil.org/OFL */
@font-face {
@font-face {
- font-family: DVSC;
- src: url("DejaVuSansCondensed-Bold.ttf");
- font-weight: bold;
+ font-family: OSPDIN;
+ src: url('OSPDIN.ttf') format('truetype');
+ font-weight: normal;
+ font-style: normal;
}
html {
}
html {
@@
-26,7
+27,7
@@
body {
background-color: #000000;
color: #FF9F00;
position: relative;
background-color: #000000;
color: #FF9F00;
position: relative;
- font-family:
DVSC,"DejaVu Sans",Arial,Helvetica
,sans-serif;
+ font-family:
OSPDIN
,sans-serif;
}
h1 {
}
h1 {
@@
-43,7
+44,7
@@
a:hover, a:active { color: #FFCF00; }
bottom: 3px;
left: 3px;
right: auto;
bottom: 3px;
left: 3px;
right: auto;
- width:
14
0px;
+ width:
9
0px;
height: auto;
padding: 0px;
margin: 0px 0px 0px 0px;
height: auto;
padding: 0px;
margin: 0px 0px 0px 0px;
@@
-54,8
+55,8
@@
a:hover, a:active { color: #FFCF00; }
#sideTop {
background-color: #6080F0;
color: #000000;
#sideTop {
background-color: #6080F0;
color: #000000;
- width:
12
0px;
- height:
8
0px;
+ width:
7
0px;
+ height:
6
0px;
margin-bottom: 3px;
}
margin-bottom: 3px;
}
@@
-63,14
+64,13
@@
a:hover, a:active { color: #FFCF00; }
background-color: #A06060;
color: #000000;
padding: 3px 3px 10px;
background-color: #A06060;
color: #000000;
padding: 3px 3px 10px;
- font-weight: bold;
text-align: right;
border-bottom: 3px solid black;
}
#sideSepTop {
background-color: #808090;
text-align: right;
border-bottom: 3px solid black;
}
#sideSepTop {
background-color: #808090;
- width:
14
0px;
+ width:
9
0px;
height: 20px;
margin-bottom: 3px;
padding-bottom: 10px;
height: 20px;
margin-bottom: 3px;
padding-bottom: 10px;
@@
-80,12
+80,12
@@
a:hover, a:active { color: #FFCF00; }
background-color: #000000;
width: 20px;
height: 100%;
background-color: #000000;
width: 20px;
height: 100%;
- margin-left:
12
0px;
+ margin-left:
7
0px;
border-radius: 0px 0px 0px 15px;
}
#sideSepBottom {
border-radius: 0px 0px 0px 15px;
}
#sideSepBottom {
- background-color: #
008484
;
- width:
14
0px;
+ background-color: #
6080F0
;
+ width:
9
0px;
height: 50px;
margin-bottom: 3px;
padding-top: 10px;
height: 50px;
margin-bottom: 3px;
padding-top: 10px;
@@
-95,18
+95,18
@@
a:hover, a:active { color: #FFCF00; }
background-color: #000000;
width: 20px;
height: 100%;
background-color: #000000;
width: 20px;
height: 100%;
- margin-left:
12
0px;
+ margin-left:
7
0px;
border-radius: 15px 0px 0px 0px;
}
#sideBottom {
background-color: #9C9CFF;
color: #000000;
border-radius: 15px 0px 0px 0px;
}
#sideBottom {
background-color: #9C9CFF;
color: #000000;
- width:
12
0px;
+ width:
7
0px;
margin-bottom: 3px;
position: absolute;
margin-bottom: 3px;
position: absolute;
- top: 1
7
9px;
- bottom:
40px
;
+ top: 1
5
9px;
+ bottom:
2em
;
height: auto;
}
height: auto;
}
@@
-117,41
+117,31
@@
a:hover, a:active { color: #FFCF00; }
}
#navlist > li {
margin: 0;
}
#navlist > li {
margin: 0;
- padding: 0
0.2em 0
;
+ padding: 0
.2em
;
border-bottom: 3px solid #000000;
border-bottom: 3px solid #000000;
- font-weight: bold;
-}
-#navlist > li > a {
- display: block;
- text-decoration: none;
- width: 100%;
- padding: 0.3em 0;
+ text-transform: uppercase;
}
#navlist > li:hover,
}
#navlist > li:hover,
-#navlist > li:active,
-#navlist > li:hover > a,
-#navlist > li:active > a,
-#navlist > li > a:hover,
-#navlist > li > a:active {
+#navlist > li:active {
background-color: #FFCF00;
color: #000000;
}
background-color: #FFCF00;
color: #000000;
}
-#navlist > li.active,
-#navlist > li.active > a {
+#navlist > li.active {
background-color: #008484;
color: #FFCF00;
background-color: #008484;
color: #FFCF00;
+ outline: none;
}
}
-#navPos
, #navPos > a
{
+#navPos {
background-color: #FF9F00;
color: #000000;
}
background-color: #FF9F00;
color: #000000;
}
-#navGrav
, #navGrav > a
{
+#navGrav {
background-color: #C09070;
color: #000000;
}
background-color: #C09070;
color: #000000;
}
-#nav
Acou, #navAcou > a
{
+#nav
Other
{
background-color: #6000CF;
color: #000000;
}
background-color: #6000CF;
color: #000000;
}
@@
-159,25
+149,36
@@
a:hover, a:active { color: #FFCF00; }
#sideRemark {
background-color: #E7ADE7;
color: #000000;
#sideRemark {
background-color: #E7ADE7;
color: #000000;
- width: 120px;
- font-size: 10px;
- text-align: center;
+ width: 70px;
position: absolute;
bottom: 0px;
position: absolute;
bottom: 0px;
- height: 40px;
+ height: 2em;
+ margin: 0;
+ padding: 0;
+ list-style-type: none;
+}
+#sideRemark > li {
+ text-transform: uppercase;
+ padding-top: .25em;
+ padding-left: .2em;
+ height: 1.75em;
+ margin: 0;
+}
+#sideRemark > li:hover,
+#sideRemark > li:active {
+ background-color: #FFCF00;
+ color: #000000;
}
}
-#sideRemark a:link, #sideRemark a:visited { color: #000000; }
-#sideRemark a:hover, #sideRemark a:active { color: #008484; }
#mainarea {
position: absolute;
top: 3px;
bottom: 3px;
#mainarea {
position: absolute;
top: 3px;
bottom: 3px;
- left:
14
5px;
+ left:
9
5px;
right: 3px;
width: auto;
padding: 1px;
right: 3px;
width: auto;
padding: 1px;
- min-height:
35
em;
+ min-height:
20
em;
overflow: none;
border: none;
}
overflow: none;
border: none;
}
@@
-187,7
+188,7
@@
a:hover, a:active { color: #FFCF00; }
font-size: 3em;
font-weight: bold;
line-height: .8em;
font-size: 3em;
font-weight: bold;
line-height: .8em;
- height:
10
2px;
+ height:
8
2px;
text-align: center;
}
text-align: center;
}
@@
-206,7
+207,7
@@
a:hover, a:active { color: #FFCF00; }
#mainContent {
position: absolute;
#mainContent {
position: absolute;
- top: 1
2
9px;
+ top: 1
0
9px;
bottom: 0px;
left: 0px;
right: 1px;
bottom: 0px;
left: 0px;
right: 1px;
@@
-227,6
+228,61
@@
section.active {
display: block;
}
display: block;
}
-.gravVal {
+.
posVal, .
gravVal {
text-align: right;
text-align: right;
-}
\ No newline at end of file
+}
+
+.posVal {
+ width: 24ch;
+}
+
+.gravVal {
+ width: 10ch;
+}
+
+.note {
+ font-size: .667em;
+}
+
+@media screen and (min-width: 500px) {
+ body {
+ font-size: 24px;
+ }
+ #sidebar {
+ width: 140px;
+ }
+ #sideTop {
+ width: 120px;
+ height: 80px;
+ }
+ #sideSepTop {
+ width: 140px;
+ }
+ #sideSepTopInsert {
+ margin-left: 120px;
+ }
+ #sideSepBottom {
+ width: 140px;
+ }
+ #sideSepBottomInsert {
+ margin-left: 120px;
+ }
+ #sideBottom {
+ width: 120px;
+ top: 179px;
+ bottom: 40px;
+ }
+ #sideRemark {
+ width: 120px;
+ height: 40px;
+ }
+ #mainarea {
+ left: 145px;
+ }
+ #mainHeader {
+ height: 102px;
+ }
+ #mainContent {
+ top: 129px;
+ }
+}