i/next-ai-draw-io
1
0
Fork 0
mirror of https://github.com/DayuanJiang/next-ai-draw-io.git synced 2026-10-11 20:19:51 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: redraw the app icon on a white tile with shorter bottom boxes (#985)

Browse Source 
* feat: redraw the app icon on a white tile with shorter bottom boxes

Same org chart shape as before, redrawn as a vector so edges are sharp.
The white tile keeps the icon visible on dark docks, taskbars and tabs,
so dark mode now uses the same image and favicon-white.svg is removed.
The desktop icon is now 1024x1024.

* chore: add SVG sources for the app icon and favicons

resources/icon.svg renders resources/icon.png; resources/favicon.svg renders
the favicon .ico and .png files.

* fix: add a title to the icon SVG sources for the Biome a11y check
This commit is contained in:
Dayuan Jiang
2026-10-11 20:32:23 +09:00
committed by GitHub
parent 77be43d996
commit cb066a4825
10 changed files with 37 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/favicon.ico
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 2.0 KiB

components/workspace/brand-mark.tsx
+2 -8
View File
@@ -3,7 +3,7 @@
import { getAssetUrl } from "@/lib/base-path"
import { cn } from "@/lib/utils"
/** The app icon in a rounded tile; the white variant is used in dark mode */
/** The app icon in a rounded tile; the icon has its own white tile, so dark mode uses it too */
export function BrandMark({ className }: { className?: string }) {
return (
<span
@@ -16,13 +16,7 @@ export function BrandMark({ className }: { className?: string }) {
<img
src={getAssetUrl("/favicon-192x192.png")}
alt=""
className="size-full object-contain dark:hidden"
/>
{/* biome-ignore lint/performance/noImgElement: tiny static icon */}
<img
src={getAssetUrl("/favicon-white.svg")}
alt=""
className="hidden size-5 object-contain dark:block"
className="size-full object-contain"
/>
</span>
)
public/favicon-192x192.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 4.3 KiB

public/favicon-512x512.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 111 KiB

After

Width:  |  Height:  |  Size: 14 KiB

public/favicon-white.svg
-37
View File
@@ -1,37 +0,0 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="1536.000000pt" height="1536.000000pt" viewBox="0 0 1536.000000 1536.000000"
preserveAspectRatio="xMidYMid meet">
<g transform="translate(0.000000,1536.000000) scale(0.100000,-0.100000)"
fill="#ffffff" stroke="none">
<path d="M2765 14404 c-100 -29 -181 -58 -225 -82 -227 -125 -359 -296 -431
-560 -19 -70 -19 -108 -19 -1175 0 -1068 1 -1104 20 -1172 58 -206 159 -356
319 -474 71 -53 199 -121 226 -121 9 0 26 -5 38 -12 12 -6 62 -19 112 -29 85
-17 207 -18 2219 -19 1172 0 2133 -3 2138 -8 4 -4 7 -246 6 -538 l-3 -529
-2330 -5 c-2506 -6 -2373 -3 -2470 -54 -61 -31 -150 -113 -194 -178 -87 -128
-82 -77 -90 -1025 l-6 -838 -360 -6 c-292 -4 -368 -8 -405 -21 -194 -68 -303
-177 -373 -372 l-22 -61 1 -2887 c1 -2716 2 -2890 18 -2935 56 -153 161 -276
286 -334 126 -59 0 -54 1400 -54 1394 0 1290 -4 1410 53 95 45 198 148 242
241 62 133 58 -93 58 3026 0 2992 1 2883 -40 2990 -59 156 -183 272 -360 337
-25 9 -146 14 -440 18 l-405 5 0 540 0 540 2020 3 c1111 1 2030 0 2043 -3 l22
-5 -2 -538 -3 -537 -380 -6 c-312 -4 -388 -8 -426 -21 -195 -68 -326 -204
-383 -399 -15 -51 -16 -295 -16 -2921 0 -2778 1 -2867 19 -2920 36 -104 72
-167 134 -230 75 -78 115 -105 222 -151 l50 -22 1219 -3 c672 -1 1255 1 1300
6 109 12 217 63 298 140 73 69 107 118 144 208 l29 69 3 2880 c2 2687 1 2884
-15 2945 -48 183 -188 332 -373 398 -37 13 -114 17 -430 21 l-385 6 -3 534
c-2 421 0 536 10 543 7 4 925 8 2039 8 1718 0 2028 -2 2038 -14 8 -10 11 -154
11 -531 -1 -284 -4 -523 -7 -531 -4 -12 -69 -14 -392 -14 -354 0 -391 -2 -448
-20 -168 -52 -282 -148 -353 -295 -22 -45 -40 -91 -40 -103 0 -11 -5 -33 -10
-47 -7 -18 -10 -988 -10 -2875 0 -2393 2 -2858 14 -2902 43 -167 148 -298 293
-369 57 -27 107 -44 151 -50 88 -11 2429 -11 2508 0 210 31 416 238 445 450 6
39 8 1245 7 2926 -3 2713 -4 2862 -21 2900 -41 93 -74 150 -110 191 -46 52
-149 134 -169 134 -8 0 -19 5 -24 10 -6 6 -42 19 -80 30 -63 18 -100 20 -415
20 -307 0 -348 2 -353 16 -3 9 -6 390 -6 848 0 797 -1 834 -19 886 -31 87 -50
118 -111 183 -66 70 -141 119 -221 144 -50 16 -228 18 -2389 23 l-2335 5 0
535 0 535 2165 5 c1191 3 2170 8 2176 12 6 4 35 12 65 17 201 35 435 198 539
376 55 93 82 153 110 245 19 63 20 94 20 1167 0 1047 -1 1106 -19 1180 -70
290 -275 523 -539 613 -160 54 232 50 -5028 49 -4182 0 -4856 -2 -4899 -15z"/>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 2.4 KiB

public/favicon.ico
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 8.0 KiB

resources/favicon.svg
+16
View File
@@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
<title>Next AI Draw.io</title>
<!-- Web icon, source of public/favicon.ico, app/favicon.ico and public/favicon-*.png.
The tile fills the canvas so the icon stays large in browser tabs. -->
<rect x="4" y="4" width="1016" height="1016" rx="228" fill="#ffffff" stroke="#dfe3e8" stroke-width="8"/>
<g transform="translate(512 512) scale(0.76) translate(-512 -438)" fill="#14181d">
<rect x="140" y="62" width="744" height="244" rx="56"/>
<rect x="478" y="300" width="68" height="224"/>
<rect x="142" y="378" width="740" height="68" rx="14"/>
<rect x="142" y="378" width="68" height="146" rx="14"/>
<rect x="814" y="378" width="68" height="146" rx="14"/>
<rect x="62" y="518" width="228" height="296" rx="40"/>
<rect x="398" y="518" width="228" height="296" rx="40"/>
<rect x="734" y="518" width="228" height="296" rx="40"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 945 B

resources/icon.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 111 KiB

After

Width:  |  Height:  |  Size: 28 KiB

resources/icon.svg
+18
View File
@@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024">
<title>Next AI Draw.io</title>
<!-- Desktop app icon, source of resources/icon.png (1024x1024).
The tile is 824px wide on the 1024 canvas, following the macOS icon grid. -->
<g transform="translate(100 100) scale(0.8046875)">
<rect x="4" y="4" width="1016" height="1016" rx="228" fill="#ffffff" stroke="#dfe3e8" stroke-width="8"/>
<g transform="translate(512 512) scale(0.66) translate(-512 -438)" fill="#14181d">
<rect x="140" y="62" width="744" height="244" rx="56"/>
<rect x="478" y="300" width="68" height="224"/>
<rect x="142" y="378" width="740" height="68" rx="14"/>
<rect x="142" y="378" width="68" height="146" rx="14"/>
<rect x="814" y="378" width="68" height="146" rx="14"/>
<rect x="62" y="518" width="228" height="296" rx="40"/>
<rect x="398" y="518" width="228" height="296" rx="40"/>
<rect x="734" y="518" width="228" height="296" rx="40"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1013 B

scripts/prepare-electron-build.mjs
+1 -1
View File
@@ -87,7 +87,7 @@ console.log("Copying static files...")
const targetStaticDir = join(targetDir, ".next", "static")
copyDereferenced(staticDir, targetStaticDir)
// Copy public folder (required for favicon-white.svg and other assets)
// Copy public folder (required for favicons and other assets)
console.log("Copying public folder...")
const publicDir = join(rootDir, "public")
const targetPublicDir = join(targetDir, "public")