Изменение цветов в разделах форума

[CabinetAdmin]

Вот например многие на форуме гуру утверждают, что править стиль нельзя, нужно решать поставленные задачи через расширения.
Я, имхо, считаю это глупостью, поскольку стиль, это не файлы движка, которые по замыслу обновляются простой заменой. Да и расширений не наберёшься на каждую правку. Стиль можно обновить и вручную, особенно легко это будет тем, у кого был форум на 3.0 с модами.

Да, самый простой способ это просто заменить картинку bg_header.gif, что лежит в папке images, плюс под новую картинку надо изменить основной цвет. Получается так, сверху, там где название категорий, это изображение, а снизу просто цвет.
Меняется это в файле colours.css, начиная с 60 строки:

Код: Выделить всё

.forabg {
	background-color: #0076b1;
	background-image: url("./images/bg_list.gif");
}

.forumbg {
	background-color: #12A3EB;
	background-image: url("./images/bg_header.gif");
}

Первый код, это цвет разделов на главной странице.
Второй, это при просмотре форума, плюс на главной странице в списке последних тем.

Меняем цвета и изображения на свои. В случае если изображения должно повторяться, т.е. не имеет как у родной картинки градиента, то находим в файле common.css:

Код: Выделить всё

.forabg {
	background: transparent none repeat-x 0 0;
	margin-bottom: 4px;
	padding: 5px;
	clear: both;
	border-radius: 7px;
}

.forumbg {
	background: transparent none repeat-x 0 0;
	margin-bottom: 4px;
	padding: 5px;
	clear: both;
	border-radius: 7px;
}

Строка 239. В найденном repeat-x меняем на repeat.


Второй вариант. Можно заменить изображения на css3 градиент.
Для этого код в colours.css (дан выше) меняем на:

Код: Выделить всё

.forabg {
	background: #2B85B2;
	background-image: -moz-linear-gradient(top, #236CA1, #34A0C6);
	background-image: -webkit-linear-gradient(top, #236CA1, #34A0C6);
	background-image: -o-linear-gradient(top, #236CA1, #34A0C6);
	background-image: linear-gradient(to bottom, #236CA1, #34A0C6);
}

.forumbg {
	background: #2B85B2;
	background-image: -moz-linear-gradient(top, #236CA1, #34A0C6);
	background-image: -webkit-linear-gradient(top, #236CA1, #34A0C6);
	background-image: -o-linear-gradient(top, #236CA1, #34A0C6);
	background-image: linear-gradient(to bottom, #236CA1, #34A0C6);
}

Все основные браузеры понимающие css3 будут показывать градиент, старые однотонный цвет, заданный в первых строках кода.

Цветовую гамму подбираем по своему вкусу. Для подпора цветов можно воспользоваться нашим удобным инструментом - Онлайн градиент генератор.