MediaWiki:Common.css: Difference between revisions

Jump to navigation Jump to search
no edit summary
No edit summary
No edit summary
Line 25: Line 25:
     font-family: 'MyCustomFont2', sans-serif; /* Шрифт */
     font-family: 'MyCustomFont2', sans-serif; /* Шрифт */
     color: #333; /* Цвет текста */
     color: #333; /* Цвет текста */
     position: relative; /* Для позиционирования таблички */
     position: relative; /* Для позиционирования псевдоэлемента */
}
}


/* Эффект при наведении */
.copyable-text:hover {
.copyable-text:hover {
     background-color: #CFC8B2; /* Цвет фона при наведении */
     background-color: #CFC8B2; /* Цвет фона при наведении */
Line 39: Line 40:
}
}


/* Стиль для таблички "Copied" */
/* Стиль для текста "Copied" через псевдоэлемент */
.copyable-text .copied-tooltip {
.copyable-text.copied::after {
     position: fixed; /* Позиционирование относительно окна браузера */
    content: "Copied"; /* Текст "Copied" */
     position: absolute;
    top: -25px; /* Расположение над элементом */
    left: 50%;
    transform: translateX(-50%); /* Центрируем по горизонтали */
     background-color: #D02019; /* Красный фон */
     background-color: #D02019; /* Красный фон */
     color: white; /* Белый текст */
     color: white; /* Белый текст */
Line 47: Line 52:
     border-radius: 5px;
     border-radius: 5px;
     font-size: 0.8em;
     font-size: 0.8em;
    pointer-events: none; /* Чтобы табличка не мешала взаимодействию */
     opacity: 0; /* Изначально скрыт */
     opacity: 0; /* Изначально скрыта */
     transition: opacity 0.3s ease; /* Плавное исчезновение */
     transition: opacity 0.3s ease; /* Плавное исчезновение */
    z-index: 1000; /* Чтобы быть поверх других элементов */
}
}


/* Показываем текст "Copied" и запускаем анимацию исчезновения */
.copyable-text.copied::after {
    opacity: 1;
    animation: fadeOut 1.3s forwards; /* Анимация исчезновения */
}
/* Анимация для плавного исчезновения */
@keyframes fadeOut {
    0% { opacity: 1; }
    77% { opacity: 1; } /* 77% от 1.3s = ~1s, текст виден 1 секунду */
    100% { opacity: 0; }
}


/* Kitchen Sink Logo*/
/* Kitchen Sink Logo*/

Navigation menu

Help

Help Image

Here's pages that you can help us to get more information about them.

Stand with Ukraine

Ukrainian Flag