Files
fiberops-mobile/scripts/generate-assets.sh
Nemo (Claude Code) 313a2f8a03 feat: app icon/splash asset guidelines + app.json config (FIBEROPS-209)
- Fix slug typo: "firberops" → "fiberops"
- Update splash backgroundColor to brand #F8FAFC (was Expo default #2563EB)
- Update android adaptiveIcon backgroundColor to brand cyan #0891B2
- Add assets/ASSETS.md with full brand guidelines (colors, fonts, dimensions)
- Add scripts/generate-assets.sh to regenerate PNGs from SVG sources via inkscape/rsvg-convert
2026-04-01 01:05:28 +00:00

143 lines
4.9 KiB
Bash
Executable File
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
#!/usr/bin/env bash
# generate-assets.sh — Generate FiberOps PNG assets from SVG sources
#
# Requirements (install one):
# brew install inkscape (macOS / Linux)
# brew install librsvg (lighter: rsvg-convert)
# apt-get install librsvg2-bin (Debian/Ubuntu)
#
# Usage:
# ./scripts/generate-assets.sh
#
# Output: assets/*.png (overwrites existing files)
set -euo pipefail
SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
REPO_ROOT="$(cd "$SCRIPT_DIR/.." && pwd)"
ASSETS="$REPO_ROOT/assets"
SVGS="$SCRIPT_DIR/svg"
# ---------------------------------------------------------------------------
# Check for a suitable SVG renderer
# ---------------------------------------------------------------------------
if command -v inkscape &>/dev/null; then
RENDERER="inkscape"
elif command -v rsvg-convert &>/dev/null; then
RENDERER="rsvg"
else
echo "ERROR: Install inkscape or librsvg (rsvg-convert) first." >&2
echo " macOS: brew install inkscape OR brew install librsvg" >&2
echo " Linux: apt-get install inkscape OR apt-get install librsvg2-bin" >&2
exit 1
fi
export_png() {
local svg="$1" out="$2" w="$3" h="$4"
echo "$out (${w}×${h})"
if [[ "$RENDERER" == "inkscape" ]]; then
inkscape --export-type=png \
--export-filename="$out" \
--export-width="$w" \
--export-height="$h" \
"$svg" 2>/dev/null
else
rsvg-convert -w "$w" -h "$h" -o "$out" "$svg"
fi
}
mkdir -p "$SVGS"
# ---------------------------------------------------------------------------
# Inline SVG sources (written to scripts/svg/ so they can be edited)
# ---------------------------------------------------------------------------
# 1. icon-bg.svg — opaque cyan square with "FO" (used for icon.png)
cat > "$SVGS/icon-bg.svg" <<'SVG'
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024">
<rect width="1024" height="1024" rx="230" ry="230" fill="#0891B2"/>
<text x="512" y="590"
font-family="'Fira Sans', 'Inter', sans-serif"
font-weight="700"
font-size="460"
text-anchor="middle"
fill="#FFFFFF">FO</text>
</svg>
SVG
# 2. icon-fg.svg — transparent background, white "FO" (adaptive icon foreground)
cat > "$SVGS/icon-fg.svg" <<'SVG'
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024">
<text x="512" y="590"
font-family="'Fira Sans', 'Inter', sans-serif"
font-weight="700"
font-size="460"
text-anchor="middle"
fill="#FFFFFF">FO</text>
</svg>
SVG
# 3. splash.svg — transparent, centered logo for splash (composited over #F8FAFC)
cat > "$SVGS/splash.svg" <<'SVG'
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024">
<!-- Circle backdrop -->
<circle cx="512" cy="430" r="220" fill="#0891B2"/>
<!-- "FO" inside circle -->
<text x="512" y="505"
font-family="'Fira Sans', 'Inter', sans-serif"
font-weight="700"
font-size="200"
text-anchor="middle"
fill="#FFFFFF">FO</text>
<!-- "FiberOps" wordmark below -->
<text x="512" y="730"
font-family="'Fira Sans', 'Inter', sans-serif"
font-weight="600"
font-size="110"
text-anchor="middle"
fill="#0891B2">FiberOps</text>
</svg>
SVG
# 4. favicon.svg — tiny "F" on cyan
cat > "$SVGS/favicon.svg" <<'SVG'
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48" height="48">
<rect width="48" height="48" rx="8" fill="#0891B2"/>
<text x="24" y="36"
font-family="'Fira Sans', 'Inter', sans-serif"
font-weight="700"
font-size="30"
text-anchor="middle"
fill="#FFFFFF">F</text>
</svg>
SVG
# 5. monochrome.svg — white "FO" on transparent (Android 13 themed icon)
cat > "$SVGS/monochrome.svg" <<'SVG'
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024">
<text x="512" y="590"
font-family="'Fira Sans', 'Inter', sans-serif"
font-weight="700"
font-size="460"
text-anchor="middle"
fill="#FFFFFF">FO</text>
</svg>
SVG
# ---------------------------------------------------------------------------
# Export PNGs
# ---------------------------------------------------------------------------
echo "Exporting PNGs..."
export_png "$SVGS/icon-bg.svg" "$ASSETS/icon.png" 1024 1024
export_png "$SVGS/icon-fg.svg" "$ASSETS/adaptive-icon.png" 1024 1024
export_png "$SVGS/icon-fg.svg" "$ASSETS/android-icon-foreground.png" 1024 1024
export_png "$SVGS/icon-bg.svg" "$ASSETS/android-icon-background.png" 1024 1024
export_png "$SVGS/monochrome.svg" "$ASSETS/android-icon-monochrome.png" 1024 1024
export_png "$SVGS/splash.svg" "$ASSETS/splash-icon.png" 1024 1024
export_png "$SVGS/favicon.svg" "$ASSETS/favicon.png" 48 48
echo ""
echo "Done. Files written to assets/"
echo "Verify with: ls -lh assets/*.png"