diff options
Diffstat (limited to 'www/css')
-rw-r--r-- | www/css/anim.css | 31 | ||||
-rw-r--r-- | www/css/index.css | 27 |
2 files changed, 28 insertions, 30 deletions
diff --git a/www/css/anim.css b/www/css/anim.css index e89959d..f6a321b 100644 --- a/www/css/anim.css +++ b/www/css/anim.css @@ -1,40 +1,21 @@ -@-webkit-keyframes dissolvein { - 0% { opacity: 0; } - 100% { opacity: 1; } -} -@-moz-keyframes dissolvein { - 0% { opacity: 0; } - 100% { opacity: 1; } -} -@keyframes dissolvein { - 0% { opacity: 0; } - 100% { opacity: 1; } -} -@-webkit-keyframes dissolveout { - 0% { opacity: 1; } - 100% { opacity: 0; } -} -@-moz-keyframes dissolveout { - 0% { opacity: 1; } - 100% { opacity: 0; } -} -@keyframes dissolveout { - 0% { opacity: 1; } - 100% { opacity: 0; } -} - @-webkit-keyframes blink { 0% { opacity: 0; } + 25% { opacity: 0; } 50% { opacity: 1; } + 75% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes blink { 0% { opacity: 0; } + 25% { opacity: 0; } 50% { opacity: 1; } + 75% { opacity: 1; } 100% { opacity: 0; } } @keyframes blink { 0% { opacity: 0; } + 25% { opacity: 0; } 50% { opacity: 1; } + 75% { opacity: 1; } 100% { opacity: 0; } } diff --git a/www/css/index.css b/www/css/index.css index 1f147a7..cf58427 100644 --- a/www/css/index.css +++ b/www/css/index.css @@ -68,7 +68,6 @@ html.audio #warn li#audio { display: none; } #warn li#opus { display: none; } html.fontface #warn li#fontface { display: none; } html.csstransforms #warn li#csstransforms { display: none; } -html.csstransitions #warn li#csstransitions { display: none; } #gotit { text-align: center; } @@ -166,13 +165,31 @@ html.no-js #gotit { display: block; margin: 10px 8px; } -#ctc, #nvlctc { +.ctc { position: absolute; bottom: 20px; right: 10px; - -webkit-animation: blink 2s infinite; - -moz-animation: blink 2s infinite; - animation: blink 2s infinite; + width: 16px; + height: 16px; + background-image: url("../dump/ui/ctc.png"); + -o-animation: blink 2s infinite linear; + -moz-animation: blink 2s infinite linear; + -webkit-animation: blink 2s infinite linear; + animation: blink 2s infinite linear; +} +.apng .ctc { + background-image: url("../dump/ui/ctc_anim.png"); + -o-animation: none; + -moz-animation: none; + -webkit-animation: none; + animation: none; +} +.webpanimation .ctc { + background-image: url("../dump/ui/ctc_anim.webp"); + -o-animation: none; + -moz-animation: none; + -webkit-animation: none; + animation: none; } #nvlctc { bottom: 25px; |