Use the same SVG images, in the default viewer, regardless of the CSS theme

As mentioned in https://github.com/mozilla/pdf.js/wiki/Frequently-Asked-Questions#faq-support, PDF.js version `2.6.347` is the last release with IE 11/Edge support.
Hence we should now be able to reduce unnecessary duplication in the default viewer image resources, note the files in the `web/images/` folder with a `-dark` suffix, by using only *one* SVG-image for each icon and letting the `background-color` depend on the CSS theme instead.

For the `gulp mozcentral` build-target, the resulting `web/images/` folder is reduced from `43 997` to `28 566` bytes (~35 percent).

*Please note:* I don't really know if this implementation is necessarily the *best* solution, but it seems to work well enough in e.g. Firefox Nightly and Google Chrome Beta as far as my testing goes.
This commit is contained in:
Jonas Jenwald 2020-11-29 15:32:15 +01:00
parent e072f1db6b
commit f2ec546cbb
35 changed files with 82 additions and 208 deletions

View File

@ -1,6 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M8 12a1 1 0 0 1-.707-.293l-5-5a1 1 0 0 1 1.414-1.414L8
9.586l4.293-4.293a1 1 0 0 1 1.414 1.414l-5 5A1 1 0 0 1 8 12z"></path></svg>

Before

Width:  |  Height:  |  Size: 461 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M13 11a1 1 0 0 1-.707-.293L8 6.414l-4.293 4.293a1 1 0 0 1-1.414-1.414l5-5a1 1 0 0 1 1.414 0l5 5A1 1 0 0 1 13 11z"></path></svg>

Before

Width:  |  Height:  |  Size: 458 B

View File

@ -1,16 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16
16"
fill="rgba(255,255,255,1)">
<path
d="M8 16a8 8 0 1 1 8-8 8.009 8.009 0 0 1-8 8zM8 2a6 6 0 1 0 6 6 6.006 6.006 0 0 0-6-6z">
</path>
<path
d="M8 7a1 1 0 0 0-1 1v3a1 1 0 0 0 2 0V8a1 1 0 0 0-1-1z">
</path>
<circle
cx="8" cy="5" r="1.188">
</circle>
</svg>

Before

Width:  |  Height:  |  Size: 557 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
fill="rgba(255,255,255,1)"><path d="M13 13c-.3 0-.5-.1-.7-.3L8 8.4l-4.3 4.3c-.9.9-2.3-.5-1.4-1.4l5-5c.4-.4 1-.4 1.4 0l5 5c.6.6.2 1.7-.7 1.7zm0-11H3C1.7 2 1.7 4 3 4h10c1.3 0 1.3-2 0-2z"/></svg>

Before

Width:  |  Height:  |  Size: 255 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"
fill="rgba(255,255,255,1)"><path d="M15 3.7V13c0 1.5-1.53 3-3 3H7.13c-.72 0-1.63-.5-2.13-1l-5-5s.84-1 .87-1c.13-.1.33-.2.53-.2.1 0 .3.1.4.2L4 10.6V2.7c0-.6.4-1 1-1s1 .4 1 1v4.6h1V1c0-.6.4-1 1-1s1 .4 1 1v6.3h1V1.7c0-.6.4-1 1-1s1 .4 1 1v5.7h1V3.7c0-.6.4-1 1-1s1 .4 1 1z"/></svg>

Before

Width:  |  Height:  |  Size: 339 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
fill="rgba(255,255,255,1)"><path d="M8 10c-.3 0-.5-.1-.7-.3l-5-5c-.9-.9.5-2.3 1.4-1.4L8 7.6l4.3-4.3c.9-.9 2.3.5 1.4 1.4l-5 5c-.2.2-.4.3-.7.3zm5 2H3c-1.3 0-1.3 2 0 2h10c1.3 0 1.3-2 0-2z"/></svg>

Before

Width:  |  Height:  |  Size: 256 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"
fill="rgba(255,255,255,1)"><path d="M1 1a1 1 0 011 1v2.4A7 7 0 118 15a7 7 0 01-4.9-2 1 1 0 011.4-1.5 5 5 0 10-1-5.5H6a1 1 0 010 2H1a1 1 0 01-1-1V2a1 1 0 011-1z"/></svg>

Before

Width:  |  Height:  |  Size: 231 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M15 1a1 1 0 0 0-1 1v2.418A6.995 6.995 0 1 0 8 15a6.954 6.954 0 0 0 4.95-2.05 1 1 0 0 0-1.414-1.414A5.019 5.019 0 1 1 12.549 6H10a1 1 0 0 0 0 2h5a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1z"></path></svg>

Before

Width:  |  Height:  |  Size: 521 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"
fill="rgba(255,255,255,1)"><path d="M0 4h1.5c1 0 1.5.5 1.5 1.5v5c0 1-.5 1.5-1.5 1.5H0zM9.5 4c1 0 1.5.5 1.5 1.5v5c0 1-.5 1.5-1.5 1.5h-3c-1 0-1.5-.5-1.5-1.5v-5C5 4.5 5.5 4 6.5 4zM16 4h-1.5c-1 0-1.5.5-1.5 1.5v5c0 1 .5 1.5 1.5 1.5H16z"/></svg>

