Subversion Repositories LCARS

Rev

Rev 43 | Rev 58 | Go to most recent revision | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 43 Rev 50
Line -... Line 1...
-
 
1
<?php
-
 
2
// \header('Last-Modified: ' . gmdate('D, d M Y H:i:s', @filemtime(__FILE__)) . ' GMT');
-
 
3
//
-
 
4
// /* Cached resource expires in HTTP/1.1 caches 24h after last retrieval */
-
 
5
// \header('Cache-Control: max-age=86400, s-maxage=86400, must-revalidate, proxy-revalidate');
-
 
6
//
-
 
7
// /* Cached resource expires in HTTP/1.0 caches 24h after last retrieval */
-
 
8
// \header('Expires: ' . gmdate('D, d M Y H:i:s', time() + 86400) . ' GMT');
-
 
9
 
-
 
10
\header('Content-Type: text/css; charset=UTF-8');
-
 
11
?>
1
@CHARSET "UTF-8";
12
@CHARSET "UTF-8";
2
13
-
 
14
@import url("/styles/lcars-ani.css");
-
 
15
3
/* Basic fonts */
16
/* Basic fonts */
4
17
5
@font-face {
18
@font-face {
6
  font-family: "LCARS";
19
  font-family: "LCARS";
7
  font-style: normal;
20
  font-style: normal;
Line 53... Line 66...
53
  color: #99f;
66
  color: #99f;
54
  font-size: 131%;
67
  font-size: 131%;
55
  overflow: auto;
68
  overflow: auto;
56
}
69
}
57
70
58
/* 0.0 to 1.0 s */
-
 
59
@-webkit-keyframes fade-in {
-
 
60
  from {
-
 
61
    opacity: 0;
-
 
62
  }
-
 
63
-
 
64
  /* at 0.25 s */
-
 
65
  25% {
-
 
66
    opacity: 0;
-
 
67
  }
-
 
68
-
 
69
  to {
-
 
70
    opacity: 1;
-
 
71
  }
-
 
72
}
-
 
73
-
 
74
body.fade-in {
-
 
75
  /* TODO: Step-by-step display instead */
-
 
76
  /*-webkit-animation-name: fade-in;*/
-
 
77
  /* -webkit-animation-iteration-count: infinite; */
-
 
78
}
-
 
79
-
 
80
body.empty {
71
body.empty {
81
  margin-top: 3em;
72
  margin-top: 3em;
82
  margin-left: 0.2em;
73
  margin-left: 0.2em;
83
  margin-bottom: 3em;
74
  margin-bottom: 3em;
84
}
75
}
Line 90... Line 81...
90
#content {
81
#content {
91
  /* position: relative; */
82
  /* position: relative; */
92
  margin-right: 1em;
83
  margin-right: 1em;
93
}
84
}
94
85
95
/* 0.0 to 0.6 s */
-
 
96
@-webkit-keyframes content {
-
 
97
  from {
-
 
98
    opacity: 0;
-
 
99
  }
-
 
100
 
-
 
101
  /* 0.6 s */
-
 
102
  99% {
-
 
103
    opacity: 0;
-
 
104
  }
-
 
105
}
-
 
106
-
 
107
.empty.fade-in #content {
-
 
108
  -webkit-animation-name: content;
-
 
109
  -webkit-animation-duration: 0.6s;
-
 
110
  -webkit-animation-timing-function: linear;
-
 
111
}
-
 
112
-
 
113
a {
86
a {
114
  text-decoration: none;
87
  text-decoration: none;
115
}
88
}
116
89
117
a:link:hover,
90
a:link:hover,
Line 231... Line 204...
231
  border-top-left-radius: 1.2em;
204
  border-top-left-radius: 1.2em;
232
  border-bottom-left-radius: 1.2em;
205
  border-bottom-left-radius: 1.2em;
233
  min-width: 10em;
206
  min-width: 10em;
234
}
207
}
235
208
236
/* 0.0 to 0.5 s */
-
 
237
@-webkit-keyframes bow-top {
-
 
238
  from {
-
 
239
    left: 90%;
-
 
240
    border-top-left-radius: 0;    
-
 
241
    border-bottom-left-radius: 0;    
-
 
242
  }
-
 
243
}
-
 
244
     
