Security News
The Push to Ban Ransom Payments Is Gaining Momentum
Ransomware costs victims an estimated $30 billion per year and has gotten so out of control that global support for banning payments is gaining momentum.
@momsfriendlydevco/animate
Advanced tools
Readme
Stock animations for Angular.
Demo.
Use NPM to grab the repo
npm install mfdc-animations
Add the main CSS library somewhere in your HTML:
A demo is also available. To use this follow the instructions in the demo directory.
This library is intended to be separated into atomic CSS components. To use combine one optional primary effect, one optional reflow and any number of modifiers.
Type | Class | Description |
---|---|---|
Base | animate | The base animation class. This must be present on any item that will animate |
Primary Effect | animate-fade | Apply a simple fade in / out effect |
animate-fly-DIRECTION | Apply a fade-in and fly-in effect from the specified direction. Direction can be: up , down , left , right | |
animate-shake | Shake the element as it appears / disappears | |
Reflow | animate-reflow-width | Resize the elements width while animating |
animate-reflow-height | Resize the elements height while animating. This is ideal for vertical lists or use within tables | |
animate-reflow-scale | Scale the entire element while animating. This class is recommended for reflow as it is GPU accelerated | |
Modifier / Delay | animate-delay-TIME | Modify the animation start time. Time can be: 0ms (default), 10ms , 20ms , 30ms , 40ms , 50ms , 100ms , 200ms , 500ms , 1s , 2s , 5s , 10s , 20s , 30s |
Modifier / Duration | animate-duration-TIME | Modify the animation time. Time can be: 10ms , 20ms , 30ms , 40ms , 50ms , 100ms , 200ms , 500ms (default), 1s , 2s , 5s , 10s , 20s , 30s |
Modifier / Easing | animate-easing-EASE | Modify the animation easing. Ease can be: linear , ease , ease-in , ease-out (default), ease-in-out |
Modifier / Repeat | animate-repeat-REPEAT | Modify how many times the animation will loop. Repeat can be: loop , 1 (default), 2 , 3 , 4 , 5 |
ng-repeat
items need to have a track by
or an entire copy of the DOM tree is copied after the current node. Basically if your list appears to not remove items from the middle - you're missing a track by
clause.FAQs
Stock animations for Angular
We found that @momsfriendlydevco/animate demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Ransomware costs victims an estimated $30 billion per year and has gotten so out of control that global support for banning payments is gaining momentum.
Application Security
New SEC disclosure rules aim to enforce timely cyber incident reporting, but fear of job loss and inadequate resources lead to significant underreporting.
Security News
The Python Software Foundation has secured a 5-year sponsorship from Fastly that supports PSF's activities and events, most notably the security and reliability of the Python Package Index (PyPI).