Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 70be9fe

Browse files
Add non-maskable PWA icons
It seems Chromium cannot use maskable icons. It complains that the "purpose" must contain "any", however maskable icons are not suitable for the "any" purpose. So, add pre-masked icons to be used for the "any" purpose.
1 parent 729456b commit 70be9fe

File tree

6 files changed

+28
-8
lines changed

6 files changed

+28
-8
lines changed

‎ci/dev/gen_icons.sh‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,10 +24,20 @@ main() {
2424
# Generate PWA icons. There should be enough padding to support masking.
2525
convert -quiet -border 60x60 -bordercolor white -background white \
2626
-resize 192x192 -density 192x192 \
27-
favicon.svg pwa-icon-192.png
27+
favicon.svg pwa-icon-maskable-192.png
2828
convert -quiet -border 160x160 -bordercolor white -background white \
2929
-resize 512x512 -density 512x512 \
30-
favicon.svg pwa-icon-512.png
30+
favicon.svg pwa-icon-maskable-512.png
31+
32+
# Generate non-maskable PWA icons.
33+
magick pwa-icon-maskable-192.png \
34+
\( +clone -threshold 101% -fill white -draw "roundRectangle 0,0 %[fx:int(w)],%[fx:int(h)] 50,50" \) \
35+
-channel-fx "| gray=>alpha" \
36+
pwa-icon-192.png
37+
magick pwa-icon-maskable-512.png \
38+
\( +clone -threshold 101% -fill white -draw "roundRectangle 0,0 %[fx:int(w)],%[fx:int(h)] 100,100" \) \
39+
-channel-fx "| gray=>alpha" \
40+
pwa-icon-512.png
3141

3242
# The following adds dark mode support for the favicon as
3343
# favicon-dark-support.svg There is no similar capability for pwas or .ico so

‎src/browser/media/pwa-icon-192.png‎

1.44 KB
Loading[フレーム]

‎src/browser/media/pwa-icon-512.png‎

3.15 KB
Loading[フレーム]
1.76 KB
Loading[フレーム]
5.14 KB
Loading[フレーム]

‎src/node/routes/vscode.ts‎

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -186,12 +186,22 @@ router.get("/manifest.json", async (req, res) => {
186186
display: "fullscreen",
187187
display_override: ["window-controls-overlay"],
188188
description: "Run Code on a remote server.",
189-
icons: [192, 512].map((size) => ({
190-
src: `{{BASE}}/_static/src/browser/media/pwa-icon-${size}.png`,
191-
type: "image/png",
192-
sizes: `${size}x${size}`,
193-
purpose: "maskable",
194-
})),
189+
icons: [192, 512]
190+
.map((size) => [
191+
{
192+
src: `{{BASE}}/_static/src/browser/media/pwa-icon-${size}.png`,
193+
type: "image/png",
194+
sizes: `${size}x${size}`,
195+
purpose: "any",
196+
},
197+
{
198+
src: `{{BASE}}/_static/src/browser/media/pwa-icon-maskable-${size}.png`,
199+
type: "image/png",
200+
sizes: `${size}x${size}`,
201+
purpose: "maskable",
202+
},
203+
])
204+
.flat(),
195205
},
196206
null,
197207
2,

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /