Создаём свой собственный стиль для phpBBex на основе встроенного Prosilver

Список разделов phpBBex 1.x (поддерживается) Мастерская 1.x

Описание: Только готовые решения! Статьи, заметки, моды и другие полезности для phpBBex 1.x и phpBB 3.0.x.
Модератор: Поддержка

Сообщение #21 JoteRuso » 28.04.2013, 16:05

Scrypto, да, так лучше.

colours.css
со 162-ой строки
Код: Выделить всё
.pagination span strong {
   color: #FFFFFF;
   background-color: #4692BF;
   border-color: #4692BF;
}

.pagination span a, .pagination span a:link, .pagination span a:visited {
   color: #5C758C;
   background-color: #ECEDEE;
   border-color: #B4BAC0;
}

.pagination span a:hover {
   border-color: #368AD2;
   background-color: #368AD2;
   color: #FFF;
}

.pagination span a:active {
   color: #5C758C;
   background-color: #ECEDEE;
   border-color: #B4BAC0;
}

и потом ещё, через строчку (если потребуется):
Код: Выделить всё
/* Pagination in viewforum for multipage topics */
.row .pagination {
   background-image: url("{T_THEME_PATH}/images/icon_pages.gif");
}

.row .pagination span a, li.pagination span a {
   background-color: #FFFFFF;
}

.row .pagination span a:hover, li.pagination span a:hover {
   background-color: #368AD2;
}

Экспериментируйте!
JoteRuso M
Автор темы
Аватара
Откуда: Москва, Россия
Репутация: 541
С нами: 11 лет 11 месяцев

Сообщение #22 Scrypto » 28.04.2013, 16:32

Спасибо. Буду пробовать.

Добавлено спустя 28 минут 13 секунд:
Все отлично )). Прошу желающих посмотреть сайт и посоветовать, что еще можно подкорректировать.
gamecheater.ru
Scrypto
Гость

Сообщение #23 JoteRuso » 28.04.2013, 17:11

Scrypto:Прошу желающих посмотреть сайт и посоветовать, что еще можно подкорректировать.
Первая же, кликнутая наугад, тема выявила пропущенный спойлер. Сама оболочка, фон поля и шрифт... Не сочетаются с общим тёмным фоном.
Изображение

Вы сначала сами по своему форуму побродите. Загляните во все уголки...

На главной странице (лично мне) белый шрифт режет глаза. Я бы заменил на серый. Но это лишь на мой взгляд.
JoteRuso M
Автор темы
Аватара
Откуда: Москва, Россия
Репутация: 541
С нами: 11 лет 11 месяцев

Сообщение #24 Scrypto » 28.04.2013, 17:17

Спасибо, подправил!
Scrypto
Гость

Сообщение #25 HD321kbps » 28.04.2013, 19:37

В менюшке подправь цвет не на белый и в темах под именем звездочки цвет тоже не вписывается. Сугубо мое мнение!
HD321kbps M
Аватара
Откуда: Армянск
Репутация: 376
С нами: 11 лет

Сообщение #26 VirtusOK » 29.04.2013, 09:48

Кто нибудь может выложить стили которые у вас получились для общего использования?
VirtusOK
Гость

Сообщение #27 VEG » 29.04.2013, 10:13

Маленький совет для облегчения переноса всех ваших модификаций. Рекомендую выносить все изменения в отдельный файл custom.css, который вы можете подключить в стиль, дописав в самый конец файла ./styles/prosilver/theme/stylesheet.css такую строку:
Код: Выделить всё
@import url("custom.css");

Пример выноса изменения во внешний файл. Допустим, вы хотите изменить цвета в таком блоке:
Код: Выделить всё
#wrap {
   padding: 0 20px;
   min-height: 100%;
   margin: 0 auto;
   background-color: #FFFFFF;
   box-shadow: 0 0 15px #CCCCCC;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
}

Копируем этот блок в ваш custom.css, а в исходном файле оставляем всё как было. Затем изменяем значения цветов на нужные, при этом строки, которые вы не изменяете, можно смело удалять — они подхватятся из оригинального места. То есть при изменении цветов в примере выше в custom.css вы добавите просто:
Код: Выделить всё
#wrap {
   background-color: #FF0000;
   box-shadow: 0 0 15px #CC0000;
}

Такая организация позволит вам легче делиться своими правками, ну и поддерживать тоже будет немного проще для вас (при обновлениях phpBBex).
VEG M
Администратор
Аватара
Откуда: Finland
Репутация: 1653
С нами: 11 лет 11 месяцев

Сообщение #28 JoteRuso » 29.04.2013, 18:24

