Welcome!

By registering with us, you'll be able to discuss, share and private message with other members of our community.

SignUp Now!

Решено Линие на категорию форума.

  • Автор темы Alone Devman
  • Дата начала
Статус
В этой теме нельзя размещать новые ответы.
A

Alone Devman

Приветствую, недавно начал заниматься стилем io dark, и встрял такой огромный вопрос, как сделать вот эти линии на категории форума, впервые работаю с данным стилем, и не сильно понимаю че к чему 🤔)
1749145330546.jpg
 
Решение
Less:
.block.block--category
{
    .block-header
    {
        position: relative;

        &:after
        {
            content: '';
            background: url(@xf-uix_imagePath/io/images/swirl.png);
            background-size: cover;
            background-position: center;
            position: absolute;
            height: 100%;
            width: 100%;
            z-index: 1;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            display: block;
            mix-blend-mode: overlay;
            pointer-events: none;
        }
    }
}

@xf-uix_imagePath - настройка стиля, где указан путь путь с папкой картинок. Настройки стиля - Основные настройки - Image path
Ноя
1,794
5,051
Команда форума
Администратор
Less:
.block.block--category
{
    .block-header
    {
        position: relative;

        &:after
        {
            content: '';
            background: url(@xf-uix_imagePath/io/images/swirl.png);
            background-size: cover;
            background-position: center;
            position: absolute;
            height: 100%;
            width: 100%;
            z-index: 1;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            display: block;
            mix-blend-mode: overlay;
            pointer-events: none;
        }
    }
}

@xf-uix_imagePath - настройка стиля, где указан путь путь с папкой картинок. Настройки стиля - Основные настройки - Image path
 
A

Alone Devman

Less:
.block.block--category
{
    .block-header
    {
        position: relative;

        &:after
        {
            content: '';
            background: url(@xf-uix_imagePath/io/images/swirl.png);
            background-size: cover;
            background-position: center;
            position: absolute;
            height: 100%;
            width: 100%;
            z-index: 1;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            display: block;
            mix-blend-mode: overlay;
            pointer-events: none;
        }
    }
}

@xf-uix_imagePath - настройка стиля, где указан путь путь с папкой картинок. Настройки стиля - Основные настройки - Image path
Не поменялось нечего..
 
Ноя
1,794
5,051
Команда форума
Администратор
Не поменялось нечего..
Код не сработал, потому что в пути к картинке с линиями используется настройка стиля uix_imagePath. Я всего-лишь показал, как это реализовано в стиле IO. Путь к картинке у вас есть, вы можете скачать её оттуда, либо перенести в нужную папку стиля. Или, если на сервере уже есть файлы стиля IO, просто указать корректный путь: styles/io_dark/io/images/swirl.png
 
Статус
В этой теме нельзя размещать новые ответы.
Сверху