animation test

m3dev · Jun 21, 2024 · d59cb7a · d59cb7a
1 parent ad2d3d4
commit d59cb7a
Showing 1 changed file with 1 addition and 64 deletions.
diff --git a/torisetsu/src/jsMain/kotlin/components/pages/TopPageStyle.kt b/torisetsu/src/jsMain/kotlin/components/pages/TopPageStyle.kt
@@ -1,6 +1,5 @@
 package components.pages
 
-import org.jetbrains.compose.web.ExperimentalComposeWebApi
 import org.jetbrains.compose.web.css.*
 import style.GlobalStyle
 import style.forMobile
@@ -123,26 +122,13 @@ object TopPageStyle : StyleSheet(GlobalStyle) {
         }
     }
 
-    @OptIn(ExperimentalComposeWebApi::class)
-    private val rotationKeyframes by keyframes {
-        each(0.percent) { transform { rotate(0.deg) } }
-        each(10.percent) { transform { rotate(360.deg) } }
-        each(100.percent) { transform { rotate(360.deg) } }
-    }
-
     val leftBirds by style {
         position(Position.Absolute)
         bottom(0.px)
         width(100.percent)
         property("object-fit", "contain")
         property("object-position", "right")
 
-        animation(rotationKeyframes) {
-            duration(50.s)
-            timingFunction(AnimationTimingFunction.Linear)
-            iterationCount(null)
-            delay(15.s)
-        }
         media("prefers-reduced-motion") {
             self style {
                 property("animation-name", "none")
@@ -159,12 +145,6 @@ object TopPageStyle : StyleSheet(GlobalStyle) {
         property("object-fit", "contain")
         property("object-position", "right")
 
-        animation(rotationKeyframes) {
-            duration(50.s)
-            timingFunction(AnimationTimingFunction.Linear)
-            iterationCount(null)
-            delay(5.s)
-        }
         media("prefers-reduced-motion") {
             self style {
                 property("animation-name", "none")
@@ -197,12 +177,6 @@ object TopPageStyle : StyleSheet(GlobalStyle) {
         property("object-fit", "contain")
         property("object-position", "right")
 
-        animation(rotationKeyframes) {
-            duration(50.s)
-            timingFunction(AnimationTimingFunction.Linear)
-            iterationCount(null)
-            delay(10.s)
-        }
         media("prefers-reduced-motion") {
             self style {
                 property("animation-name", "none")
@@ -246,12 +220,6 @@ object TopPageStyle : StyleSheet(GlobalStyle) {
         width(100.percent)
         maxWidth(2000.px)
 
-        animation(rotationKeyframes) {
-            duration(50.s)
-            timingFunction(AnimationTimingFunction.Linear)
-            iterationCount(null)
-            delay(25.s)
-        }
         media("prefers-reduced-motion") {
             self style {
                 property("animation-name", "none")
@@ -266,12 +234,7 @@ object TopPageStyle : StyleSheet(GlobalStyle) {
         width(65.percent)
         maxWidth(1000.px)
 
-        animation(rotationKeyframes) {
-            duration(50.s)
-            timingFunction(AnimationTimingFunction.Linear)
-            iterationCount(null)
-            delay(20.s)
-        }
+
         media("prefers-reduced-motion") {
             self style {
                 property("animation-name", "none")
@@ -295,12 +258,6 @@ object TopPageStyle : StyleSheet(GlobalStyle) {
             }
         }
 
-        animation(rotationKeyframes) {
-            duration(50.s)
-            timingFunction(AnimationTimingFunction.Linear)
-            iterationCount(null)
-            delay(30.s)
-        }
         media("prefers-reduced-motion") {
             self style {
                 property("animation-name", "none")
@@ -316,21 +273,6 @@ object TopPageStyle : StyleSheet(GlobalStyle) {
         }
     }
 
-    @OptIn(ExperimentalComposeWebApi::class)
-    private val vibrateKeyframes by keyframes {
-        each(0.percent) { transform { translateX(-50.percent) } }
-        each(10.percent) { transform { translateX(-49.percent) } }
-        each(20.percent) { transform { translateX(-51.percent) } }
-        each(30.percent) { transform { translateX(-49.percent) } }
-        each(40.percent) { transform { translateX(-51.percent) } }
-        each(50.percent) { transform { translateX(-49.percent) } }
-        each(60.percent) { transform { translateX(-51.percent) } }
-        each(70.percent) { transform { translateX(-49.percent) } }
-        each(80.percent) { transform { translateX(-51.percent) } }
-        each(90.percent) { transform { translateX(-49.percent) } }
-        each(100.percent) { transform { translateX(-50.percent) } }
-    }
-
     val centerBirds by style {
         position(Position.Fixed)
         bottom(20.px) // footerの高さ分あげる
@@ -347,11 +289,6 @@ object TopPageStyle : StyleSheet(GlobalStyle) {
             }
         }
 
-        animation(vibrateKeyframes) {
-            duration(20.s)
-            timingFunction(AnimationTimingFunction.Linear)
-            iterationCount(null)
-        }
         media("prefers-reduced-motion") {
             self style {
                 property("animation-name", "none")