Vitaliy V., благодарю! Этот пункт есть и в меню табов(и таббара), мне оттуда удобней.
Отредактировано vitalii201 (29-10-2018 08:35:58)
Отсутствует
https://github.com/VitaliyVstyle/Vitali … om_bar.zip
Настраиваете в файле \bindings\toolbars.xml
Обновил, + эти ещё для кучи
https://github.com/VitaliyVstyle/Vitali … om_bar.zip
https://github.com/VitaliyVstyle/Vitali … om_bar.zip
Отредактировано Vitaliy V. (29-10-2018 15:11:42)
Отсутствует
Подскажите пожалуйста. В дополнении DOM Inspector есть одна очень неудобная вещь.
В левой панели которая называется Документ - Узлы DOM, когда выделяешь какой то узел, шрифт становится белым. На голубом фоне выделения его почти не видно.
Можно что то сделать через userChrome.css?
Отсутствует
когда выделяешь какой то узел, шрифт становится белым. На голубом фоне выделения его почти не видно.
Можно изменить в DOM Inspector так + для textbox
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); @namespace html url("http://www.w3.org/1999/xhtml"); @-moz-document url-prefix("chrome://inspector/content/") { treechildren::-moz-tree-cell-text(selected) { color: red !important; } treechildren::-moz-tree-row(selected) { background-color: gold !important; } textbox html|*.textbox-input::-moz-selection { color: red !important; background-color: gold !important; } }
Отредактировано Vitaliy V. (29-10-2018 19:06:38)
Отсутствует
toxa
Пример своих цветов
@-moz-document url(chrome://inspector/content/viewers/dom/dom.xul) { treechildren::-moz-tree-cell-text(selected) { font-weight: bold !important; color: blue !important; } treechildren::-moz-tree-cell-text(selected, focus) { color: navy !important; } treechildren::-moz-tree-cell-text(selected, anonymous) { color: orange !important; } treechildren::-moz-tree-cell-text(selected, focus, anonymous) { color: magenta !important; } /* И так далее. Открой во вкладке адрес chrome://inspector/skin/viewers/dom/dom.css */ }
Отсутствует
Где можно скачать готовые файлы для полноценной темной темы FF, вместе с окнами закладок и т.д.?
У меня ESR 60.3
Увидел в посте https://forum.mozilla-russia.org/viewto … 67#p762667 у dezhnev,
что можно сделать и панель закладок в темном стиле.
Отсутствует
Где можно скачать готовые файлы для полноценной темной темы FF, вместе с окнами закладок и т.д.?
Может подойдёт код под первым спойлером из этого сообщения.
И ещё может этот стиль.
Отредактировано sandro79 (30-10-2018 01:06:15)
Отсутствует
А если я хочу настроить адресную строку, панели...?
The Browser Toolbox enables you to debug add-ons and the browser's own JavaScript code rather than just web pages like the normal Toolbox.
Именно для этого - для интерфейса , не путайте с обычной панелью инструментов для веб-страниц,
но сначала откройте их и в настройках включите:
"Включить инструменты отладки browser chrome и дополнений"
"Включить удалённую отладку"
после этого в меню Инструменты -> Веб-разработка появится пункт "Инструменты браузера" или сочетание клавиш Ctrl+Alt+Shift+I для вызова инструментов
Отсутствует
Может подойдёт код под первым спойлером из этого сообщения.
Я не знаю куда код вставлять, я хотел готовые файлы для папки chrome, чтобы закинуть и проверить.
Уже намучился с разными кодами, не получается настроить цвет в панели закладок.
И тот код тоже не дает результата, так как наверно не туда вставляю.
Отсутствует
westyles
https://yadi.sk/d/p1nv2eGmFGP_ZQ
Отсутствует
sandro79
Есть какой-то результат, благодарю!
Контекстное меню можно настроить, только придется долго разбираться, что для чего там!
Но сам текст в панели и цвет панели не настраивается.
Где можно поглядеть названия элементов, к которым можно стили прикрутить?
Или может есть возможность инспектором как то выявить нужные элементы?
А то он только показывает что на странице, а параметры браузера не поглядеть.
А то в этом файле куча элементов, но на что они влияют не понятно.
И как я понял, там только для контекстного меню, и поисковой панели в адресной строке.
Странно, что ни кто не сделал готовые файлы с полноценной темой, в которой настроены цвета для всех элементов.
Мне нужно изменить только цвета, чтобы получить просто оригинальную тему, но в темных цветах.
Без модификаций вида или размеров.
Понял, что панель закладок это #sidebar
А нужно получить вот такое: https://i.imgur.com/w9PNEXq.png
Отредактировано westyles (30-10-2018 03:11:15)
Отсутствует
westyles
Цвет свой вставьте.
/* Цвет фона и ширина боковой панели п.у. 18em*/ #sidebar-box { background-color: #40E0D0 !important; width: 22em !important; }
Отсутствует
westyles
sidebar
Отсутствует
Как уменьшить в боковой панели интервал между строк в закладках и истории? Раньше работал такой код, теперь перестал.
/* Уменьшение интервала в боковой панели закладок и истории (нововведения с 25-й версии). Делает как раньше */ treechildren:-moz-tree-row { height: 1.3em !important; border-width: 1px !important; }
Отсутствует
xrun1
попробуйте на чистом профиле похоже у вас конфликт с другими стилями,
у меня тот код (второй) https://forum.mozilla-russia.org/viewto … 55#p762555 вполне себе работает.
Было
Отредактировано Vitaliy V. (30-10-2018 16:43:11)
Отсутствует
xrun1
для #BMB https://forum.mozilla-russia.org/viewto … 71#p762671
ну или побольше
panelview :-moz-any(.subview-subheader,.toolbarbutton-1,.subviewbutton), menupopup .subviewbutton { min-height: 18px !important; padding-top: 1px !important; padding-bottom: 1px !important; }
Отредактировано Vitaliy V. (31-10-2018 00:14:29)
Отсутствует
xrun1
причем тут тот стиль к тому же кривоватый?
вот так можно использовать, но речь то не о treechildren
:-moz-any(#bookmarks-view, #historyTree, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-row { min-height: 18px !important; height: 1.3em !important; }
Отредактировано Vitaliy V. (31-10-2018 10:25:18)
Отсутствует
toxa пишетА если я хочу настроить адресную строку, панели...?
The Browser Toolbox enables you to debug add-ons and the browser's own JavaScript code rather than just web pages like the normal Toolbox.
Именно для этого - для интерфейса , не путайте с обычной панелью инструментов для веб-страниц,
но сначала откройте их и в настройках включите:
"Включить инструменты отладки browser chrome и дополнений"
"Включить удалённую отладку"
после этого в меню Инструменты -> Веб-разработка появится пункт "Инструменты браузера" или сочетание клавиш Ctrl+Alt+Shift+I для вызова инструментов
Во как, не знал этого!
Ну я попробовал - работать с ним можно, но по удобству и продуманности интерфейса - с DOМ Inspector-ом никакого сравнения. Но все равно спасибо!
Ну раз уж тут идет разговор о treechildren, может кто подскажет. Как получить текст подсказки Гугла из выпадающего списка searchbar браузера. Не на странице Гугла, а в самом браузере! Там все подсказки находятся в контейнере xul:treechildren и как добраться до отдельно взятой подсказки я не знаю.
Понято, что это не из области css, а скорее js. Ну чтоб уже два раза не вставать.
Отсутствует
получить текст подсказки ...
Это не конкретно для tree (в новых версиях там уже нет tree) а для панели #PopupSearchAutoComplete
получить текст можно так, просто примеры:
document.querySelector("#PopupSearchAutoComplete").addEventListener("popupshowing", function() { var index = 0; // индекс свой подставляете или находите... console.log(this.view.getLabelAt(index)); }, false);
так получить текст самой нижней подсказки
document.querySelector("#PopupSearchAutoComplete").addEventListener("popupshowing", function() { var view = this.view; console.log(view.getLabelAt((view.rowCount || view.matchCount)-1)); }, false);
Отредактировано Vitaliy V. (31-10-2018 20:10:45)
Отсутствует
Vitaliy V., подскажите, пожалуйста можно ли получить в последних версиях следующие настройки?
- разная высота вкладок (активная выше неактивных, вкладка с плюсом ниже всех остальных);
- углы вкладок закруглены;
- углы адресного и поискового окошек закруглены;
- регулирование расстояния между вкладками и величины отступа первой вкладки от левого края;
- регулирование высоты адресной панели.
Интересуюсь потому раньше (на 52.9.0) всё это прекрасно работало через модификацию вашего же стиля:
.tabbrowser-tab:not([pinned])[busy] .tab-throbber + .tab-icon-image:not([src]):not([crashed]) {
display: none !important;
}
/*-----------------------*/
/*Настройки вкладок*/
#tabbrowser-tabs {
min-height: 28px !important;
}
.tabbrowser-arrowscrollbox > .arrowscrollbox-scrollbox {
-moz-padding-start: 0px !important;
-moz-padding-end: 0px !important;
}
.tabbrowser-tab {
border-left: 2px solid !important;
border-top: 2px solid !important;
border-right: 2px solid !important;
border-bottom: none !important;
-moz-margin-start: 1px !important;
-moz-border-top-colors: transparent transparent !important;
-moz-border-left-colors: transparent transparent !important;
-moz-border-right-colors: transparent transparent !important;
border-radius: 5px 5px 0px 0px !important; /*Радиус углов вкладок*/
background-color: transparent !important;
background-origin: border-box !important;
background-clip: border-box !important;
background-repeat: no-repeat !important;
background-position: bottom !important;
background-size: 100% !important;
pointer-events: auto !important;
}
.tabbrowser-tab[selected="true"] {
-moz-border-top-colors: rgba(0,0,0,0.6) rgba(255,255,255,0.25) !important;
-moz-border-left-colors: rgba(0,0,0,0.6) rgba(255,255,255,0.25) !important;
-moz-border-right-colors: rgba(0,0,0,0.6) rgba(255,255,255,0.25) !important;
}
#TabsToolbar {
margin-bottom: 0px !important;
background-image: none !important;
}
#navigator-toolbox > #TabsToolbar {
-moz-padding-start: 6px !important;
-moz-padding-end: 0;
}
#main-window:not([inFullscreen]) #toolbar-menubar:not([autohide="true"]) ~ #TabsToolbar,
#main-window:not([inFullscreen]) #toolbar-menubar[autohide="true"]:not([inactive]) ~ #TabsToolbar {
margin-top: 0px !important;
}
#TabsToolbar .toolbarbutton-1 {
margin-bottom: 0px !important;
}
#TabsToolbar .toolbarbutton-1:not([type="menu-button"]),
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
padding-top: 1px !important;
padding-bottom: 1px !important;
}
.tabbrowser-arrowscrollbox > .scrollbutton-up,
.tabbrowser-arrowscrollbox > .scrollbutton-down {
margin-bottom: 0px !important;
}
#TabsToolbar .tabbrowser-tab[selected="true"]:not(:-moz-lwtheme) {
background-color: -moz-dialog !important;
background-image: linear-gradient(to bottom, rgba(255,255,255,0.4)0%, rgba(255,255,255,0.33)70%, rgba(255,255,255,0.3)100%) !important;
}
#TabsToolbar .tabbrowser-tab[selected="true"]:-moz-lwtheme {
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.4)10%, rgba(255, 255, 255, 0.2)70%, rgba(255, 255, 255, 0.15)100%), linear-gradient(rgba(229,229,229,0.40), rgba(229,229,229,0.40)) !important; /*цвет фона активной вкладки*/
}
.tab-stack {
margin-top: -2px !important;
-moz-margin-end: -2px !important;
-moz-margin-start: -2px !important;
}
.tab-background {
min-height: 26px !important;
margin-left: 0 !important;
margin-right: 0 !important;
margin-bottom: 0 !important;
margin-top: 2px !important;
border-top: 2px solid transparent !important;
border-left: 2px solid transparent !important;
border-right: 2px solid transparent !important;
-moz-border-top-colors: rgba(0,0,0,0.35) rgba(255,255,255,0.25) !important;
-moz-border-left-colors: rgba(0,0,0,0.35) rgba(255,255,255,0.25) !important;
-moz-border-right-colors: rgba(0,0,0,0.35) rgba(255,255,255,0.25) !important;
border-radius: 7px 7px 0px 0px !important; /*Радиус углов вкладок*/
background-color: transparent !important;
background-origin: border-box !important;
background-clip: border-box !important;
background-repeat: no-repeat !important;
background-position: bottom !important;
background-size: 100% !important;
background-image: linear-gradient(rgba(153, 153, 153, 0.2), rgba(115, 115, 115, 0.2)) !important;
}
.tabbrowser-tab[selected="true"] > .tab-stack > .tab-background {
-moz-border-top-colors: transparent transparent !important;
-moz-border-left-colors: transparent transparent !important;
-moz-border-right-colors: transparent transparent !important;
background-image: none !important;
}
.tab-background-middle {
margin-top: -1px !important;
-moz-margin-end: -1px !important;
-moz-margin-start: -1px !important;
border-radius: 7px 7px 0px 0px !important; /*Радиус углов вкладок*/
background-image: none !important;
background-color: transparent !important;
background-clip: padding-box !important;
background-repeat: no-repeat !important;
background-position: bottom !important;
background-size: 100% !important;
}
.tab-content {
margin-top: 2px !important;
}
.tab-content:not([pinned]) {
-moz-padding-end: 6px !important;
-moz-padding-start: 6px !important;
}
.tab-content > .tab-close-button > .toolbarbutton-icon {
width: 16px !important;
height: 16px !important;
}
.tab-icon-overlay {
margin-top: -8px !important;
}
.tab-icon-sound {
margin: 0 !important;
}
.tab-background-middle,
.tab-background-start,
.tab-background-end,
.tabbrowser-tab::after,
.tabbrowser-tab::before,
#TabsToolbar::after {
display: none !important;
}
.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator:not([collapsed]),
.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator:not([collapsed]) {
margin-bottom: 0 !important;
}
.tabs-newtab-button {
width: 30px !important; /*Ширина кнопки*/
margin-top: 6px !important; /*Отступ сверху*/
-moz-margin-end: 0px !important;
-moz-margin-start: 2px !important; /*Отступ от края ближайшей вкладки*/
border-left: 2px solid !important;
border-top: 2px solid !important;
border-right: 2px solid !important;
border-bottom: none !important;
-moz-border-top-colors: rgba(0,0,0,0.35) rgba(255,255,255,0.25) !important;
-moz-border-left-colors: rgba(0,0,0,0.35) rgba(255,255,255,0.25) !important;
-moz-border-right-colors: rgba(0,0,0,0.35) rgba(255,255,255,0.25) !important;
border-radius: 6px 12px 0px 0px !important; /*Радиус углов кнопки "открыть новую вкладку"*/
background-color: transparent !important;
background-origin: border-box !important;
background-clip: border-box !important;
background-repeat: no-repeat !important;
background-position: bottom !important;
background-size: 100% !important;
background-image: linear-gradient(rgba(153, 153, 153, 0.2), rgba(115, 115, 115, 0.2)) !important;
}
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover {
background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0.50)), linear-gradient(rgba(153, 153, 153, 0.2), rgba(115, 115, 115, 0.2)) !important;
background-position: 1px 1px !important;
background-size: calc(100% - 2px) calc(100% - 1px) !important;
}
#TabsToolbar .toolbarbutton-1:not([disabled="true"]):hover,
#TabsToolbar .toolbarbutton-1[open],
#TabsToolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled="true"]):hover,
.tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled="true"]):hover,
.tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled="true"]):hover {
background-position: 1px 0, 0 -1px, 100% -1px !important;
}
.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) > .tab-stack > .tab-content {
background-position: center !important;
}
.titlebar-placeholder[type="caption-buttons"] {
margin-left: 1px !important;
}
#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(:-moz-lwtheme) {
background-color: -moz-Dialog !important;
}
@media (-moz-windows-default-theme) {
@media (-moz-os-version: windows-vista),
(-moz-os-version: windows-win7) {
#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(:-moz-lwtheme) {
background-color: hsl(210,75%,92%) !important;
}
#TabsToolbar .tabbrowser-tab[selected="true"]:not(:-moz-lwtheme) {
background-color: hsl(210,75%,92%) !important;
}
}
}
#nav-bar {
box-shadow: none !important;
border-top: 1px solid hsla(209,67%,12%,0.35) !important;
}
#nav-bar:not(:-moz-lwtheme) {
background-image: linear-gradient(to bottom, rgba(255,255,255,0.30)0%, rgba(255,255,255,0.25)30%, rgba(255,255,255,0)100%) !important;
}
#nav-bar:-moz-lwtheme {
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.15)0%, rgba(255, 255, 255, 0)100%), linear-gradient(to bottom, rgba(229,229,229,0.40)0%, rgba(229,229,229,0.05)100%) !important; /*цвет фона панели навигации*/
border-top-color: transparent !important;
}
#navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar):not(#nav-bar) {
background-image: none !important;
}
/*---------------------------*/
/*Tab Mix Plus*/
.tabbrowser-tabs:not([treestyletab-mode="vertical"]) > .tabbrowser-tab > .tab-stack > .tab-progress-container > .tab-progress {
margin-top: 4px !important;
}
/*-----------------------*/
/*Tab Utilities*/
#tabbrowser-tabs #PinnedTabsBarItems {
-moz-padding-start: 0 !important;
-moz-margin-end: 0 !important;
}
#tabbrowser-tabs[overflow] #PinnedTabsBarItems {
-moz-margin-end: -15px !important;
}
.tabbrowser-tab[locked]:not([pinned]) .tab-throbber:not([busy]) {
-moz-margin-end: -8px !important;
}
/*-----------------------*/
/*Панель навигации*/
#nav-bar .toolbarbutton-1:not([type="menu-button"]):not(:-moz-any(#back-button, #forward-button)),
#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
padding-top: 1px !important;
padding-bottom: 1px !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
#nav-bar {
padding-top: 0px !important;
padding-bottom: 0px !important;
}
#back-button {
padding-top: 2px !important;
padding-bottom: 2px !important;
-moz-padding-start: 3px !important;
-moz-padding-end: 0px !important;
}
#back-button > .toolbarbutton-icon {
border: 1px solid hsla(210,4%,10%,.25) !important;
box-shadow: none !important;
padding: 3px !important;
width: 26px !important;
max-width: none !important;
min-width: 0 !important;
transition: none !important;
background-clip: padding-box !important;
}
#nav-bar[brighttext] #back-button > .toolbarbutton-icon, #nav-bar[brighttext] #forward-button > .toolbarbutton-icon {
border-color: rgba(255,255,255,.35) !important;
}
#nav-bar #back-button[open="true"] > .toolbarbutton-icon,
#nav-bar #forward-button[open="true"] > .toolbarbutton-icon {
border-color: hsla(210,4%,10%,.15) !important;
}
#nav-bar[brighttext] #back-button[open="true"] > .toolbarbutton-icon,
#nav-bar[brighttext] #forward-button[open="true"] > .toolbarbutton-icon {
border-color: rgba(255,255,255,.2) !important;
}
#forward-button {
padding-top: 0px !important;
padding-bottom: 0px !important;
}
#nav-bar #PanelUI-menu-button {
-moz-padding-start: 3px !important;
-moz-padding-end: 3px !important;
}
#nav-bar #PanelUI-button {
background: none !important;
-moz-border-start: 1px solid;
border-image: linear-gradient(transparent, rgba(0,0,0,.1) 20%, rgba(0,0,0,.1) 80%, transparent);
border-image-slice: 1;
}
window:not([chromehidden~="toolbar"]) #urlbar-wrapper {
-moz-margin-start: -6px !important;
}
@media (-moz-os-version: windows-win10) {
#back-button > .toolbarbutton-icon {
padding: 4px !important;
width: 28px !important;
}
window:not([chromehidden~="toolbar"]) #urlbar-wrapper {
-moz-margin-start: -8px !important;
}
}
#urlbar-search-splitter {
min-width: 4px !important;
width: 4px !important;
-moz-margin-start: -3px !important;
}
#urlbar:-moz-locale-dir(ltr) {
border-top-right-radius: 5px !important;
border-bottom-right-radius: 5px !important;
}
#urlbar:-moz-locale-dir(rtl) {
border-top-left-radius: 5px !important;
border-bottom-left-radius: 5px !important;
}
.searchbar-textbox {
border-radius: 5px !important;
}
Windows 10 LTSC
Отсутствует