From 92d61755b37fc66f2652014e8ebdad11034ba7b7 Mon Sep 17 00:00:00 2001
From: Jeff Atwood <jatwood@codinghorror.com>
Date: Thu, 25 Dec 2014 02:29:39 -0800
Subject: [PATCH] clean up CSS3 animations a bit
---
app/assets/stylesheets/common/base/modal.scss | 6 ++++++
app/assets/stylesheets/desktop/modal.scss | 16 ++--------------
app/assets/stylesheets/desktop/topic-post.scss | 3 +--
.../vendor/font_awesome/_spinning.scss | 4 ++--
4 files changed, 11 insertions(+), 18 deletions(-)
diff --git a/app/assets/stylesheets/common/base/modal.scss b/app/assets/stylesheets/common/base/modal.scss
index dc9cde6fd..8e35ab13b 100644
--- a/app/assets/stylesheets/common/base/modal.scss
+++ b/app/assets/stylesheets/common/base/modal.scss
@@ -38,6 +38,12 @@
from {opacity: 0}
to {opacity: .8}
}
+
+@-webkit-keyframes fade {
+ from {opacity: 0}
+ to {opacity: 1}
+}
+
.modal-outer-container {
display:table;
width:100%;
diff --git a/app/assets/stylesheets/desktop/modal.scss b/app/assets/stylesheets/desktop/modal.scss
index b51f8a750..ae3c1f80a 100644
--- a/app/assets/stylesheets/desktop/modal.scss
+++ b/app/assets/stylesheets/desktop/modal.scss
@@ -25,20 +25,8 @@
}
.modal.in {
- -webkit-animation: modal .25s;
- animation: modal .25s;
-}
-
-//fade in and animate up
-
-@-webkit-keyframes modal {
- from {opacity: 0}
- to {opacity: 1}
-}
-
-@keyframes fade {
- from {opacity: 0}
- to {opacity: 1}
+ -webkit-animation: fade .25s;
+ animation: fade .25s;
}
.modal-body {
diff --git a/app/assets/stylesheets/desktop/topic-post.scss b/app/assets/stylesheets/desktop/topic-post.scss
index b134adf7b..b2ec22dfc 100644
--- a/app/assets/stylesheets/desktop/topic-post.scss
+++ b/app/assets/stylesheets/desktop/topic-post.scss
@@ -525,8 +525,7 @@ video {
.star, .badge-wrapper, i, .topic-link:not(.loading) {
-webkit-animation: fadein .7s;
- animation-duration: .7s;
- animation-name: fadein;
+ animation: fadein .7s;
}
.topic-statuses {
diff --git a/app/assets/stylesheets/vendor/font_awesome/_spinning.scss b/app/assets/stylesheets/vendor/font_awesome/_spinning.scss
index 8eace8526..e51b9d0b9 100644
--- a/app/assets/stylesheets/vendor/font_awesome/_spinning.scss
+++ b/app/assets/stylesheets/vendor/font_awesome/_spinning.scss
@@ -7,8 +7,8 @@
}
@keyframes spin {
- 0% { transform: rotate(0deg); -webkit-transform: rotate(0deg); }
- 100% { transform: rotate(359deg); -webkit-transform: rotate(359deg); }
+ 0% { transform: rotate(0deg); }
+ 100% { transform: rotate(359deg); }
}
@-webkit-keyframes spin {