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:
.ring-table {
/* Circular Table Styling */
.circular-table {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  grid-template-rows: repeat(8, 1fr);
   position: relative;
   position: relative;
   width: 300px;
   width: 300px;
Line 5: Line 9:
   border-radius: 50%;
   border-radius: 50%;
   overflow: hidden;
   overflow: hidden;
   background: transparent;
   margin: auto;
}
}


.pie-slice {
.circular-table a {
   position: absolute;
   position: absolute;
   width: 100%;
   width: 100%;
   height: 100%;
   height: 100%;
  clip-path: polygon(50% 50%, 0% 100%, 100% 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-weight: bold;
}
}


.slice1 {  
.circular-table div {
   background-color: #D02019;
   position: absolute;
   transform: rotate(0deg);
  width: 100%;
  height: 100%;
  clip-path: polygon(50% 50%, 0 100%, 100% 100%);
   transform-origin: center;
  transition: background-color 0.6s ease, filter 0.6s ease;
}
}
.slice2 {
 
  background-color: #D08019;
.circular-table div:hover {
  transform: rotate(60deg);
   filter: brightness(1.2);
}
   opacity: 1;
.slice3 {
  background-color: #D0D019;
  transform: rotate(120deg);
}
.slice4 {  
   background-color: #80D019;
  transform: rotate(180deg);
}
.slice5 {
  background-color: #19D0D0;
  transform: rotate(240deg);
}
.slice6 {
  background-color: #1919D0;
   transform: rotate(300deg);
}
}




Navigation menu