Before

Width:  |  Height:  |  Size: 302 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"
fill="rgba(255,255,255,1)"><path d="M9.5 4c1 0 1.5.5 1.5 1.5v5c0 1-.5 1.5-1.5 1.5h-3c-1 0-1.5-.5-1.5-1.5v-5C5 4.5 5.5 4 6.5 4zM11 0v.5c0 1-.5 1.5-1.5 1.5h-3C5.5 2 5 1.5 5 .5V0h6zM11 16v-.5c0-1-.5-1.5-1.5-1.5h-3c-1 0-1.5.5-1.5 1.5v.5h6z"/></svg>

Before

Width:  |  Height:  |  Size: 307 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
fill="rgba(255,255,255,1)"><path d="M5.5 4c1 0 1.5.5 1.5 1.5v5c0 1-.5 1.5-1.5 1.5h-3c-1 0-1.5-.5-1.5-1.5v-5C1 4.5 1.5 4 2.5 4zM7 0v.5C7 1.5 6.5 2 5.5 2h-3C1.5 2 1 1.5 1 .5V0h6zM7 16v-.5c0-1-.5-1.5-1.5-1.5h-3c-1 0-1.5.5-1.5 1.5v.5h6zM13.5 4c1 0 1.5.5 1.5 1.5v5c0 1-.5 1.5-1.5 1.5h-3c-1 0-1.5-.5-1.5-1.5v-5c0-1 .5-1.5 1.5-1.5zM15 0v.5c0 1-.5 1.5-1.5 1.5h-3C9.5 2 9 1.5 9 .5V0h6zM15 16v-.507c0-1-.5-1.5-1.5-1.5h-3C9.5 14 9 14.5 9 15.5v.5h6z"/></svg>

Before

Width:  |  Height:  |  Size: 509 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M12.408 8.217l-8.083-6.7A.2.2 0 0 0 4 1.672V12.3a.2.2 0 0 0 .333.146l2.56-2.372 1.857 3.9A1.125 1.125 0 1 0 10.782 13L8.913 9.075l3.4-.51a.2.2 0 0 0 .095-.348z"></path></svg>

Before

Width:  |  Height:  |  Size: 505 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
fill="rgba(255,255,255,1)"><path d="M1.5 3.5C.5 3.5 0 4 0 5v6.5c0 1 .5 1.5 1.5 1.5h4c1 0 1.5-.5 1.5-1.5V5c0-1-.5-1.5-1.5-1.5zm2 1.2c.8 0 1.4.2 1.8.6.5.4.7 1 .7 1.7 0 .5-.2 1-.5 1.4-.2.3-.5.7-1 1l-.6.4c-.4.3-.6.4-.75.56-.15.14-.25.24-.35.44H6v1.3H1c0-.6.1-1.1.3-1.5.3-.6.7-1 1.5-1.6.7-.4 1.1-.8 1.28-1 .32-.3.42-.6.42-1 0-.3-.1-.6-.23-.8-.17-.2-.37-.3-.77-.3s-.7.1-.9.5c-.04.2-.1.5-.1.9H1.1c0-.6.1-1.1.3-1.5.4-.7 1.1-1.1 2.1-1.1zM10.54 3.54C9.5 3.54 9 4 9 5v6.5c0 1 .5 1.5 1.54 1.5h4c.96 0 1.46-.5 1.46-1.5V5c0-1-.5-1.46-1.5-1.46zm1.9.95c.7 0 1.3.2 1.7.5.4.4.6.8.6 1.4 0 .4-.1.8-.4 1.1-.2.2-.3.3-.5.4.1 0 .3.1.6.3.4.3.5.8.5 1.4 0 .6-.2 1.2-.6 1.6-.4.5-1.1.7-1.9.7-1 0-1.8-.3-2.2-1-.14-.29-.24-.69-.24-1.29h1.4c0 .3 0 .5.1.7.2.4.5.5 1 .5.3 0 .5-.1.7-.3.2-.2.3-.5.3-.8 0-.5-.2-.8-.6-.95-.2-.05-.5-.15-1-.15v-1c.5 0 .8-.1 1-.14.3-.1.5-.4.5-.9 0-.3-.1-.5-.2-.7-.2-.2-.4-.3-.7-.3-.3 0-.6.1-.75.3-.2.2-.2.5-.2.86h-1.34c0-.4.1-.7.19-1.1 0-.12.2-.32.4-.62.2-.2.4-.3.7-.4.3-.1.6-.1 1-.1z"/></svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"
fill="rgba(255,255,255,1)"><path d="M6 3c-1 0-1.5.5-1.5 1.5v7c0 1 .5 1.5 1.5 1.5h4c1 0 1.5-.5 1.5-1.5v-7c0-1-.5-1.5-1.5-1.5z"/></svg>

Before

