Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vineyardbovines/styled-components-animations
a whole bunch of keyframe animations using styled-components
https://github.com/vineyardbovines/styled-components-animations
animation keyframes styled-components
Last synced: 9 days ago
JSON representation
a whole bunch of keyframe animations using styled-components
- Host: GitHub
- URL: https://github.com/vineyardbovines/styled-components-animations
- Owner: vineyardbovines
- License: mit
- Created: 2018-11-29T18:32:08.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2023-12-15T02:26:32.000Z (11 months ago)
- Last Synced: 2024-10-16T09:30:03.693Z (about 1 month ago)
- Topics: animation, keyframes, styled-components
- Language: JavaScript
- Size: 9.77 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# styled-components-animations
a whole bunch of keyframes for different animations / transitions.
## usage
```
yarn add styled-components-animations
```
```
import styled from 'styled-components'
import { rotate } from 'styled-components-animations'
const Loader = styled.div`
animation: ${rotate} infinite 1s linear;
`
```
## api
available keyframes:
- rotate
- flash
- shake
- bounce
- tada
- swing
- wobble
- wiggle
- pulse
- flip
- flipInX
- flipOutX
- flipInY
- flipOutY
- fadeIn
- fadeInUp
- fadeInDown
- fadeInLeft
- fadeInRight
- fadeOut
- fadeOutUp
- fadeOutDown
- fadeOutLeft
- fadeOutRight
- bounceIn
- bounceInUp
- bounceInDown
- bounceInLeft
- bounceInRight
- easeInLeft
- easeOutLeft
- easeInRight
- easeOutRight
- bounceOut
- bounceOutDown
- bounceOutUp
- bounceOutLeft
- bounceOutRight
- scaleIn
- scaleOut
- rotateIn
- rotateOut
- lightspeedIn
- lightspeedOut
- hingeLeft
- hingeRight
- rollIn
- rollOut
- dropDown
- dropUp
---
init'd with [golf](https://github.com/gretzky/golf)
```
```