MediaWiki:Common.css: Difference between revisions

Jump to navigation Jump to search
no edit summary
No edit summary
No edit summary
Line 10: Line 10:
     #f44336 75% 100%
     #f44336 75% 100%
   );
   );
  transition: background 0.3s ease; /* Добавлено для плавного перехода */
}
.ring-chart27:hover {
  filter: brightness(1.1); /* Подсветка при наведении */
}
}


Line 47: Line 42:
   font-size: 14px;
   font-size: 14px;
   cursor: pointer; /* Указатель на элемент */
   cursor: pointer; /* Указатель на элемент */
  transition: background 0.3s ease; /* Плавный переход для фона */
}
}


.ring-chart27 ul li:nth-child(1) {  
.ring-chart27 ul li:nth-child(1) {  
   top: 5%; left: 50%; transform: translateX(-50%);  
   top: 5%; left: 50%; transform: translateX(-50%);  
   background: #4caf50; /* Добавлено фоновое цвет для первого сегмента */
   background: transparent; /* Прозрачный фон для первого сегмента */
  border-radius: 50%; /* Округление для эффекта подсветки */
  transition: background 0.3s ease; /* Плавный переход */
}
}


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


.ring-chart27 ul li:nth-child(2) {  
.ring-chart27 ul li:nth-child(2) {  
   top: 50%; right: 5%; transform: translateY(-50%);  
   top: 50%; right: 5%; transform: translateY(-50%);  
   background: #ff9800; /* Цвет для второго сегмента */
   background: transparent; /* Прозрачный фон для второго сегмента */
  border-radius: 50%;
  transition: background 0.3s ease;
}
}


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


.ring-chart27 ul li:nth-child(3) {  
.ring-chart27 ul li:nth-child(3) {  
   bottom: 5%; left: 50%; transform: translateX(-50%);  
   bottom: 5%; left: 50%; transform: translateX(-50%);  
   background: #2196f3; /* Цвет для третьего сегмента */
   background: transparent; /* Прозрачный фон для третьего сегмента */
  border-radius: 50%;
  transition: background 0.3s ease;
}
}


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


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


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


Navigation menu