Полезная информация

Общайтесь со знакомыми и друзьями в нашей группе в Контакте.

№597611-05-2019 15:15:21

Ela
Участник
 
Группа: Members
Зарегистрирован: 05-05-2019
Сообщений: 3
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Здравствуйте! К сожалению, я не дождалась ответа на свой вопрос (вот этот https://forum.mozilla-russia.org/viewtopic.php?pid=769744#p769744), поэтому прошу помощи еще раз. Помогите исправить, пожалуйста!

Отсутствует

 

№597711-05-2019 15:22:49

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 2063
UA: Firefox 67.0

Re: Настройка внешнего вида Firefox в userChrome.css

Ela
попробуйте другой стиль чтобы сделать вкладки ниже https://forum.mozilla-russia.org/viewto … 45#p766645

Отсутствует

 

№597811-05-2019 18:19:08

Вит
Участник
 
Группа: Members
Зарегистрирован: 09-11-2018
Сообщений: 214
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Не пойму как прикрепить фото, вылазит окно: типа свяжитесь с администратором... Подскажите пожалуйста, спасибо

Отсутствует

 

№597911-05-2019 18:19:47

Ela
Участник
 
Группа: Members
Зарегистрирован: 05-05-2019
Сообщений: 3
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет

Ela
попробуйте другой стиль чтобы сделать вкладки ниже https://forum.mozilla-russia.org/viewto … 45#p766645

Виталий, спасибо большое, все получилось! Но после того, как я "поигралась" с настройками, над активной вкладкой появилась черная полоса. Как можно ее убрать (сделать одного цвета со вкладкой)?

74a12293fed8.jpg

Отсутствует

 

№598011-05-2019 20:04:39

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 2063
UA: Firefox 67.0

Re: Настройка внешнего вида Firefox в userChrome.css

Ela пишет

Как можно ее убрать (сделать одного цвета со вкладкой)?

скрытый текст

Выделить код

Код:

#tabbrowser-tabs {
    --tab-line-color: transparent !important;
}


или
скрытый текст

Выделить код

Код:

.tab-line[multiselected], 
.tab-line[selected="true"] {
    opacity: 0 !important;
}


если не срабатывает разбирайтесь с вашим стилем для вкладок, вкладки по умолчанию и то выглядят лучше...

Отредактировано Vitaliy V. (11-05-2019 20:06:20)

Отсутствует

 

№598111-05-2019 22:34:07

FLK
Участник
 
Группа: Members
Зарегистрирован: 11-05-2019
Сообщений: 16
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет

Или можно ковырять каждый раз после обновления в папке установки браузера browser/omni.ja файл /chrome/browser/content/browser/browser.xul
изменить думаю понятно каким кнопкам атрибуты removable="true"

Огромное спасибо за советы и ссылки на код!!! Да, всё выглядит уже на порядок лучше, особо кнопки дополнений и загрузки, остальное еще не идеально по высоте, зато уже есть маневр что можно настраивать! В Aris-t2, увы, вопросы выравнивания как-то очень нечетко задаются в разных местах, либо я еще не вкурил всю схему классов.

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

скрытый текст
QQ1.jpg

Забавно, что кнопка "назад" показывается только в компактной схеме, в других схемах почему-то заменяется на круг.  Теперь займусь интервалами.  Эх, разделитель палочкой убрали... Растягивающийся интервал не понятно как растягивать. Ушел гуглить.

Дополнено: у вас в коде, по крайней мере в моём случае, получается вот это почему-то лишнее:

скрытый текст

Выделить код

Код:

/* ЭТО ЛИШНЕЕ
#main-window:not([inFullscreen]) #toolbar-menubar > :-moz-any(#menubar-items,#wrapper-menubar-items,.titlebar-buttonbox-container) {
    align-self: flex-start !important;
}*/

убрал и теперь 99% хорошо по вертикалке, кнопка "обновить/остановить" только плохо себя ведет:

QQ2.jpg

Отредактировано FLK (11-05-2019 23:24:44)

Отсутствует

 

№598212-05-2019 00:06:59

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 2063
UA: Firefox 67.0

Re: Настройка внешнего вида Firefox в userChrome.css

FLK пишет

Растягивающийся интервал не понятно как растягивать. Ушел гуглить.