VEG:Рекомендую выносить все изменения в отдельный файл custom.css, который вы можете подключить в стиль, дописав в самый конец файла ./styles/prosilver/theme/stylesheet.css
Идея хорошая и нужная. Факт.

Но, как всегда, есть парочка "но":

1) В случае использования custom.css - будьте аккуратны со своими рисунками. Не подменяйте ими стандартные!
Cвои рисунки заливайте и всегда храните под другими (отличающимися от оригинальных файлов стиля Prosilver) именами, и все пути к ним прописывайте в custom.css.
Иначе первое же обновление перезапишет все Ваши рисунки стандартными.

2) Использование файла custom.css равносильна использованию того-же переделанного стандартного стиля. В единственном экземпляре.
Даже если Вы создадите 10 файлов customXX.css - Вы всё равно сможете использовать лишь один из них.
Если кто-то планирует одновременно использовать разные стили и давать пользователям возможность их выбора - забудьте про custom.css. Это будет абсолютно бесполезный (с точки зрения одновременного использования разных стилей) файл.
Лучше создавайте разные стили на основе стандартного и экспортируйте их (для сохранности) через Админку себе на комп, либо в папку /store/ у вас на сервере.
Но это уже совсем другая история... :smile:

Если я где-то ошибся в логике применения кастомного файлика - поправьте.
Любая здоровая критика лишь приветствуется! :smoke:
JoteRuso M
Автор темы
Аватара
Откуда: Москва, Россия
Репутация: 541
С нами: 11 лет 11 месяцев

Сообщение #29 VEG » 30.04.2013, 02:45

JoteRuso, с custom.css вам будет проще обновлять созданные вами стили при выходе новых версий phpBBex. Шаблоны ведь при выходе каждой версии изменяются. То есть вы можете свободно создавать новые стили, но вносить в них правки лучше через отдельный css файл. Это конечно если у вас не глобальная переделка стиля, где нужно и вёрстку менять. Если же модификации стиля огромны (как у factotum) — то там одним custom.css не обойтись :)
VEG M
Администратор
Аватара
Откуда: Finland
Репутация: 1653
С нами: 11 лет 11 месяцев

Сообщение #30 JoteRuso » 30.04.2013, 11:45

VEG:custom.css вам будет проще обновлять созданные вами стили при выходе новых версий phpBBex.
Так с этим никто и не спорит :) Обновлять будет проще.
JoteRuso M
Автор темы
Аватара
Откуда: Москва, Россия
Репутация: 541
С нами: 11 лет 11 месяцев

Сообщение #31 Scrypto » 01.05.2013, 11:06

Привет всем. Хочется узнать как изменить цвет кнопок Поиск и Перейти?
Заранее спасибо.
Изображение
Scrypto
Гость

Сообщение #32 JoteRuso » 01.05.2013, 22:04

Scrypto:как изменить цвет кнопок Поиск и Перейти?
файл colours.css
с 877 строки и почти до конца.
Код: Выделить всё
a.button1, input.button1, a.button2, input.button2, button {
   color: #000;
   background: #e6e6e6 url("data:image/gif;base64,R0lGODlhBgAYALIAANXV1OPk5O7u7t3d3f///wAAAAAAAAAAACH5BAQAAAAALAAAAAAGABgAAAMYSLrQ/tCNSau9NOjNu99CKI5kaZ5oqpYJADs=");
}

a.button1.sending, input.button1.sending, a.button2.sending, input.button2.sending, button.sending {
   color: #666666 !important;
   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
   cursor: default !important;
   border-color: #666666 !important;
   background-image: url("data:image/gif;base64,R0lGODlhBgAYAMMHAL6+vtbW1szMzePj5MTEw93d3e7u7v///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQIAAAfACwAAAAABgAYAAAEMPCMeQ64IWMNcrhFSIwiWQhoiArTgLbvFLvxOhiegWf63vM64C4QBOaGP2IxmVTmIgAh+QQIAAAfACwAAAAABgAYAAAEMfCcQU8AONys+SVFSIDiGApoMaACxVJr68oxzBqGFuA6r+G5nQ/48wl7wWMxSBQyjREAIfkECAAAHwAsAAAAAAYAGAAABDHwyEFDANhioLMlRCGCYkGKQkqlwqoOLAW3rpwauBXkFr8bOhzwNxT2fMjhL8gzEi0RACH5BAgAAB8ALAAAAAAGABgAAAQycJw5RrggYx0yuERYjCIpjIUgVIO6tmrlyjHNCoGhX7px5T5eEPjrCYNG4HAnLC6ZxggAIfkECAAAHwAsAAAAAAYAGAAABDFwjEMHCBjcrPktRFiA4igIY3FKwyqdwuvCcixhRo7rQW5gvd8OyAsKfbtjcSkMEnMRACH5BAgAAB8ALAAAAAAGABgAAAQwcMhDAQjY4qCzLQUhgiIBCihYoNLASq/7ogL8bkaO5cauBzxczycUDoPAHzJZ9EUAADs=");
}

