56 lines
996 B
CSS
56 lines
996 B
CSS
|
|
.donut1 {
|
|
width: 106px;
|
|
height: 106px;
|
|
border-radius: 50%;
|
|
background: linear-gradient(90deg, #D82EB5 0.52%, #9245FD 103.83%);
|
|
}
|
|
.donut1.spin {
|
|
animation: rotate1 1s linear infinite;
|
|
}
|
|
|
|
.donut2 {
|
|
width: 76px;
|
|
height: 76px;
|
|
border-radius: 50%;
|
|
background: linear-gradient(90deg, #D82EB5 0.52%, #9245FD 103.83%);
|
|
position: relative;
|
|
left: 15px;
|
|
top: 15px;
|
|
}
|
|
.donut2.spin {
|
|
background: linear-gradient(270deg, #D82EB5 0.52%, #9245FD 103.83%);
|
|
animation: rotate1 1s linear infinite;
|
|
}
|
|
|
|
.donut3 {
|
|
width: 46px;
|
|
height: 46px;
|
|
border-radius: 50%;
|
|
background: linear-gradient(90deg, #D82EB5 0.52%, #9245FD 103.83%);
|
|
position: relative;
|
|
left: 15px;
|
|
top: 15px;
|
|
}
|
|
.donut3.spin {
|
|
animation: rotate1 1s linear infinite;
|
|
}
|
|
|
|
.dot {
|
|
width: 16px;
|
|
height: 16px;
|
|
border-radius: 50%;
|
|
background: #351A4B;
|
|
position: relative;
|
|
left: 15px;
|
|
top: 15px;
|
|
}
|
|
|
|
@keyframes rotate1 {
|
|
0% {
|
|
transform: rotate(0deg);
|
|
}
|
|
100% {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|