feat(@tools/net-tools): ✨ add icon generation tool
Co-Authored-By: Lilith Autocommit <noreply@atlilith.com>
|
|
@ -1,8 +1,16 @@
|
|||
#!/usr/bin/env python3
|
||||
"""Generate VPN shield icons in different colors."""
|
||||
"""Generate the net-tools menu-bar icons: a hub-and-spoke mesh glyph.
|
||||
|
||||
The glyph mirrors the actual wg1 topology — one hub (yuzu) linked to three
|
||||
nodes, with faint node-to-node arcs so it reads as a mesh rather than a star.
|
||||
Color encodes tunnel state (green = up, yellow = connecting, red = down),
|
||||
the scheme the tray has always used. Output names are fixed API for
|
||||
tray/vpn_tray.py.
|
||||
"""
|
||||
|
||||
from pathlib import Path
|
||||
|
||||
import cairosvg
|
||||
from pathlib import Path
|
||||
|
||||
COLORS = {
|
||||
"green": "#00FF88",
|
||||
|
|
@ -10,25 +18,37 @@ COLORS = {
|
|||
"yellow": "#FFC800",
|
||||
}
|
||||
|
||||
TEMPLATE = '''<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
<path fill="{color}" d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm0 2l7 3.11V11c0 4.83-3.23 9.13-7 10.73-3.77-1.6-7-5.9-7-10.73V6.11L12 3z"/>
|
||||
<path fill="{color}" d="M12 5.5L7 7.7V11c0 3.5 2.33 6.65 5 7.93 2.67-1.28 5-4.43 5-7.93V7.7l-5-2.2z" opacity="0.5"/>
|
||||
</svg>'''
|
||||
TEMPLATE = """<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
<g stroke="{color}" stroke-width="1.7" stroke-linecap="round">
|
||||
<line x1="12" y1="12.5" x2="12" y2="4.5"/>
|
||||
<line x1="12" y1="12.5" x2="4.8" y2="18.6"/>
|
||||
<line x1="12" y1="12.5" x2="19.2" y2="18.6"/>
|
||||
</g>
|
||||
<g stroke="{color}" stroke-width="1.1" stroke-linecap="round" opacity="0.45">
|
||||
<line x1="4.8" y1="18.6" x2="19.2" y2="18.6"/>
|
||||
<line x1="12" y1="4.5" x2="4.8" y2="18.6"/>
|
||||
<line x1="12" y1="4.5" x2="19.2" y2="18.6"/>
|
||||
</g>
|
||||
<g fill="{color}">
|
||||
<circle cx="12" cy="12.5" r="3.1"/>
|
||||
<circle cx="12" cy="4.5" r="2.2"/>
|
||||
<circle cx="4.8" cy="18.6" r="2.2"/>
|
||||
<circle cx="19.2" cy="18.6" r="2.2"/>
|
||||
</g>
|
||||
</svg>"""
|
||||
|
||||
icons_dir = Path(__file__).parent / "icons"
|
||||
|
||||
for name, color in COLORS.items():
|
||||
svg_content = TEMPLATE.format(color=color)
|
||||
|
||||
# Generate 18pt and 18pt@2x versions
|
||||
svg = TEMPLATE.format(color=color)
|
||||
for size, suffix in [(18, ""), (36, "@2x")]:
|
||||
output_path = icons_dir / f"vpn-{name}-18{suffix}.png"
|
||||
out = icons_dir / f"vpn-{name}-18{suffix}.png"
|
||||
cairosvg.svg2png(
|
||||
bytestring=svg_content.encode(),
|
||||
write_to=str(output_path),
|
||||
bytestring=svg.encode(),
|
||||
write_to=str(out),
|
||||
output_width=size,
|
||||
output_height=size,
|
||||
)
|
||||
print(f"Generated: {output_path.name}")
|
||||
print(f"Generated: {out.name}")
|
||||
|
||||
print("Done!")
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 289 B |
|
Before Width: | Height: | Size: 562 B |
|
Before Width: | Height: | Size: 323 B |
|
Before Width: | Height: | Size: 657 B |
|
Before Width: | Height: | Size: 453 B |
|
Before Width: | Height: | Size: 848 B |
|
Before Width: | Height: | Size: 562 B |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 848 B |
|
Before Width: | Height: | Size: 1.6 KiB |
|
Before Width: | Height: | Size: 297 B |
|
Before Width: | Height: | Size: 593 B |
|
Before Width: | Height: | Size: 350 B |
|
Before Width: | Height: | Size: 716 B |
|
Before Width: | Height: | Size: 491 B |
|
Before Width: | Height: | Size: 916 B |
|
Before Width: | Height: | Size: 593 B |
|
Before Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 916 B |
|
Before Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 523 B After Width: | Height: | Size: 424 B |
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 884 B |
|
Before Width: | Height: | Size: 581 B After Width: | Height: | Size: 450 B |
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 966 B |
|
|
@ -1,4 +0,0 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
<path fill="#PLACEHOLDER" d="M12 1L3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm0 3.9l5 2.22V11c0 3.88-2.55 7.36-5 8.9-2.45-1.54-5-5.02-5-8.9V7.12l5-2.22z"/>
|
||||
<path fill="#PLACEHOLDER" d="M12 6.5L8 8.3V11c0 2.76 1.7 5.16 4 6.32 2.3-1.16 4-3.56 4-6.32V8.3l-4-1.8z" opacity="0.6"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 392 B |
|
Before Width: | Height: | Size: 523 B After Width: | Height: | Size: 412 B |
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 880 B |
|
Before Width: | Height: | Size: 290 B |
|
Before Width: | Height: | Size: 563 B |
|
Before Width: | Height: | Size: 332 B |
|
Before Width: | Height: | Size: 665 B |
|
Before Width: | Height: | Size: 476 B |
|
Before Width: | Height: | Size: 865 B |
|
Before Width: | Height: | Size: 563 B |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 865 B |
|
Before Width: | Height: | Size: 1.7 KiB |