Шаблон:Кнопка игровая/styles.css: различия между версиями

URim (обсуждение | вклад)
Отменена версия 333, сделанная URim (обсуждение)
URim (обсуждение | вклад)
Нет описания правки
Строка 8: Строка 8:
     text-decoration: none;
     text-decoration: none;
      
      
     /* Новые координаты для срезанных углов:
     /* Точный срез углов (фаски):  
       1. Левый верхний: прямой (0% 0%)
       1. Верхний край: отступ слева для язычка, срез справа
       2. Правый верхний: со срезом (скрещен с помощью уменьшения ширины на 10px)
       2. Нижний край: срез слева для ответной части, правый угол прямой */
      3. Правый нижний: прямой (100% 100%)
     clip-path: polygon(
      4. Левый нижний: со срезом (смещен вправо на 10px) */
        12px 0%,         /* Левый верхний выступ */
     clip-path: polygon(0% 0%, calc(100% - 10px) 0%, 100% 100%, 10px 100%);
        calc(100% - 12px) 0%, /* Правый верхний скос (фаска) */
        100% 12px,        /* Доводим до правого края */
        100% 100%,       /* Правый нижний угол */
        0% 100%,          /* Левый нижний угол */
        0% 12px          /* Левый вертикальный упор */
    );
      
      
     transition: background-color 0.2s ease;
     transition: background-color 0.2s ease;

Версия от 14:27, 7 октября 2026

.mw-custom-game-button {
    display: inline-block;
    background-color: #3b4259;
    color: #ffffff;
    font-family: inherit;
    font-size: 14px;
    padding: 6px 20px;
    text-decoration: none;
    
    /* Точный срез углов (фаски): 
       1. Верхний край: отступ слева для язычка, срез справа
       2. Нижний край: срез слева для ответной части, правый угол прямой */
    clip-path: polygon(
        12px 0%,          /* Левый верхний выступ */
        calc(100% - 12px) 0%, /* Правый верхний скос (фаска) */
        100% 12px,        /* Доводим до правого края */
        100% 100%,        /* Правый нижний угол */
        0% 100%,          /* Левый нижний угол */
        0% 12px           /* Левый вертикальный упор */
    );
    
    transition: background-color 0.2s ease;
}

.mw-custom-game-button:hover {
    background-color: #4c5573;
    color: #ffffff;
}