Width:  |  Height:  |  Size: 196 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
fill="rgba(255,255,255,1)"><path d="M10.56 3.5C9.56 3.5 9 4 9 5v6.5c0 1 .5 1.5 1.5 1.5h4c1 0 1.5-.5 1.5-1.5V5c0-1-.5-1.5-1.5-1.5zm1.93 1.2c.8 0 1.4.2 1.8.64.5.4.7 1 .7 1.7 0 .5-.2 1-.5 1.44-.2.3-.6.6-1 .93l-.6.4c-.4.3-.6.4-.7.55-.1.1-.2.2-.3.4h3.2v1.27h-5c0-.5.1-1 .3-1.43.2-.49.7-1 1.5-1.54.7-.5 1.1-.8 1.3-1.02.3-.3.4-.7.4-1.05 0-.3-.1-.6-.3-.77-.2-.2-.4-.3-.7-.3-.4 0-.7.2-.9.5-.1.2-.1.5-.2.9h-1.4c0-.6.2-1.1.3-1.5.4-.7 1.1-1.1 2-1.1zM1.54 3.5C.54 3.5 0 4 0 5v6.5c0 1 .5 1.5 1.54 1.5h4c1 0 1.5-.5 1.5-1.5V5c0-1-.5-1.5-1.5-1.5zm1.8 1.125H4.5V12H3V6.9H1.3v-1c.5 0 .8 0 .97-.03.33-.07.53-.17.73-.37.1-.2.2-.3.25-.5.05-.2.05-.3.05-.3z"/></svg>

Before

Width:  |  Height:  |  Size: 705 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"
fill="rgba(255,255,255,1)"><path d="M4 16V2s0-1 1-1h6s1 0 1 1v14l-4-5z"/></svg>

Before

Width:  |  Height:  |  Size: 142 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M14 3h-2v2h2v8H2V5h7V3h-.849L6.584 1.538A2 2 0 0 0 5.219 1H2a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V5a2 2 0 0 0-2-2zM2 3h3.219l1.072 1H2z"></path><path d="M8.146 6.146a.5.5 0 0 0 0 .707l2 2a.5.5 0 0 0 .707 0l2-2a.5.5 0 1 0-.707-.707L11 7.293V.5a.5.5 0 0 0-1 0v6.793L8.854 6.146a.5.5 0 0 0-.708 0z"></path></svg>

Before

Width:  |  Height:  |  Size: 651 B

View File

@ -1 +0,0 @@
<svg width="16" height="16" xmlns="http://www.w3.org/2000/svg" fill="rgba(255,255,255,1)"><path d="M8 11a1 1 0 01-.707-.293l-2.99-2.99c-.91-.942.471-2.324 1.414-1.414L8 8.586l2.283-2.283c.943-.91 2.324.472 1.414 1.414l-2.99 2.99A1 1 0 018 11z"/></svg>

Before

Width:  |  Height:  |  Size: 251 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M14.859 3.2a1.335 1.335 0 0 1-1.217.8H13v1h1v8H2V5h8V4h-.642a1.365 1.365 0 0 1-1.325-1.11L6.584 1.538A2 2 0 0 0 5.219 1H2a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V5a2 2 0 0 0-1.141-1.8zM2 3h3.219l1.072 1H2zm7.854-.146L11 1.707V8.5a.5.5 0 0 0 1 0V1.707l1.146 1.146a.5.5 0 1 0 .707-.707l-2-2a.5.5 0 0 0-.707 0l-2 2a.5.5 0 0 0 .707.707z"></path></svg>

Before

Width:  |  Height:  |  Size: 686 B

View File

@ -1,8 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16
16"
fill="rgba(255,255,255,1)"><path transform='rotate(90) translate(0, -16)'
d="M15.707 7.293l-6-6a1 1 0 0 0-1.414 1.414L12.586 7H1a1 1 0 0 0 0 2h11.586l-4.293
4.293a1 1 0 1 0 1.414 1.414l6-6a1 1 0 0 0 0-1.414z"></path></svg>

Before

Width:  |  Height:  |  Size: 517 B

View File

@ -1,13 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16
16"
fill="rgba(255,255,255,1)">
<path
transform='rotate(90) translate(0, -16)'
d="M15 7H3.414l4.293-4.293a1 1 0 0
0-1.414-1.414l-6 6a1 1 0 0 0 0 1.414l6 6a1 1 0 0 0 1.414-1.414L3.414 9H15a1 1 0 0
0 0-2z">
</path>
</svg>

Before

Width:  |  Height:  |  Size: 517 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
fill="rgba(255,255,255,1)"><path d="M.5 1H7s0-1 1-1 1 1 1 1h6.5s.5 0 .5.5-.5.5-.5.5H.5S0 2 0 1.5.5 1 .5 1zM1 3h14v7c0 2-1 2-2 2H3c-1 0-2 0-2-2zm5 1v7l6-3.5zM3.72 15.33l.53-2s0-.5.65-.35c.51.13.38.63.38.63l-.53 2s0 .5-.64.35c-.53-.13-.39-.63-.39-.63zM11.24 15.61l-.53-1.99s0-.5.38-.63c.51-.13.64.35.64.35l.53 2s0 .5-.38.63c-.5.13-.64-.35-.65-.35z"/></svg>

Before

