1374107 - Stop using the :not(:target) selector in the SVG icons that are used to theme in-content UI

Status: RESOLVED FIXED

(Toolkit :: Themes, defect)

Comment 1

[Jonathan Watt [:jwatt]]

Attachment: Bug 1374107 - Convert chrome://global/skin/in-content/check-partial.svg and its consumers to use SVG image context paint.

Review commit: https://reviewboard.mozilla.org/r/150190/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/150190/

Comment 2

[Jonathan Watt [:jwatt]]

Attachment: Bug 1374107 - Convert chrome://global/skin/in-content/check.svg and its consumers to use SVG image context paint.

Review commit: https://reviewboard.mozilla.org/r/150192/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/150192/

Comment 3

[Jonathan Watt [:jwatt]]

Attachment: Bug 1374107 - Convert chrome://global/skin/in-content/dropdown.svg and its consumers to use SVG image context paint.

Review commit: https://reviewboard.mozilla.org/r/150194/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/150194/

Comment 4

[Jonathan Watt [:jwatt]]

Attachment: Bug 1374107 - Convert chrome://global/skin/in-content/radio.svg and its consumers to use SVG image context paint.

Review commit: https://reviewboard.mozilla.org/r/150196/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/150196/

Comment 5

[Jonathan Watt [:jwatt]]

Attachment: Bug 1374107 - Convert chrome://global/skin/in-content/help-glypeh.svg and its consumers to use SVG image context paint.

Review commit: https://reviewboard.mozilla.org/r/150198/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/150198/

Comment 6

[Jonathan Watt [:jwatt]]

Comment on attachment 8878945 [details]
Bug 1374107 - Convert chrome://global/skin/in-content/help-glypeh.svg and its consumers to use SVG image context paint.

https://reviewboard.mozilla.org/r/150198/#review154812

::: toolkit/themes/shared/in-content/help-glyph.svg:6
(Diff revision 1)
>  <!-- This Source Code Form is subject to the terms of the Mozilla Public
>     - License, v. 2.0. If a copy of the MPL was not distributed with this
>     - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
> -<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24" viewBox="0 0 24 24">
> -  <style>
> -    use:not(:target) { display: none; }
> +<svg xmlns="http://www.w3.org/2000/svg"
> +     width="24" height="24" viewBox="0 0 24 24">
> +  <!-- For the purpose of -moz-context-properties, the circle "is the stroke" -->

I'm not sure this comment is as clear as it could be. Ping me if you need more explanation.

Comment 7

[Jonathan Watt [:jwatt]]

check.svg and partial-check.svg appear in the session restore list.

dropdown.svg appears in dropdowns in Firefox Preferences. As far as I can tell the disabled styling is never applied any more (it used to apply in the Privacy options under the History group when checking and unchecking the "Accept cookies from sites" option, but that UI is gone).

radio.svg can be seen in the radio buttons in Firefox Preferences.

help-glyph.svg is displayed at the bottom-left of the Firefox Preferences page.

Comment 8

[Dão Gottwald [:dao]]

None of these icons are used for web content.

Comment 9

[Dão Gottwald [:dao]]

Comment on attachment 8878941 [details]
Bug 1374107 - Convert chrome://global/skin/in-content/check-partial.svg and its consumers to use SVG image context paint.

https://reviewboard.mozilla.org/r/150190/#review156134

Comment 10

[Dão Gottwald [:dao]]

Comment on attachment 8878942 [details]
Bug 1374107 - Convert chrome://global/skin/in-content/check.svg and its consumers to use SVG image context paint.

https://reviewboard.mozilla.org/r/150192/#review156136

Comment 11

[Dão Gottwald [:dao]]

Comment on attachment 8878943 [details]
Bug 1374107 - Convert chrome://global/skin/in-content/dropdown.svg and its consumers to use SVG image context paint.

https://reviewboard.mozilla.org/r/150194/#review156144

Comment 12

[Dão Gottwald [:dao]]

Comment on attachment 8878944 [details]
Bug 1374107 - Convert chrome://global/skin/in-content/radio.svg and its consumers to use SVG image context paint.

https://reviewboard.mozilla.org/r/150196/#review156146

