* 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: trunk/styles/.htaccess |
=================================================================== |
--- trunk/styles/.htaccess (nonexistent) |
+++ trunk/styles/.htaccess (revision 50) |
@@ -0,0 +1,3 @@ |
+<IfModule mod_php5.c> |
+ AddHandler application/x-httpd-php .css |
+</IfModule> |