Skip to content

Instantly share code, notes, and snippets.

@zlwaterfield

zlwaterfield/Dynamic and Responsive SVG - Keyframes.scss

Last active October 26, 2019 22:17
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save zlwaterfield/34775f7d2dcbcdda0c746d3be3cdf837 to your computer and use it in GitHub Desktop.
Save zlwaterfield/34775f7d2dcbcdda0c746d3be3cdf837 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Dynamic and Responsive SVG - Keyframes.scss
$timeline-num-line-items: 10;
$timeline-item-transition-delay: 0.5s;
.timeline.is-visible {
animation: draw ($timeline-num-line-items * $timeline-item-transition-delay - $timeline-item-transition-delay) $timeline-item-transition-delay * 3 1 linear forwards;
}
@keyframes draw {
100% {
stroke-dashoffset: 0;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment