From 693fdbefb4a2e9e7d18cf445d0b55e83b6fbcc99 Mon Sep 17 00:00:00 2001 From: Anmol Sethi Date: Fri, 8 Jan 2021 22:59:35 -0500 Subject: [PATCH 1/3] browser: Add favicon.afdesign It requires git-lfs to pull down if you want to adjust the favicon and also the affinity designer software available only on Windows and Mac. Might be a good idea to switch to Figma at some point and commit a .fig file. --- .gitattributes | 1 + src/browser/favicon.afdesign | 3 +++ 2 files changed, 4 insertions(+) create mode 100644 .gitattributes create mode 100644 src/browser/favicon.afdesign diff --git a/.gitattributes b/.gitattributes new file mode 100644 index 00000000..dc5caf93 --- /dev/null +++ b/.gitattributes @@ -0,0 +1 @@ +*.afdesign filter=lfs diff=lfs merge=lfs -text diff --git a/src/browser/favicon.afdesign b/src/browser/favicon.afdesign new file mode 100644 index 00000000..b654f32e --- /dev/null +++ b/src/browser/favicon.afdesign @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:625d2049c38ae27df0613fa533020e889fa98affd603050f46d3748be7b90d0b +size 38675 From fa2aed6d468697c968175e2f649a0206e9e8353a Mon Sep 17 00:00:00 2001 From: Anmol Sethi Date: Sat, 9 Jan 2021 01:45:08 -0500 Subject: [PATCH 2/3] gen_icons.sh: Document pwa-icon vs favicon having different design --- ci/dev/gen_icons.sh | 3 +++ 1 file changed, 3 insertions(+) diff --git a/ci/dev/gen_icons.sh b/ci/dev/gen_icons.sh index 55ec0cc6..432b8f62 100755 --- a/ci/dev/gen_icons.sh +++ b/ci/dev/gen_icons.sh @@ -14,6 +14,9 @@ main() { # -background defaults to white but we want it transparent. # 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 From f15580b28ae021b549a723847497d6f8252b3eb2 Mon Sep 17 00:00:00 2001 From: Anmol Sethi Date: Sat, 9 Jan 2021 01:49:39 -0500 Subject: [PATCH 3/3] favicon: Add dark mode support Closes #2538 Works as expected on latest Firefox and Chromium. --- ci/dev/gen_icons.sh | 18 ++++++++++++++++++ src/browser/media/favicon-dark-support.svg | 7 +++++++ src/browser/pages/error.html | 2 +- src/browser/pages/login.html | 2 +- src/browser/pages/vscode.html | 2 +- 5 files changed, 28 insertions(+), 3 deletions(-) create mode 100644 src/browser/media/favicon-dark-support.svg diff --git a/ci/dev/gen_icons.sh b/ci/dev/gen_icons.sh index 432b8f62..9d27486d 100755 --- a/ci/dev/gen_icons.sh +++ b/ci/dev/gen_icons.sh @@ -21,6 +21,24 @@ main() { convert -quiet -background transparent -resize 512x512 pwa-icon.png pwa-icon-512.png # We use -quiet above to avoid https://github.com/ImageMagick/ImageMagick/issues/884 + + # 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="" + # 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% favicon-dark-support.svg } main "$@" diff --git a/src/browser/media/favicon-dark-support.svg b/src/browser/media/favicon-dark-support.svg new file mode 100644 index 00000000..06f1fa00 --- /dev/null +++ b/src/browser/media/favicon-dark-support.svg @@ -0,0 +1,7 @@ + \ No newline at end of file diff --git a/src/browser/pages/error.html b/src/browser/pages/error.html index 4d24d85f..73a9599b 100644 --- a/src/browser/pages/error.html +++ b/src/browser/pages/error.html @@ -11,7 +11,7 @@ content="style-src 'self'; manifest-src 'self'; img-src 'self' data:; font-src 'self' data:;" /> {{ERROR_TITLE}} - code-server - + diff --git a/src/browser/pages/login.html b/src/browser/pages/login.html index 9f74b296..ef3f16a4 100644 --- a/src/browser/pages/login.html +++ b/src/browser/pages/login.html @@ -11,7 +11,7 @@ content="style-src 'self'; script-src 'self' 'unsafe-inline'; manifest-src 'self'; img-src 'self' data:; font-src 'self' data:;" /> code-server login - + diff --git a/src/browser/pages/vscode.html b/src/browser/pages/vscode.html index c46cb47a..ef61fa5e 100644 --- a/src/browser/pages/vscode.html +++ b/src/browser/pages/vscode.html @@ -24,7 +24,7 @@ - +