нужно убрать ограничение длины max-width

скрытый текст

Выделить код

Код:

#main-window:not([inFullscreen]) #toolbar-menubar toolbarpaletteitem[id^="wrapper-customizableui-special-spring"],    
#main-window:not([inFullscreen]) #toolbar-menubar toolbarspring[id^="customizableui-special-spring"] {
    max-width: none !important;
    flex-grow: 1000 !important;
}


flex-grow можно добавить чтобы получить больше пространства за счет spacer'а который там по умолчанию
но закладки у вас на панели всё равно займут больше места

FLK пишет

у вас в коде, по крайней мере в моём случае, получается вот это почему-то лишнее:

нет не лишнее, меню и кнопки управления окном должны быть сверху а не по центру

Отредактировано Vitaliy V. (12-05-2019 00:47:14)

Отсутствует

 

№598312-05-2019 09:18:17

shinji2009
Участник
 
Группа: Members
Зарегистрирован: 24-08-2014
Сообщений: 81
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

привет. ставлю тёмные темы - всё равно при загрузке любого урл сначала показывается белая страница. можно как-то сделать чтобы до загрузки страницы экран был чёрным?
и раз уж на то пошло. фон страниц настроек тоже тёмным сделать. пожалуйста.

Отсутствует

 

№598412-05-2019 13:28:16

Вит
Участник
 
Группа: Members
Зарегистрирован: 09-11-2018
Сообщений: 214
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V.
Прошу помочь убрать эту тень

скрытый текст
1.png

Отредактировано Вит (12-05-2019 13:38:50)

Отсутствует

 

№598512-05-2019 13:35:05

FLK
Участник
 
Группа: Members
Зарегистрирован: 11-05-2019
Сообщений: 16
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет

нет не лишнее, меню и кнопки управления окном должны быть сверху а не по центру

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

Сейчас достиг следующего:

скрытый текст
Мой идеал к которому стремлюсь из FF 56:
Q-1-1.jpg


То что получилось на данном этапе для FF66:
QQ5-FF66.jpg


Update:
сейчас двигаю более точно кнопки влево-вправо и вниз-ввех через #back-button, #forward-button и задание border-left + border-right + border-bottom + border-top + border-top

Интересно, можно ли увеличить кнопки back-button и forward-button процентов на 10-20 через стили. Сейчас попробую тоже. Update! Можно!!!!! Стандартный transform: scale(1.2)  радует глаз!!! :rock: :rock::rock:

Все эти кнопки я беру из toolbar_fx45.png. Причем back-button видна только в режиме персонализации компактные значки. Иначе вместо неё пустой кружок с точкой. :/  Создатели Aris-t2 видать не рассчитывали, что с кнопками будут делать такое.

PS В сообщении были вопросы, но на них в итоге сам ответил, не буду удалять, может кому понадобится. Потом еще надо будет нестандартно доработать по favicon закладки и табы. Если не хватит терпения на рытье - спрошу.

PPS Тоже, если кому-нибудь понадобится (все гуру явно знают), то красивые вертикальные разделители на картинке, которые зачем то убрали в новых [firefox] - в новом FF в нужные места (подстроки) переменной browser.uiCustomization.state дописываются "customizableui-special-separator1", "customizableui-special-separator2" и т.д. с уникальными номерами. Из её синтаксиса понятно куда.  Возможно есть лучше способ, но я нагуглил такой.

Отредактировано FLK (12-05-2019 20:40:39)

Отсутствует

 

№598613-05-2019 00:53:59

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 2063
UA: Firefox 67.0

Re: Настройка внешнего вида Firefox в userChrome.css

shinji2009 пишет

ставлю тёмные темы - всё равно при загрузке любого урл сначала показывается белая страница

скрытый текст

Выделить код

Код:

#tabbrowser-tabpanels {
    background-color: transparent !important;
}


или свой цвет укажите

Вит пишет

убрать эту тень

замените в стиле margin-inline-end на padding-inline-end

скрытый текст

Выделить код

Код:

#main-window:not([inFullscreen])[tabsintitlebar][sizemode="normal"] #nav-bar {
    padding-inline-end: var(--v-control-buttons-width-box) !important;
}
#main-window:not([inFullscreen])[tabsintitlebar][sizemode="maximized"] #nav-bar {
    padding-inline-end: var(--v-control-buttons-width-maximized-box) !important;
}

