search

tobiasahlin / SpinKit

A collection of loading indicators animated with CSS
http://tobiasahlin.com/spinkit/
MIT License
19.35k stars 1.81k forks source link

Add New "Shards" Spinner #149

Open kartikcho opened 4 years ago

kartikcho commented 4 years ago

I have been reading your css animation tutorials for the past couple days and wanted to add my own spinner to your amazing work.

This is the spinner in action: sk-shards

kartikcho commented 4 years ago

I would appreciate a code review as I have a few questions to ask.

I tried to begin with a full connected triangle animation but calc() wasn't giving correct size with a few decimal pixels error. The calculated border size should be 20 in this case. Screenshot: Screenshot (88)

Also there are a few recurring attributes that could be applied to every shard child but I don't know how other than defining a new class with those attributes. Would really appreciate your help, thanks.