Создаем свой стиль на основе встроенного phphbbEx 2.0 (phpbb 3.1.*)

Board index phpBBex 2.x Мастерская

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

Post #41by Glenerg » 25.02.2017, 20:17

это где такая база64, не нашел?
Любая инструкция должна начинаться: Ну что дебил? -уже сломал!
Glenerg M
Мастер
Age: 38
Reputation: 22
With us: 1 year 7 months

Post #42by HD321kbps » 26.02.2017, 03:43

Glenerg wrote:это где такая база64, не нашел?
тут
HD321kbps M
Гуру
Avatar
Age: 26
Location: Армянск
Reputation: 322
With us: 4 yaers

Post #43by Glenerg » 26.02.2017, 12:21

где каринку кнопки найти?
Я так понимаю если сильно не парится и заменить картинку на картинку с точно таким же названием то будет работать
Любая инструкция должна начинаться: Ну что дебил? -уже сломал!
Glenerg M
Мастер
Age: 38
Reputation: 22
With us: 1 year 7 months

Post #44by Sumanai » 26.02.2017, 14:20

Никакого названия у этого изображения нет, оно закодировано и располагается в файле buttons.css вашего стиля, в селекторе #back-to-top, свойство background.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1519
With us: 4 yaers 2 months

Post #45by Glenerg » 26.02.2017, 15:23

Спасибо
Любая инструкция должна начинаться: Ну что дебил? -уже сломал!
Glenerg M
Мастер
Age: 38
Reputation: 22
With us: 1 year 7 months

Post #46by Artem » 19.03.2017, 19:00