Отсутствует

 

№598713-05-2019 04:33:42

Вит
Участник
 
Группа: Members
Зарегистрирован: 09-11-2018
Сообщений: 214
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V.
Спасибо, получилось! но тонкая линия вверху осталась (я специально включил светлую тему для наглядности). Вот бы ее "закрасить" или скрыть!

скрытый текст
Screenshot-1.png

Отсутствует

 

№598813-05-2019 18:40:20

FLK
Участник
 
Группа: Members
Зарегистрирован: 11-05-2019
Сообщений: 16
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Подскажите пожалуйста, как в современном [firefox] можно поменять в закладках favicon по-умолчанию?
То есть для тех закладок, на сайтах которых вообще нет favicon, либо сайт еще не был открыт в FF и favicon не была занесена в базу.
А то эта черно-белая "Земля" уж очень страшная:

скрытый текст
Q-2-2.jpg

Увы, нормальный способ я так и не нашел, видимо надо как то нормально обращаться к .bookmark-item и далее к image или .tab-icon-image с проверками на not(src):not([container]) :

скрытый текст
Этот способ работает, но он меняет иконки для закладок с жестко заданными именами:

Выделить код

Код:

.bookmark-item[label="Mail"] image {
    width:0!important;
    height:0!important;
    padding: 0 0 16px 16px !important;
    background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAOVBMVEXxURv7vAmAzCgAre/////xTxf8wB8csfD7wCXyXjDyWyuHzzaJ0Dohs/DyWSj0Zz2Q00b8xDMxt/HxkgKEAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4goMEQsUc/RzwQAAAB5JREFUGNNjYIAAViYoYKCPACsUwAWYoYARCgZIAADfYwHMYVta3QAAAABJRU5ErkJggg==')!important; 
}

А вот это говорят работало в старых версиях еще с xul:

Выделить код

Код:

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#tabbrowser-tabs .tab-icon-image:not(src),
.sidebar-placesTreechildren::-moz-tree-image(leaf),
.bookmark-item:not(src):not([container]):not([type]):not([folder]) {
  list-style-image: url("./image/tab_favicon_dotted.png") !important;
}
#.bookmark-item:not([container]) {
  list-style-image:url("./image/tab_favicon_dotted.png")!important;
}
treechildren::-moz-tree-image(leaf) {
  list-style-image:url("./image/tab_favicon_dotted.png")!important;
  -moz-image-region:auto!important;
}

Подобное из старых версий тоже не прокатывает, но уже ближе:

Выделить код

Код:

tab .tab-icon-image:not([src]) {
list-style-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAOVBMVEXxURv7vAmAzCgAre/////xTxf8wB8csfD7wCXyXjDyWyuHzzaJ0Dohs/DyWSj0Zz2Q00b8xDMxt/HxkgKEAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4goMEQsUc/RzwQAAAB5JREFUGNNjYIAAViYoYKCPACsUwAWYoYARCgZIAADfYwHMYVta3QAAAABJRU5ErkJggg==') !important;
}

#urlbar #page-proxy-favicon:not([src]) {
list-style-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAOVBMVEXxURv7vAmAzCgAre/////xTxf8wB8csfD7wCXyXjDyWyuHzzaJ0Dohs/DyWSj0Zz2Q00b8xDMxt/HxkgKEAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4goMEQsUc/RzwQAAAB5JREFUGNNjYIAAViYoYKCPACsUwAWYoYARCgZIAADfYwHMYVta3QAAAABJRU5ErkJggg==') !important;
}

menuitem[class=”menuitem-iconic bookmark-item menuitem-with-favicon”]:not([src]) {
list-style-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAOVBMVEXxURv7vAmAzCgAre/////xTxf8wB8csfD7wCXyXjDyWyuHzzaJ0Dohs/DyWSj0Zz2Q00b8xDMxt/HxkgKEAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4goMEQsUc/RzwQAAAB5JREFUGNNjYIAAViYoYKCPACsUwAWYoYARCgZIAADfYwHMYVta3QAAAABJRU5ErkJggg==') !important;
}

Отредактировано FLK (13-05-2019 18:46:51)

