Update logo

This commit is contained in:
Asher
2025-06-24 19:55:23 -08:00
parent c5c764d78f
commit 1b1440ffd2
9 changed files with 34 additions and 37 deletions

View File

@@ -1,44 +1,40 @@
#!/bin/sh
set -eu
# Generate icons from a single favicon.svg. favicon.svg should have no fill
# colors set.
main() {
cd src/browser/media
# We need .ico for backwards compatibility.
# The other two are the only icon sizes required by Chrome and
# we use them for stuff like apple-touch-icon as well.
# https://web.dev/add-manifest/
# We need .ico for backwards compatibility. The other two are the only icon
# sizes required by Chrome and we use them for stuff like apple-touch-icon as
# well. https://web.dev/add-manifest/
#
# This should be enough and we can always add more if there are problems.
#
# -quiet to avoid https://github.com/ImageMagick/ImageMagick/issues/884
# -background defaults to white but we want it transparent.
# -density somehow makes the image both sharper and smaller in file size.
#
# https://imagemagick.org/script/command-line-options.php#background
convert -quiet -background transparent -resize 256x256 favicon.svg favicon.ico
# We do not generate the pwa-icon from the favicon as they are slightly different
# designs and sizes.
# See favicon.afdesign and #2401 for details on the differences.
convert -quiet -background transparent -resize 192x192 pwa-icon.png pwa-icon-192.png
convert -quiet -background transparent -resize 512x512 pwa-icon.png pwa-icon-512.png
convert -quiet -background transparent \
-resize 256x256 -density 256x256 \
favicon.svg favicon.ico
# We use -quiet above to avoid https://github.com/ImageMagick/ImageMagick/issues/884
# Generate PWA icons. There should be enough padding to support masking.
convert -quiet -border 60x60 -bordercolor white -background white \
-resize 192x192 -density 192x192 \
favicon.svg pwa-icon-192.png
convert -quiet -border 160x160 -bordercolor white -background white \
-resize 512x512 -density 512x512 \
favicon.svg pwa-icon-512.png
# The following adds dark mode support for the favicon as favicon-dark-support.svg
# There is no similar capability for pwas or .ico so we can only add support to the svg.
favicon_dark_style="<style>
@media (prefers-color-scheme: dark) {
* {
fill: white;
}
}
</style>"
# See https://stackoverflow.com/a/22901380/4283659
# This escapes all newlines so that sed will accept them.
favicon_dark_style="$(printf "%s\n" "$favicon_dark_style" | sed -e ':a' -e 'N' -e '$!ba' -e 's/\n/\\n/g')"
sed "$(
cat -n << EOF
s%<rect id="favicon"%$favicon_dark_style<rect id="favicon"%
EOF
)" favicon.svg > favicon-dark-support.svg
# The following adds dark mode support for the favicon as
# favicon-dark-support.svg There is no similar capability for pwas or .ico so
# we can only add support to the svg.
favicon_dark_style="<style>@media (prefers-color-scheme: dark) {* { fill: white; }}</style>"
cp favicon.svg favicon-dark-support.svg
sed "s%<path%$favicon_dark_style\n <path%" favicon.svg > favicon-dark-support.svg
}
main "$@"