Анимированный градиент текста боковой панели менеджера ресурсов

XenForo Анимированный градиент текста боковой панели менеджера ресурсов

Совместимость с XenForo
  1. 2.2.x
Добавляем код в шаблон extra.less
CSS:
$0
.resourceSidebarGroup .pairs--justified:nth-child(1) dt  {
    background-image: linear-gradient(to right, #fd1d1d, #fcb045, #2a54b3, #1b9b9b, #45d8fc, #5245fc, #af45fc);
    color: transparent;
    background-size: 200% 200%;
    -webkit-animation: magic 3s infinite linear alternate;
    -moz-animation: magic 3s infinite linear alternate;
    -ms-animation: magic 3s infinite linear alternate;
    -o-animation: magic 3s infinite linear alternate;
    animation: magic 3s infinite linear alternate;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
}
.resourceSidebarGroup .pairs--justified:nth-child(2) dt  {
    background-image: linear-gradient(to right, #fd1d1d, #fcb045, #fcef45, #81fc45, #45d8fc, #5245fc, #af45fc);
    color: transparent;
    background-size: 200% 200%;
    -webkit-animation: magic 3s infinite linear alternate;
    -moz-animation: magic 3s infinite linear alternate;
    -ms-animation: magic 3s infinite linear alternate;
    -o-animation: magic 3s infinite linear alternate;
    animation: magic 3s infinite linear alternate;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
}
.resourceSidebarGroup .pairs--justified:nth-child(3) dt  {
    background-image: linear-gradient(to right, #fd1d1d, #9990f5, #80ffe2, #457dfc, #45d8fc, #5245fc, #af45fc);
    color: transparent;
    background-size: 200% 200%;
    -webkit-animation: magic 3s infinite linear alternate;
    -moz-animation: magic 3s infinite linear alternate;
    -ms-animation: magic 3s infinite linear alternate;
    -o-animation: magic 3s infinite linear alternate;
    animation: magic 3s infinite linear alternate;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
}
.resourceSidebarGroup .pairs--justified:nth-child(4) dt  {
    color: transparent;
    background-image: linear-gradient(to right, #fd1d1d, #fcb045, #fcef45, #81fc45, #45d8fc, #5245fc, #af45fc);
    background-size: 200% 200%;
    -webkit-animation: magic 3s infinite linear alternate;
    -moz-animation: magic 3s infinite linear alternate;
    -ms-animation: magic 3s infinite linear alternate;
    -o-animation: magic 3s infinite linear alternate;
    animation: magic 3s infinite linear alternate;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
}
.resourceSidebarGroup .pairs--justified:nth-child(5) dt  {
    background-image: linear-gradient(to right, #fd1d1d, #9990f5, #80ffe2, #457dfc, #45d8fc, #5245fc, #af45fc);
    color: transparent;
    background-size: 200% 200%;
    -webkit-animation: magic 3s infinite linear alternate;
    -moz-animation: magic 3s infinite linear alternate;
    -ms-animation: magic 3s infinite linear alternate;
    -o-animation: magic 3s infinite linear alternate;
    animation: magic 3s infinite linear alternate;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
}
.resourceSidebarGroup .pairs--justified:nth-child(6) dt  {
    background-image: linear-gradient(to right, #fd1d1d, #9990f5, #80ffe2, #45d2fc, #45d8fc, #5245fc, #f9fc45);
    color: transparent;
    background-size: 200% 200%;
    -webkit-animation: magic 3s infinite linear alternate;
    -moz-animation: magic 3s infinite linear alternate;
    -ms-animation: magic 3s infinite linear alternate;
    -o-animation: magic 3s infinite linear alternate;
    animation: magic 3s infinite linear alternate;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    -ms-background-clip: text;
    -o-background-clip: text;
    background-clip: text;
}
@keyframes magic {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 100% 100%;
    }
}
dsf33.gif
Автор
Groot
Просмотры
46
Первый выпуск
Обновление

Рейтинги

0.00 звёзд Оценок: 0

Ещё ресурсы от Groot

  • [TC] Paid Resources
    XenForo [TC] Paid Resources
    Данное дополнение позволит вам продавать ресурсы в XenForo Resource Manager
  • [ZD] Improved Routes
    XenForo [ZD] Improved Routes
    Красивые внутренние URL и пользовательские ссылки на профили и темы.
  • [XB] Thread Chapters
    XenForo [XB] Thread Chapters
    Улучшайте темы вашего форума, объединяя их в виде глав для беспрепятственного рассказывания историй
  • [ZD] Improved Style
    XenForo [ZD] Improved Style
    Незначительные улучшения в поведении стилей и отображении элементов.
  • [Xen-Soluce] Avatar Gallery
    XenForo [Xen-Soluce] Avatar Gallery
    Разрешите своим пользователям выбирать себе аватары из предоставленной вами галереи аватаров.

Поделиться этим ресурсом

Назад
Верх
TeknolojiTeknoloji ForumuTeknoloji Sitesi