Отсутствует

 

№598914-05-2019 13:33:50

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 2063
UA: Firefox 67.0

Re: Настройка внешнего вида Firefox в userChrome.css

Вит
попробуйте изменить на 0 не помню зачем 1px делал

скрытый текст

Выделить код

Код:

#main-window:not([inFullscreen])[tabsintitlebar] #nav-bar {
    margin-top: 0px !important;
}

FLK пишет

Подскажите пожалуйста, как в современном [firefox] можно поменять в закладках favicon по-умолчанию?

если используете user_chrome_files можно так сделать https://forum.mozilla-russia.org/viewto … 01#p758801
измените эту выделенную часть chrome://user_chrome_files/content/svg/defaultFavicon.svg
как вам нужно

Отредактировано Vitaliy V. (14-05-2019 13:34:49)

Отсутствует

 

№599014-05-2019 14:54:47

Вит
Участник
 
Группа: Members
Зарегистрирован: 09-11-2018
Сообщений: 214
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V.
Все Супер! Огромное вам спасибо!!!

Отсутствует

 

№599114-05-2019 16:53:25

FLK
Участник
 
Группа: Members
Зарегистрирован: 11-05-2019
Сообщений: 16
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет

если используете user_chrome_files можно так сделать https://forum.mozilla-russia.org/viewto … 01#p758801
измените эту выделенную часть chrome://user_chrome_files/content/svg/defaultFavicon.svg

Спасибо за ссылки!!!
Ваш user_chrome_files еще не использую, но с интересном немного изучал (и прочие файлы на гитхабе), отличная работа, респект вам от разработчика, но в другой области, далекой от фронт-энда.
Вы сказали где-то в этой теме, что начиная с какой-то версии FF между 60 и 66, так просто запустить JS-код уже не получится? Это же относится и к вашему проекту user_chrome_files???
Поэтому пока не стал экспериментировать с подключением и настройкой.

Видимо адекватного метода заменить у закладок defaultFavicon через userChrome.css нет. :/ 
Поэтому я просто заменил в "маленьком" omni.ja  файлик  \chrome\toolkit\skin\classic\mozapps\places\defaultFavicon.svg
Хоть это не очень красиво с точки зрения разработки, но раз работает, то и ок.
Благо обновляюсь не часто, а если вдруг решу часто обновляться, то замена файлов в архивах или подстрок архивных файлах легко скриптуется.
Вообще всё это, включая неперемещаемые по дефолу кнопки вперед-назад - камень в огород Мозилле, что уменьшают возможности кастомизировать браузер, многие любят FF в основном за это.

Отредактировано FLK (14-05-2019 19:28:48)

Отсутствует

 

№599215-05-2019 14:47:42

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 2063
UA: Firefox 68.0

Re: Настройка внешнего вида Firefox в userChrome.css

FLK пишет

Вы сказали где-то в этой теме, что начиная с какой-то версии FF между 60 и 66, так просто запустить JS-код уже не получится?

Это касается только релизных версий, а не ESR, Firefox Developer Edition (сижу на нём) или Nightly.
Они потом отложили - добавили настройку pref("general.config.sandbox_enabled", false); https://bugzilla.mozilla.org/show_bug.cgi?id=1479857

FLK пишет

Вообще всё это, включая неперемещаемые по дефолу кнопки вперед-назад - камень в огород Мозилле, что уменьшают возможности кастомизировать браузер, многие любят FF в основном за это.

Не соглашусь что касается интерфейса сейчас стало намного лучше (особенно на [linux]) чем в уродливом австралисе, там вообще эти кнопки были привязаны к адресной панели.

Отредактировано Vitaliy V. (15-05-2019 14:49:06)

Отсутствует

 

№599315-05-2019 17:29:24

FLK
Участник
 
Группа: Members
Зарегистрирован: 11-05-2019
Сообщений: 16
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V. пишет

Это касается только релизных версий, а не ESR, Firefox Developer Edition (сижу на нём) или Nightly.

Понятно.
Пока что с необходимым мне оформлением браузера разобрался, это тема - действительно кладезь информации.
Её бы оформить в виде Wiki, с картинками и кодом, совсем цены бы не было )) Увы, вряд ли у кого то будет столько времени на такой глобальный труд.
Осталось решить пару вопросов по JS/Дополнениям, лучше сделаю это в других соответствующих темах.
По изучению HTML/CSS-кода самого браузерного оформления, подскажите пожалуйста по такому вопросу.

