Значки / иконки / кнопки

linlin · №1

Использую вот этот супер-стиль, делающий менюшки соответствующими теме. Только иконка ножницы (Screenshot) из контекстного меню сайта не перекрасилась. Как бы сделать её белой?

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

Как запретить значку "Вид для чтения" появляться в адресной строке?

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

Отредактировано linlin (28-10-2020 19:00:03)

kokoss · №2

linlin пишет

Как запретить значку "Вид для чтения" появляться в адресной строке?

В about:config переключить параметр: reader.parse-on-load.enabled на false

linlin · №3

kokoss
Мерси.
.
А В меню трёх точек в адресной строке иконка ножницы белая:

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

Может, можно для контекстного меню прописать, чтобы эта белая там показывалась?
url("./image/белые ножницы.png") !important;

Vitaliy V. · №4

linlin

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

Выделить код

Код:

menupopup menuitem[id$="create-screenshot"] > .menu-iconic-left > .menu-iconic-icon {
    -moz-context-properties: fill;
    fill: currentColor;
}

добавил это для [firefox]

78 +
https://forum.mozilla-russia.org/viewto … 65#p764365

Отредактировано Vitaliy V. (11-10-2020 14:48:35)

linlin · №5

Взяла на всякий случай весь новый код целиком (убрав, конечно, старый). Сработало, спасибо.

linlin · №6

В выпадающем списке закладок меню заголовка и звёздочки с панели инструментов под каждым списком содержимого папок стоит "Открыть всё во вкладках". Как эту кнопку (или что это?) удалить?
В инспекторе браузера попыталась найти название элемента, но оно не одно - для разных папок разные:
menuitem.openintabs-menuitem:nth-child(33)
menuitem.panel-subview-footer:nth-child(18)
.openintabs-menuitem
и т.д.
И запретить их вот этим {display: none !important;} не получается.
Что-то другое надо написать? Или это вообще в about:config отключается?

Отредактировано linlin (12-10-2020 19:14:16)

sandro79 · №7

linlin пишет

В выпадающем списке закладок меню заголовка и звёздочки с панели инструментов под каждым списком содержимого папок стоит "Открыть всё во вкладках". Как эту кнопку (или что это?) удалить?

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

Или это вообще в about:config отключается?

Едва ли...

linlin · №8

sandro79 пишет

Не знаю почему не сработало.

Потому что вот эту штуку -> .bookmarks-actions-menuseparator инспектор мне в "копировать/CSS-селектор" не выдал.
Зато выдал вот это -> #BMB_bookmarksShowAll. И я тут же состряпала свой первый рабочий код:

Выделить код

Код:

/* убрать Показать все закладки */
#BMB_bookmarksShowAll
{display: none !important;}

Так что ваши инструкции, и ваших коллег, знатоков этого дела, не пропали даром. Спасибо за помощь!

sandro79 · №9

linlin пишет

Потому что вот эту штуку -> .bookmarks-actions-menuseparator инспектор мне в "копировать/CSS-селектор" не выдал.

Должно и без этого сработать. Этим я убрал, ставший ненужным разделитель перед "Открыть всё во вкладках".

Зато выдал вот это -> #BMB_bookmarksShowAll. И я тут же состряпала свой первый рабочий код:

Отлично :rock:

Так что ваши инструкции, и ваших коллег, знатоков этого дела, не пропали даром. Спасибо за помощь!

Всегда рады помочь. Да я только по мелочи, скрыть чего, чужой код под себя чуть подрихтовать, если получится.

linlin · №10

Когда окно программы не на весь экран развёрнуто, в адресной строке частенько виден только символ "три точки", а звёздочка исчезает:

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

Как бы сделать так, чтобы звёздочка была там закреплена вместо этих "трёх точек" (они мне там вообще не нужны)?
Я попробовала так:

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

Выделить код

Код:

#pageActionButton
{display: none !important;}

#star-button
{visibility: visible;}

Первое работает, второе нет.

sandro79 · №11

linlin пишет

второе нет.

Может так:

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

Выделить код

Код:

#star-button-box {
  display: block !important;
  margin-bottom: -3px !important;
}

linlin · №12

sandro79 пишет

Может так

Да, именно так! Спасибо!

VictorMerlin · №13

а можно всем значкам цвет поменять?

linlin · №14

У кнопок "Другие инструменты" и "Показать больше закладок" один и тот же значок (стрелки), и расположены рядом, из-за чего частенько нажимаешь не на ту. Покрасила "Показать больше закладок" в один из цветов своей темы.

код

Выделить код

Код:

#PlacesChevron {
  fill: rgb(230, 113, 50) !important;
}

А как сделать другой цвет при наведении мыши и при нажатой кнопке?

Отредактировано linlin (28-10-2020 19:16:43)

FireForce · №15

linlin Обычно в таких случаях используются css-псевдоклассы. В данном случае применимы `:hover` — наведение и `:acitve` — активация.


#PlacesChevron:hover {
  fill: aqua !important;
}
#PlacesChevron:active {
  fill: pink !important;
}

linlin · №16

FireForce
Спасибо! Получилось:

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

Выделить код

Код:

#PlacesChevron:hover, #PlacesChevron:active {
  fill: none !important;
  background: rgb(230, 113, 50) !important;
}

Надо же как просто!

А я что только не пробовала туда привинтить