a.button1, input.button1 {
   border-color: #666666;
}

/* Alternative button */
a.button2, input.button2, button {
   border-color: #666666;
}

/* <a> button in the style of the form buttons */
a.button1, a.button1:link, a.button1:visited, a.button1:active, a.button2, a.button2:link, a.button2:visited, a.button2:active {
   color: #000000;
}

/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, button:hover {
   border-color: #BC2A4D;
   color: #BC2A4D;
}

input.search {
   background-image: url("{T_THEME_PATH}/images/icon_textbox_search.gif");
}

input.disabled, input[type=button][disabled], input[type=submit][disabled]
{
   border-color: #666666 !important;
   color: #666666 !important;
   text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}
Имейте в виду, что изменения затронут и другие кнопки этого типа.
JoteRuso M
Автор темы
Аватара
Откуда: Москва, Россия
Репутация: 541
С нами: 11 лет 11 месяцев

Сообщение #33 Scrypto » 06.05.2013, 09:45

JoteRuso, привет, можешь еще разок помочь? Как поменять цвет у надписей в форме редактирования сообщения. А то не видно их вообще.

Изображение

Добавлено спустя 26 секунд:
Там где статус темы и т.д.
Scrypto
Гость

Сообщение #34 JoteRuso » 06.05.2013, 11:35

Scrypto,
colours.css, 833 строка.
Код: Выделить всё
/* Definition list layout for forms
---------------------------------------- */
dd label {
   color: #333;
}
JoteRuso M
Автор темы
Аватара
Откуда: Москва, Россия
Репутация: 541
С нами: 11 лет 11 месяцев

Сообщение #35 VEG » 06.05.2013, 11:49

На самом деле лучше всё-таки освоить Firebug, чтобы за каждой мелочью не спрашивать у сообщества. Там на самом деле всё просто. Изучите инструмент Inspect — наводите им на интересующий блок, и все дела. В окошке справа внизу вы сможете редактировать свойства элемента. Как найдёте что изменять — ищите такой же блок в css файлах, и измените найденную строку там, чтобы закрепить изменение в вашем стиле.
VEG M
Администратор
Аватара
Откуда: Finland
Репутация: 1653
С нами: 11 лет 11 месяцев

Сообщение #36 Scrypto » 06.05.2013, 11:57

Спасибо всем, VEG тебе отдельное )
Scrypto
Гость

Сообщение #37 joker1t » 17.05.2013, 22:37

Всем привет.

Вопрос по нижней панели .navbar :
1) Как изменить цвет ссылок в этой панели?
2) Как изменить размер панели?

PS: Просто некогда разбираться. Заранее Спасибо за ответ. :smile:
joker1t
Репутация: 4
С нами: 10 лет 11 месяцев

Сообщение #38 JoteRuso » 19.05.2013, 01:09

joker1t:Вопрос по нижней панели .navbar :
1) Как изменить цвет ссылок в этой панели?
файл colours.css, 232 строка
Код: Выделить всё
--------------------------------------------------------------
Colours and backgrounds for links.css
-------------------------------------------------------------- */

a:link   { color: #105289; }
a:visited   { color: #105289; }
a:hover   { color: #D31141; }
a:active   { color: #368AD2; }
Имейте в виду, что изменения затронут бОльшую часть всех ссылок.

joker1t:2) Как изменить размер панели?
Не знаю. Не смог найти такого параметра.
JoteRuso M
Автор темы
Аватара
Откуда: Москва, Россия
Репутация: 541
С нами: 11 лет 11 месяцев

Сообщение #39 O_C_A » 19.05.2013, 21:29

JoteRuso:Я думаю, что очередные 1,5 литра допинга помогут довести задумку до победоносного финала.
А меня подобный допинг выгоняет из сайтостроительства в WoT ломать танки :)
O_C_A M
Аватара
Откуда: г. Тверь
Репутация: 3
С нами: 10 лет 11 месяцев

Сообщение #40 joker1t » 21.05.2013, 15:01

JoteRuso:Не знаю. Не смог найти такого параметра.
Спасибо за ответ. Уже разобрался :smile:
joker1t
Репутация: 4
С нами: 10 лет 11 месяцев

Пред.След.

Вернуться в Мастерская 1.x