Better init screen
This commit is contained in:
		
							parent
							
								
									034c96d070
								
							
						
					
					
						commit
						e166ad6780
					
				|  | @ -42,7 +42,7 @@ html | |||
| 			| JavaScriptを有効にしてください | ||||
| 			br | ||||
| 			| Please turn on your JavaScript | ||||
| 		div#ini: p | ||||
| 			span . | ||||
| 			span . | ||||
| 			span . | ||||
| 		div#ini. | ||||
| 			<svg viewBox="0 0 50 50"> | ||||
| 				<path fill=#{themeColor} d="M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z" /> | ||||
| 			</svg> | ||||
|  |  | |||
|  | @ -32,42 +32,30 @@ body > noscript { | |||
| 	left: 0; | ||||
| 	width: 100%; | ||||
| 	height: 100%; | ||||
| 	text-align: center; | ||||
| 	background: #fff; | ||||
| 	cursor: wait; | ||||
| } | ||||
| 	#ini > p { | ||||
| 		display: block; | ||||
| 		user-select: none; | ||||
| 		margin: 32px; | ||||
| 		font-size: 4em; | ||||
| 		color: #555; | ||||
| 	#ini > svg { | ||||
| 		position: absolute; | ||||
| 		top: 0; | ||||
| 		right: 0; | ||||
| 		bottom: 0; | ||||
| 		left: 0; | ||||
| 		margin: auto; | ||||
| 		width: 64px; | ||||
| 		height: 64px; | ||||
| 		animation: ini 0.6s infinite linear; | ||||
| 	} | ||||
| 		#ini > p > span { | ||||
| 			animation: ini 1.4s infinite ease-in-out both; | ||||
| 		} | ||||
| 		#ini > p > span:nth-child(1) { | ||||
| 			animation-delay: 0s; | ||||
| 		} | ||||
| 		#ini > p > span:nth-child(2) { | ||||
| 			animation-delay: 0.16s; | ||||
| 		} | ||||
| 		#ini > p > span:nth-child(3) { | ||||
| 			animation-delay: 0.32s; | ||||
| 		} | ||||
| 
 | ||||
| html[data-darkmode] #ini { | ||||
| 	background: #191b22; | ||||
| } | ||||
| 	html[data-darkmode] #ini > p { | ||||
| 		color: #fff; | ||||
| 	} | ||||
| 
 | ||||
| @keyframes ini { | ||||
| 	0%, 80%, 100% { | ||||
| 		opacity: 1; | ||||
| 	from { | ||||
| 		transform: rotate(0deg); | ||||
| 	} | ||||
| 	40% { | ||||
| 		opacity: 0; | ||||
| 	to { | ||||
| 		transform: rotate(360deg); | ||||
| 	} | ||||
| } | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue