@import './theme.css';

html, body, #app {
	height: 100%;
}

.app-loading {
	 height: 100%;
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 flex-direction: column;
	 background-color: var(--public-background-color);
	 color: var(--public-color-text-primary);
}
 .app-loading__logo {
	 background: url('../images/tmpl-logo.svg');
	 width: 140px;
	 height: 140px;
	 background-size: cover;
}
 .app-loading__title, .app-loading__tips {
	 margin: 0;
}
 .app-loading__title {
	 font-weight: 700;
	 font-size: 18px;
	 font-size: 24px;
	 margin-top: -5px;
}
 .app-loading .app-loading__tips {
	 color: var(--public-color-text-secondary);
	 font-size: 16px;
	 margin-top: 8px;
}
 @keyframes spin {
	 0% {
		 transform: rotate(0deg);
	}
	 25% {
		 transform: rotate(90deg);
	}
	 50% {
		 transform: rotate(180deg);
	}
	 75% {
		 transform: rotate(270deg);
	}
	 100% {
		 transform: rotate(360deg);
	}
}
 .app-loading__spin {
	 margin-top: 24px;
	 animation: spin 1s linear infinite;
	 width: 24px;
	 height: 24px;
	 background: url('~@/assets/img/loading.png') center center no-repeat;
	 background-size: contain;
}
 .preloader .loading {
	 background: url('~@/assets/img/im/loading.png') no-repeat center;
	 animation: spin 1s linear infinite;
	 margin: 0 auto;
	 display: block;
	 width: 25px;
	 height: 25px;
	 background-size: 25px;
}
 .preloader .el-loading-text {
	 margin-top: 7px;
}
 @keyframes spin {
	 from {
		 transform: rotate(0);
	}
	 to {
		 transform: rotate(360deg);
	}
}