superstar-dice/_src/plugin/loading/loading.vue

<template>
  <transition name="fade">
    <div class="mod-loading" v-show="show">
		<i class="icon loading-icon"></i>
    </div>
  </transition>
</template>

<style lang="scss">
.mod-loading{
	position: fixed;
	z-index: 5000;
	width: 80px;
	height: 80px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	border-radius: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: rgba($color: #000000, $alpha: .6);
	.loading-icon{
		background: url('img/loading.png') center center no-repeat;
		background-size: 100%;
		width: 50px;
		height: 50px;
		animation: rotate 1.7s linear infinite;
	}
}

@keyframes rotate {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}
</style>