MediaWiki:Common.css: Difference between revisions

Jump to navigation Jump to search

MediaWiki:Common.css (view source)

Revision as of 02:10, 11 October 2024

393 bytes added ,  11 October 2024
no edit summary
No edit summary
No edit summary
Line 42: Line 42:
   font-size: 14px;
   font-size: 14px;
   cursor: pointer; /* Указатель на элемент */
   cursor: pointer; /* Указатель на элемент */
  width: 50%; /* Ширина половины сегмента */
  height: 50%; /* Высота половины сегмента */
   transition: background 0.3s ease; /* Плавный переход для фона */
   transition: background 0.3s ease; /* Плавный переход для фона */
  border-radius: 0 100% 100% 0; /* Округление для создания полукруга */
  overflow: hidden;
}
}


.ring-chart27 ul li:nth-child(1) {  
.ring-chart27 ul li:nth-child(1) {
   top: 5%; left: 50%; transform: translateX(-50%);  
   top: 0;  
   background: transparent; /* Прозрачный фон для первого сегмента */
  left: 0;  
   background: #4caf50; /* Цвет для первого сегмента */
  transform: rotate(0deg); /* Начальный угол */
}
}


.ring-chart27 ul li:nth-child(1):hover {
.ring-chart27 ul li:nth-child(1):hover {
   background: rgba(76, 175, 80, 0.5); /* Подсветка при наведении */
   background: #66bb6a; /* Цвет подсветки для первого сегмента */
}
}


.ring-chart27 ul li:nth-child(2) {  
.ring-chart27 ul li:nth-child(2) {
   top: 50%; right: 5%; transform: translateY(-50%);  
   top: 0;  
   background: transparent; /* Прозрачный фон для второго сегмента */
  left: 0;  
   background: #ff9800; /* Цвет для второго сегмента */
  transform: rotate(90deg); /* Поворачиваем на 90 градусов */
}
}


.ring-chart27 ul li:nth-child(2):hover {
.ring-chart27 ul li:nth-child(2):hover {
   background: rgba(255, 152, 0, 0.5); /* Подсветка при наведении */
   background: #ffb74d; /* Цвет подсветки для второго сегмента */
}
}


.ring-chart27 ul li:nth-child(3) {  
.ring-chart27 ul li:nth-child(3) {
   bottom: 5%; left: 50%; transform: translateX(-50%);  
   top: 0;  
   background: transparent; /* Прозрачный фон для третьего сегмента */
  left: 0;  
   background: #2196f3; /* Цвет для третьего сегмента */
  transform: rotate(180deg); /* Поворачиваем на 180 градусов */
}
}


.ring-chart27 ul li:nth-child(3):hover {
.ring-chart27 ul li:nth-child(3):hover {
   background: rgba(33, 150, 243, 0.5); /* Подсветка при наведении */
   background: #64b5f6; /* Цвет подсветки для третьего сегмента */
}
}


.ring-chart27 ul li:nth-child(4) {  
.ring-chart27 ul li:nth-child(4) {
   top: 50%; left: 5%; transform: translateY(-50%);  
   top: 0;  
   background: transparent; /* Прозрачный фон для четвертого сегмента */
  left: 0;  
   background: #f44336; /* Цвет для четвертого сегмента */
  transform: rotate(270deg); /* Поворачиваем на 270 градусов */
}
}


.ring-chart27 ul li:nth-child(4):hover {
.ring-chart27 ul li:nth-child(4):hover {
   background: rgba(244, 67, 54, 0.5); /* Подсветка при наведении */
   background: #ef5350; /* Цвет подсветки для четвертого сегмента */
}
}


Retrieved from "https://twentyonewiki.info/index.php/Special:MobileDiff/9334"

Navigation menu