Template:Progress ring/ProgressRing.css: Difference between revisions

From Portals of Phereon Wiki
Content added Content deleted
m (Replaced content with ".radial-progress { position: relative; border-radius: 50%; } .radial-progress .circle .mask, .radial-progress .circle .fill, .radial-progress .circle .shadow { width:...")
Tag: Replaced
mNo edit summary
Line 11: Line 11:
position: absolute;
position: absolute;
border-radius: 50%;
border-radius: 50%;
}

.radial-progress .circle .mask,
.radial-progress .circle .fill {
-webkit-backface-visibility: hidden;
transition: -webkit-transform 2s;
transition: -ms-transform 2s;
transition: transform 2s;
}
}



Revision as of 06:25, 25 December 2020

.radial-progress {
	position: relative;
	border-radius: 50%;
}

.radial-progress .circle .mask,
.radial-progress .circle .fill,
.radial-progress .circle .shadow {
	width: 100%;
	height: 100%;
	position: absolute;
	border-radius: 50%;
}

.radial-progress .inset {
	position: absolute;
	border-radius: 50%;
}

.radial-progress .inset .percentage {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}

.radial-progress .inset .percentage .numbers span {
	font-weight: 800;
}