Initial commit
This commit is contained in:
		
							
								
								
									
										64
									
								
								web/spinner.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										64
									
								
								web/spinner.css
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,64 @@ | ||||
| /* Chase spinner from https://tobiasahlin.com/spinkit/. MIT license */ | ||||
| .sk-center-wrapper { | ||||
|     width: 100%; | ||||
|     display: flex; | ||||
|     justify-content: space-around; | ||||
| } | ||||
|  | ||||
| .sk-chase { | ||||
|   position: relative; | ||||
|   animation: sk-chase 2.5s infinite linear both; | ||||
| } | ||||
|  | ||||
| .sk-chase-dot { | ||||
|   width: 100%; | ||||
|   height: 100%; | ||||
|   position: absolute; | ||||
|   left: 0; | ||||
|   top: 0; | ||||
|   animation: sk-chase-dot 2.0s infinite ease-in-out both; | ||||
| } | ||||
|  | ||||
| .sk-chase-dot:before { | ||||
|   content: ''; | ||||
|   display: block; | ||||
|   width: 25%; | ||||
|   height: 25%; | ||||
|   border-radius: 100%; | ||||
|   animation: sk-chase-dot-before 2.0s infinite ease-in-out both; | ||||
|   background-color: #FFF; | ||||
| } | ||||
|  | ||||
| .sk-chase.green > .sk-chase-dot:before { | ||||
|     background-color: #00C853; | ||||
| } | ||||
|  | ||||
| .sk-chase-dot:nth-child(1) { animation-delay: -1.1s; } | ||||
| .sk-chase-dot:nth-child(2) { animation-delay: -1.0s; } | ||||
| .sk-chase-dot:nth-child(3) { animation-delay: -0.9s; } | ||||
| .sk-chase-dot:nth-child(4) { animation-delay: -0.8s; } | ||||
| .sk-chase-dot:nth-child(5) { animation-delay: -0.7s; } | ||||
| .sk-chase-dot:nth-child(6) { animation-delay: -0.6s; } | ||||
| .sk-chase-dot:nth-child(1):before { animation-delay: -1.1s; } | ||||
| .sk-chase-dot:nth-child(2):before { animation-delay: -1.0s; } | ||||
| .sk-chase-dot:nth-child(3):before { animation-delay: -0.9s; } | ||||
| .sk-chase-dot:nth-child(4):before { animation-delay: -0.8s; } | ||||
| .sk-chase-dot:nth-child(5):before { animation-delay: -0.7s; } | ||||
| .sk-chase-dot:nth-child(6):before { animation-delay: -0.6s; } | ||||
|  | ||||
| @keyframes sk-chase { | ||||
|   100% { transform: rotate(360deg); } | ||||
| } | ||||
|  | ||||
| @keyframes sk-chase-dot { | ||||
|   80%, 100% { transform: rotate(360deg); } | ||||
| } | ||||
|  | ||||
| @keyframes sk-chase-dot-before { | ||||
|   50% { | ||||
|     transform: scale(0.4); | ||||
|   } | ||||
|   100%, 0% { | ||||
|     transform: scale(1.0); | ||||
|   } | ||||
| } | ||||
		Reference in New Issue
	
	Block a user
	 Tulir Asokan
					Tulir Asokan