Вот тут https://forum.mozilla-russia.org/viewto … 94#p763394 пользователь форума Acid Crash говорит "Попробуйте самостоятельно разобраться в Инспекторе браузера (ссылку на него обсуждали ранее), поверьте, это не так сложно как кажется."

Я промотал предыдущие страницы, но так и не встретил обсуждение этого вопроса.
Ссылка на оформление, которое можно изучать инспектором, это же chrome://browser/content/browser.xul ?
Там, к сожалению, как вижу, есть далеко не всё оформление, в которое можно перекрыть через userChrome.css.
Есть ли еще работающие подобные ссылки?

Я нашел достаточно большой список тут: chrome://browser/content/preferences/preferences.xul, но, как понимаю, он устаревший, и кроме chrome://browser/content/browser.xul у меня ничего не работает.
Можете ли вы раскрыть данный вопрос - где изучать исходный HTML/CSS браузера (или найти толковую документацию для разработчиков) по оформлению, с целью дальнейшей самостоятельной доработки под свои нужды? Инспектором, конечно, это удобнее всего.

Отсутствует

 

№599415-05-2019 17:39:43

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 2063
UA: Firefox 68.0

Re: Настройка внешнего вида Firefox в userChrome.css

Отсутствует

 

№599515-05-2019 18:09:39

R@MEO
Участник
 
Группа: Members
Зарегистрирован: 24-09-2007
Сообщений: 71
UA: Firefox 68.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V.
Скачал последнюю сборку user_chrome_files и она отказалась работать из-за строки в config.js:

                        var file = Services.dirsvc.get("UChrm", Ci.nsIFile);

Если оставить строку из прошлого файла тобишь 2018 года:

                       var file = Services.dirsvc.get("ProfD", Ci.nsIFile);

нижняя панель включается. Я так уже начинаю понимать, что она отвечает за версию браузера?

Отредактировано R@MEO (15-05-2019 18:11:16)

Отсутствует

 

№599615-05-2019 20:07:44

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 2063
UA: Firefox 68.0

Re: Настройка внешнего вида Firefox в userChrome.css

R@MEO
user_chrome_files нужно поместить в папку chrome
Services.dirsvc.get("UChrm", Ci.nsIFile); это %profile%/chrome

Отсутствует

 

№599716-05-2019 10:22:45

Вит
Участник
 
Группа: Members
Зарегистрирован: 09-11-2018
Сообщений: 214
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V.
Виталий, как в вашем коде сделать цвет выделения -Синий, а текст-Белый? Спасибо

скрытый текст
Screenshot-1.png

Отредактировано Вит (16-05-2019 10:28:59)

Отсутствует

 

№599816-05-2019 11:44:22

Вит
Участник
 
Группа: Members
Зарегистрирован: 09-11-2018
Сообщений: 214
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Заранее спасибо

Отредактировано Вит (16-05-2019 16:10:54)

Отсутствует

 

№599916-05-2019 18:30:41

Vitaliy V.
Участник
 
Группа: Members
Зарегистрирован: 19-09-2014
Сообщений: 2063
UA: Firefox 68.0

Re: Настройка внешнего вида Firefox в userChrome.css

Вит пишет

как в вашем коде сделать цвет выделения -Синий, а текст-Белый?

в каком коде? сделать так

Выделить код

Код:

textbox:-moz-any(#urlbar,.searchbar-textbox,.findbar-textbox) *|*.textbox-input::selection {
    background-color: Highlight !important;
    color: HighlightText !important;
}

системные цвета можно заменить...

Отсутствует

 

№600016-05-2019 18:45:30

Вит
Участник
 
Группа: Members
Зарегистрирован: 09-11-2018
Сообщений: 214
UA: Firefox 66.0

Re: Настройка внешнего вида Firefox в userChrome.css

Vitaliy V.
Большое Спасибо!

Отсутствует

 

Board footer

Powered by PunBB
Modified by Mozilla Russia
Copyright © 2004–2020 Mozilla Russia GitHub mark
Язык отображения форума: [Русский] [English]