Animated Red Bar and Circle Loading Indicators
Adding the classname of dk-loading or dk-loading-circle to the body of a page will display a 3 pixel tall red animated gradient or 150 pixel circle gradient animation onto the page. This will also add css opacity:0.5 to the page for all divs except the header, flymenu and footer.
Skeleton Animated Cards
The classname of dk-skeleton will add a left to right animated background color to whatever element it is added to. Example below is added to a dk-card div. Remove the classname when the content is loaded to stop the animation. This classname had a min-height of 40px attached, other layout styles will need to be added per project.
Code Example:
<div className="dk-skeleton dk-card"></div>
Code Preview:
Circular Spinner
A div with the classname of dk-loading-circle will add
Icon Spinner
A div with the classname of dk-loading-icon will add an inline circular loading animation using an icon. This element will need to be shown/hidden per use.
Code Example:
<div className="dk-loading-icon"></div>