Stryda logo
Framework
v1.0.116

Animation

.animate-scale-in-x-right
.animate-scale-in-x-left
.animate-scale-out-x-right
.animate-scale-out-x-left
A
B
A
B
B
Battle Pass
Points
1120
Position
#243
Waiting for your 3 matches...
15 000
15 000

You can cancel all repeating animations within a specific element by adding the.reduced-motion class name to it.

In this example, the shining button is not animating.

You can control the motion based on the screen size using the following class name: .{xx}:reduced-motion or .{xx}:normal-motion.
{xx} can be xs, sm, md, lg, xl.

In this example, the shining button is not animated below 768px (md)