src/main/resources/static/assets/sass/atlantis/components/_loader.scss

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

.loader, .is-loading:after {
	display: block;
	width: 1.5rem;
	height: 1.5rem;
	background: transparent;
	border: 3px solid $secondary-color;
	border-bottom-color: transparent;
	border-radius: 50%;
	animation: 1s spin linear infinite;
}

.loader-lg, .is-loading-lg:after {
	width: 2rem;
	height: 2rem;
	border-width: 5px;
}

.loader-sm, .is-loading-sm:after {
	width: 1rem;
	height: 1rem;
	border-width: 2px;
}

.is-loading {
	position: relative;
	color: transparent !important;
	> * {
		opacity: 0.2 !important;
	}
	&:after {
		position: absolute;
		top: calc(50% - 1.5rem/2);
		left: calc(50% - 1.5rem/2);
		content: '';
	}
}

.is-loading-lg:after {
	top: calc(50% - 2rem/2);
	left: calc(50% - 2rem/2);
}

.is-loading-sm:after {
	top: calc(50% - 1rem/2);
	left: calc(50% - 1rem/2);
}

%loader-borderbottom-color {
	border-bottom-color: transparent !important;
}

@mixin loader-state($color) {
	border-color: $color;
	@extend %loader-borderbottom-color;
}

%loader-btn-and-card-bgnotwhite {
	border-color: #fff;
	@extend %loader-borderbottom-color;
}