* styles/ - Moved LCARS animations to separate resource - Use LEAST mixins via PHP
| /trunk/styles/lcars22.css |
|---|
| 1,5 → 1,18 |
| <?php |
| // \header('Last-Modified: ' . gmdate('D, d M Y H:i:s', @filemtime(__FILE__)) . ' GMT'); |
| // |
| // /* Cached resource expires in HTTP/1.1 caches 24h after last retrieval */ |
| // \header('Cache-Control: max-age=86400, s-maxage=86400, must-revalidate, proxy-revalidate'); |
| // |
| // /* Cached resource expires in HTTP/1.0 caches 24h after last retrieval */ |
| // \header('Expires: ' . gmdate('D, d M Y H:i:s', time() + 86400) . ' GMT'); |
| \header('Content-Type: text/css; charset=UTF-8'); |
| ?> |
| @CHARSET "UTF-8"; |
| @import url("/styles/lcars-ani.css"); |
| /* Basic fonts */ |
| @font-face { |
| 55,28 → 68,6 |
| overflow: auto; |
| } |
| /* 0.0 to 1.0 s */ |
| @-webkit-keyframes fade-in { |
| from { |
| opacity: 0; |
| } |
| /* at 0.25 s */ |
| 25% { |
| opacity: 0; |
| } |
| to { |
| opacity: 1; |
| } |
| } |
| body.fade-in { |
| /* TODO: Step-by-step display instead */ |
| /*-webkit-animation-name: fade-in;*/ |
| /* -webkit-animation-iteration-count: infinite; */ |
| } |
| body.empty { |
| margin-top: 3em; |
| margin-left: 0.2em; |
| 92,24 → 83,6 |
| margin-right: 1em; |
| } |
| /* 0.0 to 0.6 s */ |
| @-webkit-keyframes content { |
| from { |
| opacity: 0; |
| } |
| /* 0.6 s */ |
| 99% { |
| opacity: 0; |
| } |
| } |
| .empty.fade-in #content { |
| -webkit-animation-name: content; |
| -webkit-animation-duration: 0.6s; |
| -webkit-animation-timing-function: linear; |
| } |
| a { |
| text-decoration: none; |
| } |
| 233,20 → 206,6 |
| min-width: 10em; |
| } |
| /* 0.0 to 0.5 s */ |
| @-webkit-keyframes bow-top { |
| from { |
| left: 90%; |
| border-top-left-radius: 0; |
| border-bottom-left-radius: 0; |
| } |
| } |
| .fade-in #bow-top { |
| -webkit-animation-name: bow-top; |
| -webkit-animation-duration: 0.5s; |
| -webkit-animation-timing-function: linear; |
| } |
| #bow-top .text { |
| position: absolute; |
| 267,23 → 226,7 |
| left: 0.93em; |
| } |
| /* 0.0 to 0.5 s */ |
| @-webkit-keyframes bow-top-text { |
| from { |
| opacity: 0; |
| } |
| /* shortly before 1.0 s */ |
| 99% { |
| opacity: 0; |
| } |
| } |
| .fade-in #bow-top .text { |
| -webkit-animation-name: bow-top-text; |
| -webkit-animation-duration: 0.5s; |
| -webkit-animation-timing-function: linear; |
| } |
| #bow-top .text span { |
| padding-right: 0.1em; |
| 304,21 → 247,7 |
| background-color: #000; |
| } |
| /* 0.0 to 0.5 s */ |
| @-webkit-keyframes footer { |
| from { |
| left: 90%; |
| border-top-left-radius: 0; |
| border-bottom-left-radius: 0; |
| } |
| } |
| .empty.fade-in #footer { |
| -webkit-animation-name: footer; |
| -webkit-animation-duration: 0.5s; |
| -webkit-animation-timing-function: linear; |
| } |
| .empty #footer { |
| position: absolute; |
| bottom: 0; |
| 347,24 → 276,6 |
| text-overflow: ellipsis; |
| } |
| /* 0.0 to 0.5 s */ |
| @-webkit-keyframes footer-text { |
| from { |
| opacity: 0; |
| } |
| /* shortly before 0.5 s */ |
| 99% { |
| opacity: 0; |
| } |
| } |
| .empty.fade-in #footer .text { |
| -webkit-animation-name: footer-text; |
| -webkit-animation-duration: 0.5s; |
| -webkit-animation-timing-function: linear; |
| } |
| .empty #footer .text span { |
| padding-right: 0.1em; |
| background-color: #000; |
| 399,24 → 310,6 |
| background-color: #999; |
| } |
| /* 0.0 to 0.625 s */ |
| @-webkit-keyframes bow-top-left { |
| from { |
| height: 0; |
| } |
| /* at 0.5 s */ |
| 80% { |
| height: 0; |
| } |
| } |
| .fade-in #bow-top-left { |
| -webkit-animation-name: bow-top-left; |
| -webkit-animation-duration: 0.625s; |
| -webkit-animation-timing-function: linear; |
| } |
| .empty #bow-top-left { |
| display: none; |
| } |
| 435,7 → 328,7 |
| display: none; |
| } |
| #LCARS .menu-container { |
| .menu-container { |
| position: fixed; |
| left: 0.2em; |
| top: 5.6em; |
| 445,35 → 338,12 |
| overflow: auto; |
| } |
| #LCARS .menu |
| .menu |
| { |
| height: 17.6em; |
| background-color: #000; |
| } |
| /* 0.0 to 1.125 s */ |
| @-webkit-keyframes bow-menu { |
| from { |
| opacity: 0; |
| } |
| /* at ca. 0.61875 s */ |
| 55% { |
| opacity: 0; |
| } |
| 56% { |
| opacity: 1; |
| } |
| } |
| .fade-in #LCARS .menu |
| { |
| -webkit-animation-name: bow-menu; |
| -webkit-animation-duration: 1.125s; |
| -webkit-animation-timing-function: linear; |
| } |
| .menu ul { |
| margin: 0 0.2em 0.2em 0; |
| padding: 0; |
| 550,10 → 420,6 |
| height: 2em; |
| background-color: #7d7d7d; /* c9c */ |
| color: #000 !important; |
| font-family: "LCARS", |
| Haettenschweiler, "Downloadable Haettenschweiler", |
| "Zurich XCn BT", "Downloadable Zurich XCn BT", |
| impact, Verdana, Geneva, Arial, Helvetica, sans-serif; |
| text-decoration: none !important; |
| text-transform: uppercase; |
| overflow: hidden; |
| 605,6 → 471,8 |
| line-height: 1; |
| background-color: #9cf; |
| color: #000 !important; |
| text-overflow: ellipsis; |
| white-space: nowrap; |
| } |
| .multi-display |
| /trunk/styles/lcars-ani.css |
|---|
| 0,0 → 1,212 |
| <?php |
| namespace de\pointedears\css\least; |
| // \header('Last-Modified: ' . gmdate('D, d M Y H:i:s', @filemtime(__FILE__)) . ' GMT'); |
| // |
| // /* Cached resource expires in HTTP/1.1 caches 24h after last retrieval */ |
| // \header('Cache-Control: max-age=86400, s-maxage=86400, must-revalidate, proxy-revalidate'); |
| // |
| // /* Cached resource expires in HTTP/1.0 caches 24h after last retrieval */ |
| // \header('Expires: ' . gmdate('D, d M Y H:i:s', time() + 86400) . ' GMT'); |
| \header('Content-Type: text/css; charset=UTF-8'); |
| require_once 'css/least/Mixins.php'; |
| ?> |
| @CHARSET "UTF-8"; |
| /* 0.0 to 1.0 s */ |
| <?php |
| Mixins::keyframes('fade-in', |
| 'from { |
| opacity: 0; |
| } |
| /* at 0.25 s */ |
| 25% { |
| opacity: 0; |
| } |
| to { |
| opacity: 1; |
| }'); |
| ?> |
| body.fade-in { |
| /* TODO: Step-by-step display instead */ |
| /*-webkit-animation-name: fade-in;*/ |
| /* -webkit-animation-iteration-count: infinite; */ |
| } |
| /* 0.0 to 0.6 s */ |
| <?php |
| Mixins::keyframes('content', |
| 'from { |
| opacity: 0; |
| } |
| /* 0.6 s */ |
| 99% { |
| opacity: 0; |
| }'); |
| ?> |
| .empty.fade-in #content { |
| <?php |
| Mixins::animation('-name', 'content'); |
| Mixins::animation('-duration', '0.6s'); |
| Mixins::animation('-timing-function', 'linear'); |
| ?> |
| } |
| /* 0.0 to 0.5 s */ |
| <?php |
| Mixins::keyframes('bow-top', |
| 'from { |
| left: 90%; |
| border-top-left-radius: 0; |
| border-bottom-left-radius: 0; |
| border-top-right-radius: 1.2em; |
| border-bottom-right-radius: 1.2em; |
| }'); |
| ?> |
| .fade-in #bow-top { |
| <?php |
| Mixins::animation('-name', 'bow-top'); |
| Mixins::animation('-duration', '0.5s'); |
| Mixins::animation('-timing-function', 'linear'); |
| ?> |
| } |
| /* 0.0 to 0.5 s */ |
| <?php |
| Mixins::keyframes('bow-top-text', |
| 'from { |
| opacity: 0; |
| } |
| /* shortly before 1.0 s */ |
| 99% { |
| opacity: 0; |
| }'); |
| ?> |
| .fade-in #bow-top .text { |
| <?php |
| Mixins::animation('-name', 'bow-top-text'); |
| Mixins::animation('-duration', '0.5s'); |
| Mixins::animation('-timing-function', 'linear'); |
| ?> |
| } |
| /* 0.0 to 0.5 s */ |
| <?php |
| Mixins::keyframes('footer', |
| 'from { |
| left: 90%; |
| border-top-left-radius: 0; |
| border-bottom-left-radius: 0; |
| }'); |
| ?> |
| .empty.fade-in #footer { |
| <?php |
| Mixins::animation('-name', 'footer'); |
| Mixins::animation('-duration', '0.5s'); |
| Mixins::animation('-timing-function', 'linear'); |
| ?> |
| } |
| /* 0.0 to 0.5 s */ |
| <?php |
| Mixins::keyframes('footer-text', |
| 'from { |
| opacity: 0; |
| } |
| /* shortly before 0.5 s */ |
| 99% { |
| opacity: 0; |
| }'); |
| ?> |
| .empty.fade-in #footer .text { |
| <?php |
| Mixins::animation('-name', 'footer-text'); |
| Mixins::animation('-duration', '0.5s'); |
| Mixins::animation('-timing-function', 'linear'); |
| ?> |
| } |
| /* 0.0 to 0.625 s */ |
| <?php |
| Mixins::keyframes('bow-top-left', |
| 'from { |
| height: 0; |
| } |
| /* at 0.5 s */ |
| 80% { |
| height: 0; |
| }'); |
| ?> |
| .fade-in #bow-top-left { |
| <?php |
| Mixins::animation('-name', 'bow-top-left'); |
| Mixins::animation('-duration', '0.625s'); |
| Mixins::animation('-timing-function', 'linear'); |
| ?> |
| } |
| /* 0.0 to 1.125 s */ |
| <?php |
| Mixins::keyframes('menu-container', |
| 'from { |
| opacity: 0; |
| } |
| /* at ca. 0.61875 s */ |
| 55% { |
| opacity: 0; |
| } |
| 56% { |
| opacity: 1; |
| }'); |
| ?> |
| .fade-in .menu-container { |
| <?php |
| Mixins::animation('-name', 'menu-container'); |
| Mixins::animation('-duration', '1.125s'); |
| Mixins::animation('-timing-function', 'linear'); |
| ?> |
| } |
| /* 0.0 to 1.125 s */ |
| <?php |
| Mixins::keyframes('menu', |
| 'from { |
| opacity: 0; |
| } |
| /* at ca. 0.61875 s */ |
| 55% { |
| opacity: 0; |
| } |
| 56% { |
| opacity: 1; |
| }'); |
| ?> |
| .fade-in .menu |
| { |
| <?php |
| Mixins::animation('-name', 'menu'); |
| Mixins::animation('-duration', '1.125s'); |
| Mixins::animation('-timing-function', 'linear'); |
| ?> |
| } |
| Property changes: |
| Added: svn:mime-type |
| ## -0,0 +1 ## |
| +text/plain |
| \ No newline at end of property |
| Index: .htaccess |
| =================================================================== |
| --- .htaccess (nonexistent) |
| +++ .htaccess (revision 50) |
| @@ -0,0 +1,3 @@ |
| +<IfModule mod_php5.c> |
| + AddHandler application/x-httpd-php .css |
| +</IfModule> |