-
 
245
.fade-in #bow-top {
-
 
246
  -webkit-animation-name: bow-top;
-
 
247
  -webkit-animation-duration: 0.5s;
-
 
248
  -webkit-animation-timing-function: linear;
-
 
249
}
-
 
250
209
251
#bow-top .text {
210
#bow-top .text {
252
  position: absolute;
211
  position: absolute;
253
  margin: 0;
212
  margin: 0;
254
  left: 4.33em;
213
  left: 4.33em;
Line 265... Line 224...
265
224
266
.empty #bow-top .text {
225
.empty #bow-top .text {
267
  left: 0.93em;
226
  left: 0.93em;
268
}
227
}
269
228
270
/* 0.0 to 0.5 s */
-
 
271
@-webkit-keyframes bow-top-text {
-
 
272
  from {
-
 
273
    opacity: 0;
-
 
274
  }
-
 
275
 
229
276
  /* shortly before 1.0 s */
-
 
277
  99% {
-
 
278
    opacity: 0;
-
 
279
  }
-
 
280
}
-
 
281
-
 
282
.fade-in #bow-top .text {
-
 
283
  -webkit-animation-name: bow-top-text;
-
 
284
  -webkit-animation-duration: 0.5s;
-
 
285
  -webkit-animation-timing-function: linear;
-
 
286
}
-
 
287
230
288
#bow-top .text span {
231
#bow-top .text span {
289
  padding-right: 0.1em;
232
  padding-right: 0.1em;
290
  background-color: #000;
233
  background-color: #000;
291
  padding-left: 0.1em;
234
  padding-left: 0.1em;
Line 302... Line 245...
302
  padding-top: 0.2em;
245
  padding-top: 0.2em;
303
  padding-bottom: 0.2em;
246
  padding-bottom: 0.2em;
304
  background-color: #000;
247
  background-color: #000;
305
}
248
}
306
249
307
/* 0.0 to 0.5 s */
-
 
308
@-webkit-keyframes footer {
-
 
309
  from {
-
 
310
    left: 90%;
-
 
311
    border-top-left-radius: 0;    
-
 
312
    border-bottom-left-radius: 0;    
-
 
313
  }
-
 
314
}
-
 
315
-
 
316
.empty.fade-in #footer {
-
 
317
  -webkit-animation-name: footer;
-
 
318
  -webkit-animation-duration: 0.5s;
-
 
319
  -webkit-animation-timing-function: linear;
-
 
320
}
-
 
321
250
322
.empty #footer {
251
.empty #footer {
323
  position: absolute;
252
  position: absolute;
324
  bottom: 0;
253
  bottom: 0;
325
  left: 0;
254
  left: 0;
Line 345... Line 274...
345
  padding-right: 0.1em;
274
  padding-right: 0.1em;
346
  overflow: hidden;
275
  overflow: hidden;
347
  text-overflow: ellipsis;
276
  text-overflow: ellipsis;
348
}
277
}
349
278
350
/* 0.0 to 0.5 s */
-
 
351
@-webkit-keyframes footer-text {
-
 
352
  from {
-
 
353
    opacity: 0;
-
 
354
  }
-
 
355
 
-
 
356
  /* shortly before 0.5 s */
-
 
357
  99% {
-
 
358
    opacity: 0;
-
 
359
  }
-
 
360
}
-
 
361
-
 
362
.empty.fade-in #footer .text {
-
 
363
  -webkit-animation-name: footer-text;
-
 
364
  -webkit-animation-duration: 0.5s;
-
 
365
  -webkit-animation-timing-function: linear;
-
 
366
}
-
 
367
-
 
368
.empty #footer .text span {
279
.empty #footer .text span {
369
  padding-right: 0.1em;
280
  padding-right: 0.1em;
370
  background-color: #000;
281
  background-color: #000;
371
  padding-left: 0.1em;
282
  padding-left: 0.1em;
372
  text-transform: uppercase;
283
  text-transform: uppercase;
Line 397... Line 308...
397
  height: 3.2em;
308
  height: 3.2em;
398
  width: 9.2em;
309
  width: 9.2em;
399
  background-color: #999;
310
  background-color: #999;
400
}
311
}
401
312
402
/* 0.0 to 0.625 s */
-
 