:enabled:hover
:enabled:hover:active
:not([disabled="true"]):-moz-any([checked="true"], :hover:active
:not([disabled="true"]):-moz-any([open], [checked], :hover:active)

Отредактировано linlin (29-10-2020 20:43:55)

linlin · №17

В меню "трёх полосок" (#PanelUI-menu-button) есть иконки:
chrome://browser/skin/edit-cut.svg
chrome://browser/skin/edit-copy.svg
chrome://browser/skin/edit-paste.svg

Хочу вставить их в контекстное меню правой кнопки. Нашла несколько способов с устаревшим неработающим биндингом -moz-binding: url("chrome://global/content/bindings/menu.xml#menu-iconic") !important;
Какой способ сейчас рабочий?

sandro79 · №18

linlin пишет

Какой способ сейчас рабочий?

Отсюда и далее обсуждалось несколько вариантов добавления иконок в конт. меню.

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

https://forum.mozilla-russia.org/viewto … 17#p774517

Выделить код

Код:

*|*:root {
    --v-menu-icons-margin-start: 5px; /* отступ слева для иконок, для Linux 0px */
}
menu::before, menuitem::before {
    width: 16px !important;
    height: 16px !important;
    display: -moz-box !important;
    margin-inline-start: var(--v-menu-icons-margin-start) !important;
    margin-inline-end: calc(-1 * (var(--v-menu-icons-margin-start) + 16px)) !important;
    position: relative !important;
    background-color: transparent !important;
    background-position: center !important;
    background-size: 16px !important;
    background-repeat: no-repeat !important;
}
/* ************************************************ */

menuitem[label="Вырезать"]::before {
    content: "" !important;
    background-image: url("chrome://browser/skin/edit-cut.svg") !important;
}
menuitem[label="Копировать"]::before {
    content: "" !important;
    background-image: url("chrome://browser/skin/edit-copy.svg") !important;
}
menuitem[label="Вставить"]::before {
    content: "" !important;
    background-image: url("chrome://browser/skin/edit-paste.svg") !important;
}

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

linlin · №19

sandro79
У меня вот так получается:

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

Может, из-за того, что этот стиль для меню используется?
Сделала иконки белыми вот этим:

Выделить код

Код:

menuitem[label="Вырезать"]::before,
menuitem[label="Копировать"]::before,
menuitem[label="Вставить"]::before {
    filter: invert(1) !important;
}

А подвинуть их влево не удаётся - вместо них их названия сдвигаются вправо.
Может, как-то надо было приписать их к class="menu-iconic-left"? Потому что остальные иконки конт. меню к нему приписаны.
А этот код совсем не понимаю, как использовать.

Отредактировано linlin (14-11-2020 18:13:12)

sandro79 · №20

linlin пишет

Может, из-за того, что этот стиль для меню используется?

Возможно с ним получается конфликт. Я на дефолте проверял.

linlin пишет

А этот код совсем не понимаю, как использовать.

Этот вариант я не осилил, не знаю как сделать, чтоб "не вешать на каждом пункте псевдоэлемент ::before"

Vitaliy V. · №21

linlin пишет

А подвинуть их влево не удаётся - вместо них их названия сдвигаются вправо.

С моим стилем не нужен отступ в 5px
--v-menu-icons-margin-start: 0px;

linlin пишет

Сделала иконки белыми вот этим:

или можно вместо filter: invert(1) !important;
-moz-context-properties: fill;
fill: currentColor;

sandro79 пишет

Этот вариант я не осилил, не знаю как сделать, чтоб "не вешать на каждом пункте псевдоэлемент ::before"

код из поста №18 это и есть, разница только в сокращенной записи в моем коде background свойства.

Отредактировано Vitaliy V. (14-11-2020 19:18:53)

sandro79 · №22

Vitaliy V. пишет

код из поста №18 это и есть, разница только в сокращенной записи в моем коде background свойства.

Понятно. Ну да, если в тот код добавить:

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

Выделить код

Код:

menuitem[label="Вырезать"]::before {
    content: "" !important;
    background-image: url("chrome://browser/skin/edit-cut.svg") !important;
}
menuitem[label="Копировать"]::before {
    content: "" !important;
    background-image: url("chrome://browser/skin/edit-copy.svg") !important;
}
menuitem[label="Вставить"]::before {
    content: "" !important;
    background-image: url("chrome://browser/skin/edit-paste.svg") !important;
}

то всё так же работает, как и в коде из поста №18. Ступил я, смутило это ::before не на каждый элемент, думал там по-другому надо иконки привязывать.

Обсуждение я не очень внимательно изучил, и особенно тут.

Отредактировано sandro79 (14-11-2020 20:06:32)

linlin · №23

Vitaliy V. пишет

-v-menu-icons-margin-start: 0px;

Ой, точно! Как я умудрилась эту строчку проглядеть?
Там ведь даже "/*отступ слева для иконок*/" написано.

Vitaliy V. пишет

или можно вместо filter: invert(1) !important;
-moz-context-properties: fill;
fill: currentColor;

Не можно, а нужно! Потому что иначе рядом с неактивным пунктом меню иконка остаётся яркой, как рядом с активным.
В общем, всё отлично. Спасибо всем за помощь!

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

linlin · №24

Хочу заменить для Библиотеки-вкладки общий безликий значок закладки на звезду. Вот этим кодом удалось сделать это для горизонтальной панели и выпадающего списка закладок:

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

Выделить код

Код:

.bookmark-item[label="Библиотека"] image {
  width:0!important;
  height:0!important;
  padding: 0 0 16px 16px !important;
  background:url("chrome://browser/skin/bookmark.svg") !important;
  -moz-context-properties: fill;
      fill: currentColor;
      opacity: 0.8
}
/*Скрыть название закладки*/
.bookmark-item[label="Библиотека"] > .toolbarbutton-text {
	display: none !important;
}

А в боковой панели и в Библиотеке так и остался тот безликий значок. Там его можно заменить?

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