Width:  |  Height:  |  Size: 417 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M14 5h-1V1a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v4H2a2 2 0 0 0-2 2v5h3v3a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1v-3h3V7a2 2 0 0 0-2-2zM2.5 8a.5.5 0 1 1 .5-.5.5.5 0 0 1-.5.5zm9.5 7H4v-5h8zm0-10H4V1h8zm-6.5 7h4a.5.5 0 0 0 0-1h-4a.5.5 0 1 0 0 1zm0 2h5a.5.5 0 0 0 0-1h-5a.5.5 0 1 0 0 1z"></path></svg>

Before

Width:  |  Height:  |  Size: 610 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M15.707 14.293l-4.822-4.822a6.019 6.019 0 1 0-1.414 1.414l4.822 4.822a1 1 0 0 0 1.414-1.414zM6 10a4 4 0 1 1 4-4 4 4 0 0 1-4 4z"></path></svg>

Before

Width:  |  Height:  |  Size: 472 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M8.707 7.293l-5-5a1 1 0 0 0-1.414 1.414L6.586 8l-4.293 4.293a1 1 0 1 0 1.414 1.414l5-5a1 1 0 0 0 0-1.414zm6 0l-5-5a1 1 0 0 0-1.414 1.414L12.586 8l-4.293 4.293a1 1 0 1 0 1.414 1.414l5-5a1 1 0 0 0 0-1.414z"></path></svg>

Before

Width:  |  Height:  |  Size: 549 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M3 1h10a3.008 3.008 0 0 1 3 3v8a3.009 3.009 0 0 1-3 3H3a3.005 3.005 0 0 1-3-3V4a3.013 3.013 0 0 1 3-3zm11 11V4a1 1 0 0 0-1-1H8v10h5a1 1 0 0 0 1-1zM2 12a1 1 0 0 0 1 1h4V3H3a1 1 0 0 0-1 1v8z"></path><path d="M3.5 5h2a.5.5 0 0 0 0-1h-2a.5.5 0 0 0 0 1zm0 2h2a.5.5 0 0 0 0-1h-2a.5.5 0 0 0 0 1zm1 2h1a.5.5 0 0 0 0-1h-1a.5.5 0 0 0 0 1z"></path></svg>

Before

Width:  |  Height:  |  Size: 674 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"
fill="rgba(255,255,255,1)"><path d="M6.2 2s.5-.5 1.06 0c.5.5 0 1 0 1l-4.6 4.61s-2.5 2.5 0 5 5 0 5 0L13.8 6.4s1.6-1.6 0-3.2-3.2 0-3.2 0L5.8 8s-.7.7 0 1.4 1.4 0 1.4 0l3.9-3.9s.6-.5 1 0c.5.5 0 1 0 1l-3.8 4s-1.8 1.8-3.5 0C3 8.7 4.8 7 4.8 7l4.7-4.9s2.7-2.6 5.3 0c2.6 2.6 0 5.3 0 5.3l-6.2 6.3s-3.5 3.5-7 0 0-7 0-7z"/></svg>

Before

Width:  |  Height:  |  Size: 380 B

View File

@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 4.233 4.233" height="16" width="16" fill="rgba(255,255,255,1)"><path d="M.15 2.992c-.198.1-.2.266-.002.365l1.604.802a.93.93 0 00.729-.001l1.602-.801c.198-.1.197-.264 0-.364l-.695-.348c-1.306.595-2.542 0-2.542 0m-.264.53l.658-.329c.6.252 1.238.244 1.754 0l.659.329-1.536.768zM.15 1.935c-.198.1-.198.265 0 .364l1.604.802a.926.926 0 00.727 0l1.603-.802c.198-.099.198-.264 0-.363l-.694-.35c-1.14.56-2.546.001-2.546.001m-.264.53l.664-.332c.52.266 1.261.235 1.75.002l.659.33-1.537.768zM.15.877c-.198.099-.198.264 0 .363l1.604.802a.926.926 0 00.727 0l1.603-.802c.198-.099.198-.264 0-.363L2.481.075a.926.926 0 00-.727 0zm.43.182L2.117.29l1.538.769-1.538.768z"/></svg>

Before

Width:  |  Height:  |  Size: 712 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16"
fill="rgba(255,255,255,1)"><path d="M14 9H8c-1.3 0-1.3 2 0 2h6c1.3 0 1.3-2 0-2zm0-8H5C3.7 1 3.7 3 5 3h9c1.3 0 1.3-2 0-2zM2 1C1 1 .7 2 1.3 2.7 2 3.3 3 3 3 2c0-.5-.4-1-1-1zm3 8c-1 0-1.3 1-.7 1.7.6.6 1.7.2 1.7-.7 0-.5-.4-1-1-1zM14 5H5C3.6 5 3.6 7 5 7h9c1.3 0 1.3-2 0-2zM2 5c-.9 0-1.4 1-.7 1.7C2 7.3 3 6.9 3 6c0-.6-.5-1-1-1zM14 13H5c-1.3 0-1.3 2 0 2h9c1.3 0 1.3-2 0-2zM2 13c-1 0-1.3 1-.7 1.7.7.6 1.7.2 1.7-.712 0-.5-.4-1-1-1z"/></svg>

Before