403
@-webkit-keyframes bow-top-left {
-
 
404
  from {
-
 
405
    height: 0;
-
 
406
  }
-
 
407
-
 
408
  /* at 0.5 s */
-
 
409
  80% {
-
 
410
    height: 0;
-
 
411
  }
-
 
412
}
-
 
413
     
-
 
414
.fade-in #bow-top-left {
-
 
415
  -webkit-animation-name: bow-top-left;
-
 
416
  -webkit-animation-duration: 0.625s;  
-
 
417
  -webkit-animation-timing-function: linear;  
-
 
418
}
-
 
419
-
 
420
.empty #bow-top-left {
313
.empty #bow-top-left {
421
  display: none;
314
  display: none;
422
}
315
}
423
316
424
#bow-top-left .concave {
317
#bow-top-left .concave {
Line 433... Line 326...
433
326
434
.empty #bow-top-left-concave {
327
.empty #bow-top-left-concave {
435
  display: none;
328
  display: none;
436
}
329
}
437
330
438
#LCARS .menu-container {
331
.menu-container {
439
  position: fixed;
332
  position: fixed;
440
  left: 0.2em;
333
  left: 0.2em;
441
  top: 5.6em;
334
  top: 5.6em;
442
  width: 8em;
335
  width: 8em;
443
  bottom: 2.8em;
336
  bottom: 2.8em;
444
  background-color: #999;
337
  background-color: #999;
445
  overflow: auto;
338
  overflow: auto;
446
}
339
}
447
340
448
#LCARS .menu
341
.menu
449
{
342
{
450
  height: 17.6em;
343
  height: 17.6em;
451
  background-color: #000;
344
  background-color: #000;
452
}
345
}
453
346
454
/* 0.0 to 1.125 s */
-
 
455
@-webkit-keyframes bow-menu {
-
 
456
  from {
-
 
457
    opacity: 0;
-
 
458
  }
-
 
459
-
 
460
  /* at ca. 0.61875 s */
-
 
461
  55% {
-
 
462
    opacity: 0;
-
 
463
  }
-
 
464
-
 
465
  56% {
-
 
466
    opacity: 1;
-
 
467
  }
-
 
468
}
-
 
469
-
 
470
.fade-in #LCARS .menu
-
 
471
{
-
 
472
  -webkit-animation-name: bow-menu;
-
 
473
  -webkit-animation-duration: 1.125s;
-
 
474
  -webkit-animation-timing-function: linear;
-
 
475
}
-
 
476
-
 
477
.menu ul {
347
.menu ul {
478
  margin: 0 0.2em 0.2em 0;
348
  margin: 0 0.2em 0.2em 0;
479
  padding: 0;
349
  padding: 0;
480
}
350
}
481
351
Line 548... Line 418...
548
  margin-bottom: 0.2em;
418
  margin-bottom: 0.2em;
549
  width: 5em;
419
  width: 5em;
550
  height: 2em;
420
  height: 2em;
551
  background-color: #7d7d7d; /* c9c */
421
  background-color: #7d7d7d; /* c9c */
552
  color: #000 !important;
422
  color: #000 !important;
553
  font-family: "LCARS",
-
 
554
    Haettenschweiler, "Downloadable Haettenschweiler",
-
 
555
    "Zurich XCn BT", "Downloadable Zurich XCn BT",
-
 
556
    impact, Verdana, Geneva, Arial, Helvetica, sans-serif;  
-
 
557
  text-decoration: none !important;
423
  text-decoration: none !important;
558
  text-transform: uppercase;
424
  text-transform: uppercase;
559
  overflow: hidden;
425
  overflow: hidden;
560
  cursor: pointer;
426
  cursor: pointer;
561
}
427
}
Line 603... Line 469...
603
  width: 8em;
469
  width: 8em;
604
  height: 1em;
470
  height: 1em;
605
  line-height: 1;
471
  line-height: 1;
606
  background-color: #9cf;
472
  background-color: #9cf;
607
  color: #000 !important;
473
  color: #000 !important;
-
 
474
  text-overflow: ellipsis;
-
 
475
  white-space: nowrap;
608
}
476
}
609
477
610
.multi-display
478
.multi-display
611
{
479
{
612
  position: fixed;
480
  position: fixed;