Анимированные заголовки блоков

[tocsetpos]

Данная модификация позволит сделать анимированные заголовки блоков
В шаблон extra.less

// Основные переменные цветов
@90lvru-blurple: #5865F2;
@90lvru-green: #57F287;
@90lvru-fuchsia: #EB459E;

// Анимация градиента
@keyframes fireGradient {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

// Стиль для всех блоков с анимированной верхней границей
.block {
    position: relative;
    overflow: hidden;
  
    &::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 3px;
        background: linear-gradient(90deg, @90lvru-green, @90lvru-blurple, @90lvru-fuchsia);
        background-size: 200% 200%;
        animation: fireGradient 3s ease infinite;
    }
}

// Адаптация для мобильных устройств
@media (max-width: 900px) {
    .block::before {
        height: 2px;
    }
}