С помощью этого кода создал границу для #identity-box, которая отделяет иконку защищенного или незащищенного соединения ("замок") от url-адреса
Вообще, по идее, это должно быть наверно сделано таким же образом, как на служебных страницах, как то так наверно
#urlbar[pageproxystate="valid"] > #identity-box:not(.chromeUI):not(.extensionPage):not(.notSecureText) { --urlbar-separator-color: #cccccc !important; margin-inline-end: 4px !important; border-inline-end: 1px solid var(--urlbar-separator-color) !important; border-image: linear-gradient(transparent 15%, var(--urlbar-separator-color) 15%, var(--urlbar-separator-color) 85%, transparent 85%) !important; border-image-slice: 1 !important; }
:not(.unknownIdentity) можно ещё добавить попробовать.
Однако, на некоторых сайтах "замка" вообще нет
Что за сайты, примеры этих сайтов можно? security.insecure_connection_icon.enabled в true?
Отсутствует
Я не знаю что такое "вообще везде".
Я имел в виду на всех страницах, кроме служебных. Если хотите, поставьте "чистый" Firefox (версия - любая, в последних, по-моему, так же, как в 68) и посмотрите: там по умолчанию нет разделителя между иконкой и url-адресом.
У вас в коде "border: none !important;", чего вы от этого ждете?
Правило border: none !important скрывает разделитель на служебных страницах, иначе там будет два разделителя: тот, который по умолчанию, и тот, который создал я.
Удалите это блок и замените моим.
Да, я так тоже пробовал раньше - не работает (по крайней мере, в 68).
Вообще, по идее, это должно быть наверно сделано таким же образом, как на служебных страницах, как то так наверно
Да, так тоже неплохо получается, нужно только отрегулировать значение margin, чтобы расстояния слева и справа были одинаковые.
security.insecure_connection_icon.enabled в true?
Точно, теперь появилась иконка. Забыл, когда браузер настраивал, спасибо, что напомнили.
Что за сайты, примеры этих сайтов можно?
Вот пример. Сайты с такими адресами еще часто встречаются.
Отсутствует
Можно ли поменять местами эти иконки?
И можно ли вообще сделать так, чтобы иконка соединения всегда была первой, а все остальные появлялись справа от нее?
Отсутствует
Алексей У.
Я точно не помню, но вроде этот скрипт менял для 68 (достал из архивного 68 профиля)
// 'Favicon in urlbars identity box' script for Firefox 60+ by Aris // // This script restores current pages favicon inside urlbar (aka location bar, address bar or awesome bar). // [!] If a page does not offer a favicon, browser branches default icon is shown. // [!] In a multi-window environment pages without favicons might show wrong icons. // option: set icon for pages without favicon // Fx 70+: add favicon item to identiy box without replacing connection or tracking protection icons var i_icon = 'chrome://browser/skin/identity-icon.svg'; var sheet = 'chrome://global/skin/icons/Portrait.png'; var brand = 'chrome://branding/content/identity-icons-brand.svg'; var globe = 'chrome://mozapps/skin/places/defaultFavicon.svg'; var icon_for_pages_without_favicon = brand; // i_icon, sheet, globe or brand (colorized Fx channel icon) var appversion = parseInt(Services.appinfo.version); var FaviconInUrlbar = { init: function() { try { // on Fx 70+: add favicon to identity box without replacing existing icons if(appversion >= 70) { var favimginurlbar = document.createXULElement("image"); favimginurlbar.setAttribute("id","favimginurlbar"); favimginurlbar.style.width = "16px"; favimginurlbar.style.height = "16px"; favimginurlbar.style.marginRight = "4px"; document.getElementById('identity-box').insertBefore(favimginurlbar,document.getElementById('identity-box').firstChild); } // update script every time tab attributes get modified (switch/open tabs/windows) document.addEventListener("TabAttrModified", updateIcon, false); document.addEventListener('TabSelect', updateIcon, false); document.addEventListener('TabOpen', updateIcon, false); document.addEventListener('TabClose', updateIcon, false); document.addEventListener('load', updateIcon, false); document.addEventListener("DOMContentLoaded", updateIcon, false); function updateIcon() { setTimeout(function(){ // timeout fixes wrong icon detection in some cases // get current tabs favicon var favicon_in_urlbar = gBrowser.selectedTab.image; // if current tab offers no icon, use selected icon (icon_for_pages_without_favicon) if(!gBrowser.selectedTab.image || gBrowser.selectedTab.image == null) if(!icon_for_pages_without_favicon) favicon_in_urlbar = brand; else favicon_in_urlbar = icon_for_pages_without_favicon; // on Fx 60-69: replace globe icon with favicon // on Fx 70+: modify favicon item if(appversion >= 70) document.querySelector('#favimginurlbar').style.listStyleImage = "url("+favicon_in_urlbar+")"; else document.querySelector('#identity-icon').style.listStyleImage = "url("+favicon_in_urlbar+")"; },100); } /* restore icon badge for websites with granted permissions */ var sss = Components.classes["@mozilla.org/content/style-sheet-service;1"].getService(Components.interfaces.nsIStyleSheetService); var uri = Services.io.newURI("data:text/css;charset=utf-8," + encodeURIComponent(' \ \ .grantedPermissions::before { \ content: "" !important; \ display: block !important; \ width: 6px !important; \ height: 6px !important; \ position: absolute !important; \ -moz-margin-start: 11px !important; \ margin-top:-8px !important; \ background: Highlight !important; \ border-radius: 100px !important; \ } \ \ '), null, null); // remove old style sheet if (sss.sheetRegistered(uri,sss.AGENT_SHEET)) sss.unregisterSheet(uri,sss.AGENT_SHEET); sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET); } catch(e) {} } }; // initiate script after DOM/browser content is loaded document.addEventListener("DOMContentLoaded", FaviconInUrlbar.init(), false);
Отсутствует
И можно ли вообще сделать так, чтобы иконка соединения всегда была первой, а все остальные появлялись справа от нее?
С учётом вашего стиля для строки адреса, следует ещё добавить через запятую после #connection-icon селектор #identity-icon
Отредактировано sandro79 (21-02-2022 15:40:48)
Отсутствует
скрытый текст
Спасибо, помогло. А для похожих случаев, когда нужно изменить порядок каких-либо элементов, это правило подойдет?
Отсутствует
Отсутствует
Да, я помню, вы тогда мне очень помогли. Кстати, еще такой вопрос, может быть, вы знаете: есть ли способ изменить цвет заливки фона в разделе "Персонализация" (по умолчанию он там белый). Инструменты разработчика и инструменты браузера, к сожалению, там даже не открываются.
Отсутствует
инструменты браузера, к сожалению, там даже не открываются
Да можно выловить без проблем
#customization-content-container, #customization-panelWrapper > .panel-arrowcontent, #customization-footer { background: magenta !important; color: white !important; }
Отредактировано sandro79 (21-02-2022 19:35:38)
Отсутствует
Да можно выловить без проблем
Действительно, не сообразил почему-то перейти в другую вкладку, открыть инструменты браузера, а потом в эту вернуться.
Выделить кодКод:
#customization-content-container, #customization-panelWrapper > .panel-arrowcontent, #customization-footer { background: magenta !important; color: white !important; }
Посмотрел - оказалось, можно еще короче сделать:
Отсутствует
Посмотрел - оказалось, можно еще короче сделать:
Ну да, там чуть выше ещё селектор, и футер он снизу захватывает. У меня через инспектор так не пошло, поэтому отдельно сделал.
А не пошло у меня из-за включенной сторонней темы . Со стандартной да, работает с просто #customization-container.
Отсутствует
Подскажите, пожалуйста, селектор этой области
Отсутствует
Алексей У.
.search-wrapper .search-button:hover { background-color: grey !important; } .search-wrapper .search-button:focus { background-color: red !important; }
Смотрите в раздел с правилами тоже.
Отсутствует
скрытый текстВыделить кодКод:
.search-wrapper .search-button:hover { background-color: grey !important; } .search-wrapper .search-button:focus { background-color: red !important; }
Я пробовал делать так, но это правило, к сожалению, не работает при использовании градиентной заливки:
.search-wrapper .search-button:hover { background-image: linear-gradient(top, #4d90fe, #357ae8) !important; border: 1px solid #2f5bb7 !important; } .search-wrapper .search-button:active { background-image: linear-gradient(top, #3c7ae4, #3f76d3) !important; border: 1px solid #2f5bb7 !important; }
У меня так.
А что касается фокуса, то я имел в виду это
Отсутствует
У меня так.
Ну ток под лупой рассматривать. Ну это адрес к иконке стрелки на скрине у вас.
А что касается фокуса, то я имел в виду это
Так можно, остальное не знаю
.search-wrapper .search-inner-wrapper:active input { border-color: green !important; box-shadow: none !important; } .search-wrapper input:focus { border-color: red !important; box-shadow: none !important; }
Отсутствует
Как можно сместить иконку закладки к правому краю выпадающего списка и расположить в первой строке (положение иконки должно быть привязано именно к правому краю, чтобы при изменении ширины списка она оставалась на одном и том же расстоянии от него)?
Отсутствует
Подскажите, пожалуйста:
1) как уменьшить размер вкладок по высоте (на 1,5х-2х)
2) как уменьшить высоту (на 2х-2,5х) контекстного меню
Версия Firefox 97.0.2 (64-бита)
Отредактировано Djon776 (05-03-2022 11:06:56)
Отсутствует
Вопрос по userContent.css. Как убрать эту рамку вокруг кнопки закрытия?
Эффект возник после замены иконки на собственную, рамка появляется в режиме active, а также при правом клике на кнопке. Код замены:
.close-icon { list-style-image: url("./image/close.png") !important; -moz-image-region: rect(0px, 16px, 16px, 0px) !important; transform: scale(0.8) !important; } .close-icon:hover { -moz-image-region: rect(0px, 32px, 16px, 16px) !important; } .close-icon:active { -moz-image-region: rect(0px, 48px, 16px, 32px) !important; }
Отсутствует
Как убрать эту рамку вокруг кнопки закрытия?
Отсутствует
скрытый текст
Спасибо, вроде бы работает. Кстати, еще по этому вопросу - можно ли одним общим кодом заменить иконки всех кнопок закрытия в браузере? Мне удалось это сделать пока только для вкладок, боковой панели и всплывающих окон настроек. Вот здесь, например, не получилось
Отсутствует
можно ли одним общим кодом заменить иконки всех кнопок закрытия в браузере?
Ну, похоже, что нет.
Вот здесь, например, не получилось
#toolbox-close::before { background-image: url("chrome://branding/content/icon16.png") !important; }
Отсутствует
скрытый текств userContent.cssВыделить кодКод:
#toolbox-close::before { background-image: url("chrome://branding/content/icon16.png") !important; }
Добавил, но через list-style-image (у меня иконка в виде одного изображения сделана) не работает.
Отсутствует
Подскажите, пожалуйста, селекторы для замены цвета этих границ в окне библиотеки на собственный:
Отсутствует