primer/css
1
1
Fork 0
mirror of https://github.com/primer/css.git synced 2024-12-01 12:42:32 +03:00
Code Issues Projects Releases Wiki Activity

Add fade out css

Browse Source
This commit is contained in:
Sophie Shepherd 2017-10-19 12:13:39 -05:00
parent c18b8d0838
commit aee148332e
1 changed files with 23 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
modules/primer-utilities/lib/animations.scss
View File

@ -1,7 +1,7 @@
// This file contains reusable animations for github.
// stylelint-disable primer/selector-no-utility
// Fade in
// A class to fade in an element on the page.
/* Fade in an element */
.anim-fade-in {
animation-name: fade-in;
animation-duration: 1s;
@ -22,6 +22,27 @@
}
}
/* Fade out an element */
.anim-fade-out {
animation-name: fade-out;
animation-duration: 1s;
animation-timing-function: ease-out;
&.fast {
animation-duration: 0.3s;
}
}
@keyframes fade-out {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
/* Fade in and slide up an element */
.anim-fade-up {
opacity: 0;