XF 2.2 Как изменить фон?

[Jason_Catrel]

Доброго времени суток, как изменить данную категорию? (Скрин в низу), а именно фон краску и т.д, чтобы вставить свою или изменить на другую.

 

[Kokiyo]

Настройки стиля -> Блоки -> Заголовок блока

 

[Виталий Васильевич]

чтобы вставить свою или изменить на другую.

А вам нужно для каждого раздела отдельный цвет или фон?

 

[Jason_Catrel]

А вам нужно для каждого раздела отдельный цвет или фон?

Да

 

[LUX-MEBEL]

Доброго времени суток, как изменить данную категорию? (Скрин в низу), а именно фон краску и т.д, чтобы вставить свою или изменить на другую.
Посмотреть вложение 152986

.block.block--category.block--category150 {
    border: 2px solid orange!important;
    padding: 3px !important;
    border-radius: 2px !important;
    box-shadow: 0 3px 2px rgba(0,0,0,.1)!important;
}
.block.block--category.block--category150 .block-header {
    background: orange!important;
    border-bottom: 3px solid orange!important;
    border-left: 1px solid orange!important;
    border-right: 1px solid orange!important;
    border-top: 1px solid orange!important;
}

150 - это ID категории.

 

[Jason_Catrel]

.block.block--category.block--category150 {
    border: 2px solid orange!important;
    padding: 3px !important;
    border-radius: 2px !important;
    box-shadow: 0 3px 2px rgba(0,0,0,.1)!important;
}
.block.block--category.block--category150 .block-header {
    background: orange!important;
    border-bottom: 3px solid orange!important;
    border-left: 1px solid orange!important;
    border-right: 1px solid orange!important;
    border-top: 1px solid orange!important;
}

150 - это ID категории.

Это водить в extra?

 

[LUX-MEBEL]

Jason_Catrel, Да, но лучше сделать модификацию.

 

[Jason_Catrel]

Jason_Catrel, Да, но лучше сделать модификацию.

Понял, а как узнавать айди?

 

[Efremov]

Понял, а как узнавать айди?

Зайти в нее, и посмотреть в строке адреса

 

[25517]

LUX-MEBEL, потом из-за таких "помощников" приходится переделывать.
Чтобы extra.less не был полотном трудночитаемого нечто.

---
Сначала прописываем этот код в extra.less вашего стиля.

.customCategoryBackground(@categoryId, @color, @background)
{
    .block--category@{categoryId}
    {
        .block-header
        {
            color: @color;
            background: @background;
        }
    }
}

Затем, используем написанную функцию.
Где первый параметр - id категории, второй - цвет текста, третий - цвет фона.
Функцию можно модифицировать на своё усмотрение, добавляя border и т.п.

.customCategoryBackground(1, #bcdef5, #185886);
.customCategoryBackground(78, white, fade(#185886, 25%));
.customCategoryBackground(88, red, linear-gradient(90deg, rgb(64,57,194) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%));

 

[Jason_Catrel]

LUX-MEBEL, потом из-за таких "помощников" приходится переделывать.
Чтобы extra.less не был полотном трудночитаемого нечто.

---
Сначала прописываем этот код в extra.less вашего стиля.

.customCategoryBackground(@categoryId, @color, @background)
{
    .block--category@{categoryId}
    {
        .block-header
        {
            color: @color;
            background: @background;
        }
    }
}

Затем, используем написанную функцию.
Где первый параметр - id категории, второй - цвет текста, третий - цвет фона.
Функцию можно модифицировать на своё усмотрение, добавляя border и т.п.

.customCategoryBackground(1, #bcdef5, #185886);
.customCategoryBackground(78, white, fade(#185886, 25%));
.customCategoryBackground(88, red, linear-gradient(90deg, rgb(64,57,194) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%));

Посмотреть вложение 153102

Я задаю глупый вопрос, но куда ввести 2 код, чутка не понятно

 

[LUX-MEBEL]

Jason_Catrel, Тоже в extra.less

Всё это будет выглядеть, так:

.customCategoryBackground(1, #bcdef5, #185886);
.customCategoryBackground(78, white, fade(#185886, 25%));
.customCategoryBackground(88, red, linear-gradient(90deg, rgb(64,57,194) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%));

.customCategoryBackground(@categoryId, @color, @background)
{
    .block--category@{categoryId}
    {
        .block-header
        {
            color: @color;
            background: @background;
        }
    }
}

 

[Jason_Catrel]

Jason_Catrel, Тоже в exnre.less

Всё это будет выглядеть, так:

.customCategoryBackground(1, #bcdef5, #185886);
.customCategoryBackground(78, white, fade(#185886, 25%));
.customCategoryBackground(88, red, linear-gradient(90deg, rgb(64,57,194) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%));

.customCategoryBackground(@categoryId, @color, @background)
{
    .block--category@{categoryId}
    {
        .block-header
        {
            color: @color;
            background: @background;
        }
    }
}

Спасибо всем большое за помощь, сейчас протестирую

 

[Jason_Catrel]

Ничего не поменялось

Jason_Catrel, Тоже в exnre.less

Всё это будет выглядеть, так:

.customCategoryBackground(1, #bcdef5, #185886);
.customCategoryBackground(78, white, fade(#185886, 25%));
.customCategoryBackground(88, red, linear-gradient(90deg, rgb(64,57,194) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%));

.customCategoryBackground(@categoryId, @color, @background)
{
    .block--category@{categoryId}
    {
        .block-header
        {
            color: @color;
            background: @background;
        }
    }
}

 

[25517]

Jason_Catrel, значит делаете что-то не так.
Либо в стиле есть какие-то изменения

 

[LUX-MEBEL]

Jason_Catrel, в extra.less исправил название шаблона. Может вы и скопировали с ошибкой названия шаблона? Так там его такого нет.