Width:  |  Height:  |  Size: 493 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><g style="--darkreader-inline-fill:rgba(81, 82, 83, 0.8);" data-darkreader-inline-fill=""><rect x="1" y="1" width="6" height="6" rx="1" ry="1"></rect><rect x="9" y="1" width="6" height="6" rx="1" ry="1"></rect><rect x="1" y="9" width="6" height="6" rx="1" ry="1"></rect><rect x="9" y="9" width="6" height="6" rx="1" ry="1"></rect></g></svg>

Before

Width:  |  Height:  |  Size: 662 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><path d="M14 7H9V2a1 1 0 0 0-2 0v5H2a1 1 0 0 0 0 2h5v5a1 1 0 0 0 2 0V9h5a1 1 0 0 0 0-2z"></path></svg>

Before

Width:  |  Height:  |  Size: 424 B

View File

@ -1,5 +0,0 @@
<!-- 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" width="16" height="16" viewBox="0 0 16 16"
fill="rgba(255,255,255,1)"><rect x="2" y="7" width="12" height="2" rx="1"></rect></svg>

Before

Width:  |  Height:  |  Size: 382 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
fill="rgba(255,255,255,1)"><path d="M13 9L6 5v8z"/></svg>

Before

Width:  |  Height:  |  Size: 120 B

View File

@ -1,2 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
fill="rgba(255,255,255,1)"><path d="M10 13l4-7H6z"/></svg>

Before

Width:  |  Height:  |  Size: 121 B

View File