::: toolkit/themes/linux/global/in-content/common.css:78
(Diff revision 1)
>  
>  xul|*.radio-check[selected] {
> -  list-style-image: url("chrome://global/skin/in-content/radio.svg#radio-native");
>    background-color: -moz-dialog;
> +  list-style-image: url("chrome://global/skin/in-content/radio.svg");
> +  -moz-context-properties: fill;

list-style-image and -moz-context-properties should already be set here from common.inc.css

::: toolkit/themes/windows/global/in-content/common.css:54
(Diff revision 1)
>  
>    xul|*.radio-check[selected] {
> -    list-style-image: url("chrome://global/skin/in-content/radio.svg#radio-native");
>      background-color: -moz-dialog;
> +    list-style-image: url("chrome://global/skin/in-content/radio.svg");
> +    -moz-context-properties: fill;

ditto

Comment 13

[Dão Gottwald [:dao]]

Comment on attachment 8878942 [details]
Bug 1374107 - Convert chrome://global/skin/in-content/check.svg and its consumers to use SVG image context paint.

https://reviewboard.mozilla.org/r/150192/#review156148

::: toolkit/themes/linux/global/in-content/common.css:61
(Diff revision 1)
>  }
>  
>  xul|*.checkbox-check[checked] {
> -  list-style-image: url("chrome://global/skin/in-content/check.svg#check-native");
> +  list-style-image: url("chrome://global/skin/in-content/check.svg");
> +  -moz-context-properties: fill, stroke;
> +  fill: -moz-dialogText;

ditto

::: toolkit/themes/windows/global/in-content/common.css:35
(Diff revision 1)
>    }
>  
>    xul|*.checkbox-check[checked] {
> -    list-style-image: url("chrome://global/skin/in-content/check.svg#check-native");
> +    list-style-image: url("chrome://global/skin/in-content/check.svg");
> +    -moz-context-properties: fill, stroke;
> +    fill: -moz-dialogText;

ditto

Comment 14

[Dão Gottwald [:dao]]

Comment on attachment 8878945 [details]
Bug 1374107 - Convert chrome://global/skin/in-content/help-glypeh.svg and its consumers to use SVG image context paint.

https://reviewboard.mozilla.org/r/150198/#review156152

::: toolkit/themes/shared/in-content/help-glyph.svg:6
(Diff revision 1)
>  <!-- This Source Code Form is subject to the terms of the Mozilla Public
>     - License, v. 2.0. If a copy of the MPL was not distributed with this
>     - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
> -<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24" viewBox="0 0 24 24">
> -  <style>
> -    use:not(:target) { display: none; }
> +<svg xmlns="http://www.w3.org/2000/svg"
> +     width="24" height="24" viewBox="0 0 24 24">
> +  <!-- For the purpose of -moz-context-properties, the circle "is the stroke" -->

Yeah, I don't understand what this means.

Comment 15

[Dão Gottwald [:dao]]

Comment on attachment 8878945 [details]
Bug 1374107 - Convert chrome://global/skin/in-content/help-glypeh.svg and its consumers to use SVG image context paint.

https://reviewboard.mozilla.org/r/150198/#review156194

Comment 16

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/2a700b54c430
Convert chrome://global/skin/in-content/check-partial.svg and its consumers to use SVG image context paint. r=dao
https://hg.mozilla.org/integration/mozilla-inbound/rev/b49c6dd70643
Convert chrome://global/skin/in-content/check.svg and its consumers to use SVG image context paint. r=dao
https://hg.mozilla.org/integration/mozilla-inbound/rev/f9f028da99d4
Convert chrome://global/skin/in-content/dropdown.svg and its consumers to use SVG image context paint. r=dao
https://hg.mozilla.org/integration/mozilla-inbound/rev/28d1422a2e61
Convert chrome://global/skin/in-content/radio.svg and its consumers to use SVG image context paint. r=dao
https://hg.mozilla.org/integration/mozilla-inbound/rev/435589fde074
Convert chrome://global/skin/in-content/help-glyph.svg and its consumers to use SVG image context paint. r=dao

Comment 17

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

https://hg.mozilla.org/mozilla-central/rev/2a700b54c430
https://hg.mozilla.org/mozilla-central/rev/b49c6dd70643
https://hg.mozilla.org/mozilla-central/rev/f9f028da99d4
https://hg.mozilla.org/mozilla-central/rev/28d1422a2e61
https://hg.mozilla.org/mozilla-central/rev/435589fde074