MediaWiki:Common.css: Difference between revisions

Jump to navigation Jump to search
no edit summary
No edit summary
No edit summary
Line 15: Line 15:
}
}


.mw-parser-output .copyable-text {
.copyable-text {
     display: inline-block; /* Делаем текст блочно-строчным для корректного отображения */
     background-color: #EFE9DE; /* Цвет фона, как в вашем дизайне */
     padding: 5px 10px; /* Небольшой отступ для удобства клика */
     border: 2px solid #722215; /* Рамка, как в вашем дизайне */
     background-color: #f0f0f0; /* Светлый фон для выделения */
     padding: 5px 10px; /* Внутренние отступы */
     border: 1px solid #ccc; /* Рамка для визуального выделения */
     display: inline-block; /* Для компактного отображения */
     border-radius: 4px; /* Скругленные углы */
     border-radius: 5px; /* Скругленные углы */
     cursor: pointer; /* Курсор в виде указателя, как у ссылки */
     cursor: pointer; /* Курсор в виде указателя, чтобы показать, что текст кликабельный */
     user-select: none; /* Запрещаем выделение текста при клике */
     transition: background-color 0.3s ease, border-color 0.3s ease; /* Плавный переход для эффекта */
     transition: background-color 0.2s ease; /* Плавное изменение фона при клике */
     font-family: 'MyCustomFont2', sans-serif; /* Шрифт из вашего дизайна */
    color: #333; /* Цвет текста, как в .licontent .li-body */
}
}


.mw-parser-output .copyable-text:hover {
.copyable-text:hover {
     background-color: #e0e0e0; /* Цвет фона при наведении */
     background-color: #CFC8B2; /* Цвет фона при наведении, как в вашем дизайне */
    border-color: #D02019; /* Цвет рамки при наведении, как в вашем дизайне */
}
}


.mw-parser-output .copyable-text:active {
/* Стиль для уведомления о копировании */
     background-color: #d0d0d0; /* Цвет фона при клике */
.copyable-text.copied::after {
    content: "Скопировано!";
    position: absolute;
    top: -25px;
    left: 50%;
    transform: translateX(-50%);
     background-color: #D02019; /* Красный фон уведомления */
    color: white; /* Белый текст */
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 0.8em;
    opacity: 0;
    transition: opacity 0.3s ease;
}
 
.copyable-text.copied::after {
    opacity: 1;
}
}


Navigation menu

Help

Help Image

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

Stand with Ukraine

Ukrainian Flag