@ -32,6 +32,7 @@
--progressBar-indeterminate-blend-color: rgba(116, 177, 239, 1); --progressBar-indeterminate-blend-color: rgba(116, 177, 239, 1);
--scrollbar-color: auto; --scrollbar-color: auto;
--scrollbar-bg-color: auto; --scrollbar-bg-color: auto;
--toolbar-icon-bg-color: rgba(0, 0, 0, 1);
--sidebar-bg-color: rgba(245, 246, 247, 1); --sidebar-bg-color: rgba(245, 246, 247, 1);
--toolbar-bg-color: rgba(249, 249, 250, 1); --toolbar-bg-color: rgba(249, 249, 250, 1);
@ -103,6 +104,7 @@
--progressBar-indeterminate-blend-color: rgba(20, 68, 133, 1); --progressBar-indeterminate-blend-color: rgba(20, 68, 133, 1);
--scrollbar-color: rgba(121, 121, 123, 1); --scrollbar-color: rgba(121, 121, 123, 1);
--scrollbar-bg-color: rgba(35, 35, 39, 1); --scrollbar-bg-color: rgba(35, 35, 39, 1);
--toolbar-icon-bg-color: rgba(255, 255, 255, 1);
--sidebar-bg-color: rgba(50, 50, 52, 1); --sidebar-bg-color: rgba(50, 50, 52, 1);
--toolbar-bg-color: rgba(56, 56, 61, 1); --toolbar-bg-color: rgba(56, 56, 61, 1);
@ -127,41 +129,10 @@
--overlay-button-bg-color: rgba(92, 92, 97, 1); --overlay-button-bg-color: rgba(92, 92, 97, 1);
--overlay-button-hover-color: rgba(115, 115, 115, 1); --overlay-button-hover-color: rgba(115, 115, 115, 1);
/* This image is used in <input> elements, which unfortunately means that
* the `mask-image` approach used with all of the other images doesn't work
* here; hence why we still have two versions of this particular image. */
--loading-icon: url(images/loading-dark.svg); --loading-icon: url(images/loading-dark.svg);
--treeitem-expanded-icon: url(images/treeitem-expanded-dark.svg);
--treeitem-collapsed-icon: url(images/treeitem-collapsed-dark.svg);
--toolbarButton-menuArrow-icon: url(images/toolbarButton-menuArrow-dark.svg);
--toolbarButton-sidebarToggle-icon: url(images/toolbarButton-sidebarToggle-dark.svg);
--toolbarButton-secondaryToolbarToggle-icon: url(images/toolbarButton-secondaryToolbarToggle-dark.svg);
--toolbarButton-pageUp-icon: url(images/toolbarButton-pageUp-dark.svg);
--toolbarButton-pageDown-icon: url(images/toolbarButton-pageDown-dark.svg);
--toolbarButton-zoomOut-icon: url(images/toolbarButton-zoomOut-dark.svg);
--toolbarButton-zoomIn-icon: url(images/toolbarButton-zoomIn-dark.svg);
--toolbarButton-presentationMode-icon: url(images/toolbarButton-presentationMode-dark.svg);
--toolbarButton-print-icon: url(images/toolbarButton-print-dark.svg);
--toolbarButton-openFile-icon: url(images/toolbarButton-openFile-dark.svg);
--toolbarButton-download-icon: url(images/toolbarButton-download-dark.svg);
--toolbarButton-bookmark-icon: url(images/toolbarButton-bookmark-dark.svg);
--toolbarButton-viewThumbnail-icon: url(images/toolbarButton-viewThumbnail-dark.svg);
--toolbarButton-viewOutline-icon: url(images/toolbarButton-viewOutline-dark.svg);
--toolbarButton-viewAttachments-icon: url(images/toolbarButton-viewAttachments-dark.svg);
--toolbarButton-viewLayers-icon: url(images/toolbarButton-viewLayers-dark.svg);
--toolbarButton-search-icon: url(images/toolbarButton-search-dark.svg);
--findbarButton-previous-icon: url(images/findbarButton-previous-dark.svg);
--findbarButton-next-icon: url(images/findbarButton-next-dark.svg);
--secondaryToolbarButton-firstPage-icon: url(images/secondaryToolbarButton-firstPage-dark.svg);
--secondaryToolbarButton-lastPage-icon: url(images/secondaryToolbarButton-lastPage-dark.svg);
--secondaryToolbarButton-rotateCcw-icon: url(images/secondaryToolbarButton-rotateCcw-dark.svg);
--secondaryToolbarButton-rotateCw-icon: url(images/secondaryToolbarButton-rotateCw-dark.svg);
--secondaryToolbarButton-selectTool-icon: url(images/secondaryToolbarButton-selectTool-dark.svg);
--secondaryToolbarButton-handTool-icon: url(images/secondaryToolbarButton-handTool-dark.svg);
--secondaryToolbarButton-scrollVertical-icon: url(images/secondaryToolbarButton-scrollVertical-dark.svg);
--secondaryToolbarButton-scrollHorizontal-icon: url(images/secondaryToolbarButton-scrollHorizontal-dark.svg);
--secondaryToolbarButton-scrollWrapped-icon: url(images/secondaryToolbarButton-scrollWrapped-dark.svg);
--secondaryToolbarButton-spreadNone-icon: url(images/secondaryToolbarButton-spreadNone-dark.svg);
--secondaryToolbarButton-spreadOdd-icon: url(images/secondaryToolbarButton-spreadOdd-dark.svg);
--secondaryToolbarButton-spreadEven-icon: url(images/secondaryToolbarButton-spreadEven-dark.svg);
--secondaryToolbarButton-documentProperties-icon: url(images/secondaryToolbarButton-documentProperties-dark.svg);
} }
} }
@ -903,12 +874,11 @@ html[dir="rtl"] #toolbarViewerLeft > .toolbarButton:first-child {
margin-top: 2px !important; margin-top: 2px !important;
} }
.dropdownToolbarButton::after { .dropdownToolbarButton::after {
position: absolute;
display: inline-block;
top: 6px; top: 6px;
content: var(--toolbarButton-menuArrow-icon);
pointer-events: none; pointer-events: none;
max-width: 16px;
-webkit-mask-image: var(--toolbarButton-menuArrow-icon);
mask-image: var(--toolbarButton-menuArrow-icon);
} }
html[dir="ltr"] .dropdownToolbarButton::after { html[dir="ltr"] .dropdownToolbarButton::after {
right: 7px; right: 7px;
@ -984,13 +954,23 @@ html[dir="rtl"] #findNext {
} }
.toolbarButton::before, .toolbarButton::before,
.secondaryToolbarButton::before { .secondaryToolbarButton::before,
.dropdownToolbarButton::after {
/* All matching images have a size of 16x16 /* All matching images have a size of 16x16
* All relevant containers have a size of 28x28 */ * All relevant containers have a size of 28x28 */
position: absolute; position: absolute;
display: inline-block; display: inline-block;
width: 16px;
height: 16px;
content: "";
background-color: var(--toolbar-icon-bg-color);
-webkit-mask-size: cover;
mask-size: cover;
}
.toolbarButton::before,
.secondaryToolbarButton::before {
left: 6px; left: 6px;
max-width: 16px;
} }
html[dir="ltr"] .secondaryToolbarButton::before { html[dir="ltr"] .secondaryToolbarButton::before {
@ -1001,73 +981,85 @@ html[dir="rtl"] .secondaryToolbarButton::before {
} }
.toolbarButton#sidebarToggle::before { .toolbarButton#sidebarToggle::before {
content: var(--toolbarButton-sidebarToggle-icon); -webkit-mask-image: var(--toolbarButton-sidebarToggle-icon);
mask-image: var(--toolbarButton-sidebarToggle-icon);
} }
html[dir="rtl"] .toolbarButton#sidebarToggle::before { html[dir="rtl"] .toolbarButton#sidebarToggle::before {
transform: scaleX(-1); transform: scaleX(-1);
} }
.toolbarButton#secondaryToolbarToggle::before { .toolbarButton#secondaryToolbarToggle::before {
content: var(--toolbarButton-secondaryToolbarToggle-icon); -webkit-mask-image: var(--toolbarButton-secondaryToolbarToggle-icon);
mask-image: var(--toolbarButton-secondaryToolbarToggle-icon);
} }
html[dir="rtl"] .toolbarButton#secondaryToolbarToggle::before { html[dir="rtl"] .toolbarButton#secondaryToolbarToggle::before {
transform: scaleX(-1); transform: scaleX(-1);
} }
.toolbarButton.findPrevious::before { .toolbarButton.findPrevious::before {
content: var(--findbarButton-previous-icon); -webkit-mask-image: var(--findbarButton-previous-icon);
mask-image: var(--findbarButton-previous-icon);
} }
html[dir="rtl"] .toolbarButton.findPrevious::before { html[dir="rtl"] .toolbarButton.findPrevious::before {
transform: scaleX(-1); transform: scaleX(-1);
} }
.toolbarButton.findNext::before { .toolbarButton.findNext::before {
content: var(--findbarButton-next-icon); -webkit-mask-image: var(--findbarButton-next-icon);
mask-image: var(--findbarButton-next-icon);
} }
html[dir="rtl"] .toolbarButton.findNext::before { html[dir="rtl"] .toolbarButton.findNext::before {
transform: scaleX(-1); transform: scaleX(-1);
} }
.toolbarButton.pageUp::before { .toolbarButton.pageUp::before {
content: var(--toolbarButton-pageUp-icon); -webkit-mask-image: var(--toolbarButton-pageUp-icon);
mask-image: var(--toolbarButton-pageUp-icon);
} }
html[dir="rtl"] .toolbarButton.pageUp::before { html[dir="rtl"] .toolbarButton.pageUp::before {
transform: scaleX(-1); transform: scaleX(-1);
} }
.toolbarButton.pageDown::before { .toolbarButton.pageDown::before {
content: var(--toolbarButton-pageDown-icon); -webkit-mask-image: var(--toolbarButton-pageDown-icon);
mask-image: var(--toolbarButton-pageDown-icon);
} }
html[dir="rtl"] .toolbarButton.pageDown::before { html[dir="rtl"] .toolbarButton.pageDown::before {
transform: scaleX(-1); transform: scaleX(-1);
} }
.toolbarButton.zoomOut::before { .toolbarButton.zoomOut::before {
content: var(--toolbarButton-zoomOut-icon); -webkit-mask-image: var(--toolbarButton-zoomOut-icon);
mask-image: var(--toolbarButton-zoomOut-icon);
} }
.toolbarButton.zoomIn::before { .toolbarButton.zoomIn::before {
content: var(--toolbarButton-zoomIn-icon); -webkit-mask-image: var(--toolbarButton-zoomIn-icon);
mask-image: var(--toolbarButton-zoomIn-icon);
} }
.toolbarButton.presentationMode::before, .toolbarButton.presentationMode::before,
.secondaryToolbarButton.presentationMode::before { .secondaryToolbarButton.presentationMode::before {
content: var(--toolbarButton-presentationMode-icon); -webkit-mask-image: var(--toolbarButton-presentationMode-icon);
mask-image: var(--toolbarButton-presentationMode-icon);
} }
.toolbarButton.print::before, .toolbarButton.print::before,
.secondaryToolbarButton.print::before { .secondaryToolbarButton.print::before {
content: var(--toolbarButton-print-icon); -webkit-mask-image: var(--toolbarButton-print-icon);
mask-image: var(--toolbarButton-print-icon);
} }
.toolbarButton.openFile::before, .toolbarButton.openFile::before,
.secondaryToolbarButton.openFile::before { .secondaryToolbarButton.openFile::before {
content: var(--toolbarButton-openFile-icon); -webkit-mask-image: var(--toolbarButton-openFile-icon);
mask-image: var(--toolbarButton-openFile-icon);
} }
.toolbarButton.download::before, .toolbarButton.download::before,
.secondaryToolbarButton.download::before { .secondaryToolbarButton.download::before {
content: var(--toolbarButton-download-icon); -webkit-mask-image: var(--toolbarButton-download-icon);
mask-image: var(--toolbarButton-download-icon);
} }
.secondaryToolbarButton.bookmark { .secondaryToolbarButton.bookmark {
@ -1082,30 +1074,36 @@ html[dir="rtl"] .toolbarButton.pageDown::before {
.toolbarButton.bookmark::before, .toolbarButton.bookmark::before,
.secondaryToolbarButton.bookmark::before { .secondaryToolbarButton.bookmark::before {
content: var(--toolbarButton-bookmark-icon); -webkit-mask-image: var(--toolbarButton-bookmark-icon);
mask-image: var(--toolbarButton-bookmark-icon);
} }
#viewThumbnail.toolbarButton::before { #viewThumbnail.toolbarButton::before {
content: var(--toolbarButton-viewThumbnail-icon); -webkit-mask-image: var(--toolbarButton-viewThumbnail-icon);
mask-image: var(--toolbarButton-viewThumbnail-icon);
} }
#viewOutline.toolbarButton::before { #viewOutline.toolbarButton::before {
content: var(--toolbarButton-viewOutline-icon); -webkit-mask-image: var(--toolbarButton-viewOutline-icon);
mask-image: var(--toolbarButton-viewOutline-icon);
} }
html[dir="rtl"] #viewOutline.toolbarButton::before { html[dir="rtl"] #viewOutline.toolbarButton::before {
transform: scaleX(-1); transform: scaleX(-1);
} }
#viewAttachments.toolbarButton::before { #viewAttachments.toolbarButton::before {
content: var(--toolbarButton-viewAttachments-icon); -webkit-mask-image: var(--toolbarButton-viewAttachments-icon);
mask-image: var(--toolbarButton-viewAttachments-icon);
} }
#viewLayers.toolbarButton::before { #viewLayers.toolbarButton::before {
content: var(--toolbarButton-viewLayers-icon); -webkit-mask-image: var(--toolbarButton-viewLayers-icon);
mask-image: var(--toolbarButton-viewLayers-icon);
} }
#viewFind.toolbarButton::before { #viewFind.toolbarButton::before {
content: var(--toolbarButton-search-icon); -webkit-mask-image: var(--toolbarButton-search-icon);
mask-image: var(--toolbarButton-search-icon);
} }
.toolbarButton.pdfSidebarNotification::after { .toolbarButton.pdfSidebarNotification::after {
@ -1155,55 +1153,68 @@ html[dir="rtl"] .secondaryToolbarButton > span {
} }
.secondaryToolbarButton.firstPage::before { .secondaryToolbarButton.firstPage::before {
content: var(--secondaryToolbarButton-firstPage-icon); -webkit-mask-image: var(--secondaryToolbarButton-firstPage-icon);
mask-image: var(--secondaryToolbarButton-firstPage-icon);
} }
.secondaryToolbarButton.lastPage::before { .secondaryToolbarButton.lastPage::before {
content: var(--secondaryToolbarButton-lastPage-icon); -webkit-mask-image: var(--secondaryToolbarButton-lastPage-icon);
mask-image: var(--secondaryToolbarButton-lastPage-icon);
} }
.secondaryToolbarButton.rotateCcw::before { .secondaryToolbarButton.rotateCcw::before {
content: var(--secondaryToolbarButton-rotateCcw-icon); -webkit-mask-image: var(--secondaryToolbarButton-rotateCcw-icon);
mask-image: var(--secondaryToolbarButton-rotateCcw-icon);
} }
.secondaryToolbarButton.rotateCw::before { .secondaryToolbarButton.rotateCw::before {
content: var(--secondaryToolbarButton-rotateCw-icon); -webkit-mask-image: var(--secondaryToolbarButton-rotateCw-icon);
mask-image: var(--secondaryToolbarButton-rotateCw-icon);
} }
.secondaryToolbarButton.selectTool::before { .secondaryToolbarButton.selectTool::before {
content: var(--secondaryToolbarButton-selectTool-icon); -webkit-mask-image: var(--secondaryToolbarButton-selectTool-icon);
mask-image: var(--secondaryToolbarButton-selectTool-icon);
} }
.secondaryToolbarButton.handTool::before { .secondaryToolbarButton.handTool::before {
content: var(--secondaryToolbarButton-handTool-icon); -webkit-mask-image: var(--secondaryToolbarButton-handTool-icon);
mask-image: var(--secondaryToolbarButton-handTool-icon);
} }
.secondaryToolbarButton.scrollVertical::before { .secondaryToolbarButton.scrollVertical::before {
content: var(--secondaryToolbarButton-scrollVertical-icon); -webkit-mask-image: var(--secondaryToolbarButton-scrollVertical-icon);
mask-image: var(--secondaryToolbarButton-scrollVertical-icon);
} }
.secondaryToolbarButton.scrollHorizontal::before { .secondaryToolbarButton.scrollHorizontal::before {
content: var(--secondaryToolbarButton-scrollHorizontal-icon); -webkit-mask-image: var(--secondaryToolbarButton-scrollHorizontal-icon);
mask-image: var(--secondaryToolbarButton-scrollHorizontal-icon);
} }
.secondaryToolbarButton.scrollWrapped::before { .secondaryToolbarButton.scrollWrapped::before {
content: var(--secondaryToolbarButton-scrollWrapped-icon); -webkit-mask-image: var(--secondaryToolbarButton-scrollWrapped-icon);
mask-image: var(--secondaryToolbarButton-scrollWrapped-icon);
} }
.secondaryToolbarButton.spreadNone::before { .secondaryToolbarButton.spreadNone::before {
content: var(--secondaryToolbarButton-spreadNone-icon); -webkit-mask-image: var(--secondaryToolbarButton-spreadNone-icon);
mask-image: var(--secondaryToolbarButton-spreadNone-icon);
} }
.secondaryToolbarButton.spreadOdd::before { .secondaryToolbarButton.spreadOdd::before {
content: var(--secondaryToolbarButton-spreadOdd-icon); -webkit-mask-image: var(--secondaryToolbarButton-spreadOdd-icon);
mask-image: var(--secondaryToolbarButton-spreadOdd-icon);
} }
.secondaryToolbarButton.spreadEven::before { .secondaryToolbarButton.spreadEven::before {
content: var(--secondaryToolbarButton-spreadEven-icon); -webkit-mask-image: var(--secondaryToolbarButton-spreadEven-icon);
mask-image: var(--secondaryToolbarButton-spreadEven-icon);
} }
.secondaryToolbarButton.documentProperties::before { .secondaryToolbarButton.documentProperties::before {
content: var(--secondaryToolbarButton-documentProperties-icon); -webkit-mask-image: var(--secondaryToolbarButton-documentProperties-icon);
mask-image: var(--secondaryToolbarButton-documentProperties-icon);
} }
.verticalToolbarSeparator { .verticalToolbarSeparator {