8,960
edits
MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
no edit summary
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
.circle { | |||
width: 200px; | |||
height: 200px; | |||
border-radius: 50%; | |||
position: relative; | |||
animation: spin 5s linear infinite; | |||
list-style-type: none; | |||
} | |||
.segment { | |||
width: 50%; | |||
height: 50%; | |||
position: absolute; | |||
background-color: transparent; | |||
clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 0); | |||
} | |||
.segment:nth-child(1) { | |||
background-color: red; | |||
top: 0; | |||
left: 0; | |||
} | |||
.segment:nth-child(2) { | |||
background-color: blue; | |||
top: 0; | |||
left: 50%; | |||
transform: rotate(90deg); | |||
transform-origin: top left; | |||
} | |||
.segment:nth-child(3) { | |||
background-color: green; | |||
top: 50%; | |||
left: 50%; | |||
transform: rotate(180deg); | |||
transform-origin: top left; | |||
} | |||
.segment:nth-child(4) { | |||
background-color: yellow; | |||
top: 50%; | |||
left: 0; | |||
transform: rotate(270deg); | |||
transform-origin: top left; | |||
} | |||
@keyframes spin { | |||
from { | |||
transform: rotate(0deg); | |||
} | |||
to { | |||
transform: rotate(360deg); | |||
} | |||
} | |||
.hole { | .hole { | ||
position: absolute; | position: absolute; | ||