у меня при смене картинки почему-то ничего не происходит...
.headerbar {
color: #FFF;
background-color: #0A3D87;
background-image: url("./images/head.jpg");
background-image: -webkit-linear-gradient(#0A3E89 0%,#092146 2px,#0A3D87 92px); /* Chrome10+,Safari5.1+,Mobile browsers */
background-image: linear-gradient(#0A3E89 0%,#092146 2px,#0A3D87 92px);
background-repeat: repeat-x;
Artem
Новичок
Reputation: 1
With us: 1 year 4 months

Post #47by Sumanai » 19.03.2017, 19:16

Потому что градиент задан через linear-gradient, картинка для старых браузеров. Если у вас что-то сложнее градиента, то удаляйте строки с linear-gradient, если у вас просто градиент, пропишите нужные цвета в ключевые точки.
Использование поиска продлевает жизнь.
Это форум поддержки форка phpBBex. Поддержка по phpBB осуществляется в других местах.
Sumanai M
Гуру
Avatar
Reputation: 1519
With us: 4 yaers 2 months

Post #48by Glenerg » 21.03.2017, 13:04

Давайте вернемся к нашим баранам, а точнее к кнопке- Вдруг кому пригодится.
1.Создаем рисунок, который хотите использовать в кнопке (На верх).
2.Рисунку делаем прозрачный фон, я делал в онлайн фотошопе. Я делал на сайте http://www.pixlr.com/. Как сделать: снимаем на заднем фоне замочек, волшебной палочкой выделяем фон который должен стать прозрачным, нажимаем Delete и сохраняем файл к себе в формате png - Обязательно.
3.Заходим на сайт http://toolser.ru/ Онлайн кодирование и декодирование картинок в формат Base64, или туда и обратно.
4.Копируем код и вставляем его у себя на сайте в файловом менеджере styles/ваш стиль/theme/buttons.css
Находим там типа такой штуки
Spoiler
#back-to-top {
display: none;
z-index: 10;
position: fixed;
top: 0;
left: 0;
margin: 15px;
width: 24px; -размер картинки
height: 24px; -размер картинки
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAZlBMVEUAAACEiY2SmJ2epKmjqq+lrLGor7SosLWpsbaqsbaqsbeqsbeqsbeqsbeqsbeqsbeqsbeqsbeqsbeqsbeqsbeqsbeqsbeqsbersrettLm6wMTDyc3O09bZ3d/q6+3x8vP5+fr8/f1nT312AAAAF3RSTlMAGiEnNEFPYGpxeoeUnqm1vdLk7vP4+0kZka8AAACySURBVHgBddDxboYgDATwAx36qVPBQZ3TMd7/JbcQSpDM359ccyVFIl+rJqeXXqLUvBOzUxEpS4VNIXnRnevSPNXcW1zLPYVNAMh7SyPQOGLXRcxKDMSOEL6I9Vgp2X0I/pOSGSYXhT+5TMPmoujgf3Gwf4fI7xQZrjpDcnLVQpHn4IeXD/SvvroI+xDA9HASyO3hiFCOKrZF1FWJVUjUrc20yMRk8/goUBLdrI3Rs+LnX+9DKZ4DVjilAAAAAElFTkSuQmCC") no-repeat;
cursor: pointer;
opacity: 0.6;
и меняем код на свой, у меня получилось так
Spoiler
#back-to-top {
display: none;
z-index: 10;
position: fixed;
top: 0;
left: 0;
margin: 15px;
width: 36px;
height: 36px;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAD5klEQVR42u2Xe0xOcRjH38ammyiVk4zMJZFiWRktl2bIbZmwpnS/S5nXdE+TXNtSW4vMbSKpxMKmWirptnKvFOVWqqUlNOvV4/mdE4pze1+vyx/9tu/e7T3n/M7nPL/v8/yen0QyPIbHPxjlTTVw8GYSOKb6gc1he7Dcb0fL+tB6cEjxAunlGMh9mA9/HCS58Ay+eBWM9DEEiZMmSgMkzvjrPPqHyH/kmts4mBZqBdKMGHjW/kK5cFnV18E0ajFIto1hXuqhBxIvA355jgeJy1gaUC/IBKKuHlYOVEh2HIzwpBBGC19Ccbyc4odz1aE/ZPUxR2hsb1YcbEOyB7Mk7gIRweWReOgLRIyiozU1xBIet9TLD7X9QhizPCT0fC9y16WNrBEwVfheIpzTYt9yeN3V6iIaJrHg5MASjReMzMwoG3jf2wP+aaGMx4SAaChNWJvkLC5Kr9693TNBas4sA+/EFH3P+fIs6O/vh5edb8Bw9zw6YsKGZ57NqLomDBWUHslER2hSzKBl8Q7QJ+ujgYgS8lPxf5FRQqOb7l3KD9TS3b5Sf5eZsIlxKUd6GUJxQ/l3GKJPn3vBInYFk1UioTKrc7mhzpdlipsMveJyKmgIzDflPsgb+CBKRJS1YfNxb24gx1R/+ib+rNID3eBZ0NDWxApEtDHFU5zB0W9GWAY4gWzRE4IRQu/sv3GME4boSctTGBs4Q7g24XWdYBOoa21khzKLseXPLrxmHGkNXR+7eYGIwnMOCUcJs22Ez0SoeF7DDkS73k2XN83TyrMFYYg6ejphevgi/g8UArKKs+OegKT5UQeQyWSigIjO3s3gtwACqQVMgZqXj9iB1iQ5sU9A0tybpHmZaBiivi8yrFUbuRMFuwYD6Vxo7nhVxAq0Iz2C/WGEDLwYLhfMrwZn2YbQHnP4imNebfHAg9SQsKr7G8Hp0nQowggV1peK1u36u3CnsRKjtIndm2j6nZei+av17Ogl+PDQZVPxnsCksKu2AtJhnmczNP4SYF6glKJzHD6imN1fIbFUbdzz7JPdxO34liTbxLYSigirvarvJLjHlV0/j0Jce3U/I3GthLwi0cISEnXtiHxdY3plDtPMC/ZF8sDg8m1VB69zUsX6atI5qpIjjzKWj2QZ9llbTvj+3umDlALj8IX0lykULZKd2NyroWfib6Uo5yjU9qHNPPhiBOgEGQ8cDrUG9TzU0P2OiECQM9lWDVBBz6xLdIKShgrln2TrWhsg4spBmB+7Ekb5TR50YtUcdILVpIvrtLAF4H46GOhi+zdGVfN9IMY/cCMJIrHVIIrNTQDSdRbUlvwdiOHxP4yvNsOV8FTkw+gAAAAASUVORK5CYII=") no-repeat;
cursor: pointer;
opacity: 0.6;
5.Сохраняем и наслаждаемся проделанной работой
Любая инструкция должна начинаться: Ну что дебил? -уже сломал!
Glenerg M
Мастер
Age: 38
Reputation: 22
With us: 1 year 7 months

Post #49by sag-sag » 22.03.2017, 17:13

Glenerg, а что вышло, покажи)
"Сбит с ног - сражайся на коленях, идти не можешь - лежа наступай". В. Ф. Маргелов
sag-sag M
Гуру
Age: 30
Reputation: 335
With us: 3 yaers 7 months

Post #50by Glenerg » 22.03.2017, 19:36

Цвет и размер поменял, сильно не грузился
Для меня основное было понять, как это работает
с прозрачностью (без наведения на Картинку на верх еще пока не разбирался, но и до этого дело дойдет)
до работы дойду(завтра) и покажу разницу на двух форумах

Added after 18 minutes 44 seconds:
Интересно, а переделать на кнопочку вниз
есть возможность
Любая инструкция должна начинаться: Ну что дебил? -уже сломал!
Glenerg M
Мастер
Age: 38
Reputation: 22
With us: 1 year 7 months

Post #51by vbnm » 23.03.2017, 08:03

видел, как чувак переделывал на кнопочку от яд-го чемоданчика,и ни че таг... ток пока еще не нажимали )))
vbnm
Гуру
Reputation: 77
With us: 4 yaers

Post #52by Glenerg » 23.03.2017, 17:16

как и писал изменил только цвет и немного размер. Размеры картинок приблизительно одинаковый +- 1-2 пикселя
Attachments
Новый точечный рисунок.jpg
Новый точечный рисунок.jpg (5.98 KiB) Viewed 59 times
Новый точечный рисунок2.jpg
Новый точечный рисунок2.jpg (2.98 KiB) Viewed 59 times
Любая инструкция должна начинаться: Ну что дебил? -уже сломал!
Glenerg M
Мастер
Age: 38
Reputation: 22
With us: 1 year 7 months

Previous

Forum name: Мастерская
Description: Только готовые решения! Статьи, заметки, моды и другие полезности для phpBBex 2.x и phpBB 3.1.x.

Quick reply


Enter the code exactly as it appears. All letters are case insensitive.
Confirmation code
:hi: :smile: :wink: :twisted: :sad: :evil: :smoke: :eh: :eek: :fie: :silenced: :razz: :oops: :help: :spy: :insane: :biggrin: :toothless: :ill: :nervious: :weirdface: :pray: :clap: :think: :boxing: :cyclop: :rambo: :zombie: :cry: View more smilies

   

Return to Мастерская