forked from fediversity/fediversity
		
	Add infinite spinner
This commit is contained in:
		
							parent
							
								
									f50ee049f2
								
							
						
					
					
						commit
						1164518a48
					
				
					 2 changed files with 25 additions and 0 deletions
				
			
		| 
						 | 
				
			
			@ -3,3 +3,24 @@ body
 | 
			
		|||
  margin: 0
 | 
			
		||||
  font-family: sans-serif
 | 
			
		||||
  box-sizing: border-box
 | 
			
		||||
 | 
			
		||||
.loader
 | 
			
		||||
  width: 48px
 | 
			
		||||
  height: 48px
 | 
			
		||||
  border: 5px solid #000
 | 
			
		||||
  border-bottom-color: #FF3D00
 | 
			
		||||
  border-radius: 50%
 | 
			
		||||
  display: inline-block
 | 
			
		||||
  box-sizing: border-box
 | 
			
		||||
  animation: rotation 1s linear infinite
 | 
			
		||||
 | 
			
		||||
@keyframes rotation
 | 
			
		||||
  0% { transform: rotate(0deg) }
 | 
			
		||||
  100% { transform: rotate(360deg) }
 | 
			
		||||
 | 
			
		||||
#spinner-container
 | 
			
		||||
  position: absolute
 | 
			
		||||
  top: 50%
 | 
			
		||||
  left: 50%
 | 
			
		||||
  transform: translate(-50%, -50%)
 | 
			
		||||
  display: block
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -7,5 +7,9 @@
 | 
			
		|||
 | 
			
		||||
  <button class="button" type="submit" name="deploy">Deploy</button>
 | 
			
		||||
  <button class="button" type="submit" name="save">Save</button>
 | 
			
		||||
 | 
			
		||||
  <div id="spinner-container">
 | 
			
		||||
    <span class="loader"></span>
 | 
			
		||||
  </div>
 | 
			
		||||
</form>
 | 
			
		||||
{% endblock %}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
	Add table
		
		Reference in a new issue