Files
AgentCompany/builtin-skills/iOS-Dev/icon-generator/references/web-ui-ux.md
T
ZacharyZhang-NY e74dafcd36 Silence render-disposed spam, unbreak bundled skills, drop board wake
Three independently ugly bugs that all fed the same log flood:

* Electron's `WebFrameMain.send` writes every "Render frame was disposed"
  to stderr via `console.error`. When the worker fans a second
  agent-event past a reloading renderer, we produced thousands of
  identical lines and stalled the main loop on stderr I/O. Added a
  `mainFrame.detached` guard so the send is short-circuited before
  Electron's own catch block fires, and installed a targeted filter in
  `suppress-warnings.ts` (now actually imported from the entry point)
  so the specific `console.error("Error sending from webFrameMain:"…)`
  noise never reaches the terminal. Any other payload still surfaces.

* `dispatchAgentMessage` accepted the human-reader sentinel as a wake
  target when an agent replied to `__board__` — `wakeAgentIfPossible`
  then called `db.getAgent("__board__")`, threw, and the dispatcher
  kept repeating on every send. Strip `HUMAN_SENDER_ID` at
  `resolveMessageWakeTargets`, and keep a defense-in-depth guard in the
  heartbeat so a stray caller (future automation fan-out) cannot
  reintroduce the crash.

* Pi's skills loader rejects any SKILL.md whose frontmatter `name`
  diverges from its parent directory. The four bundled `my-writing-style`
  copies declared `name: writing-style-skill`, so every install emitted
  a warning and dropped the skill. They also lived as orphan gitlinks
  (mode 160000 without .gitmodules), and the global `*.md` gitignore
  hid every other SKILL.md from version control. Fixed the frontmatter
  to match the dir, converted the dangling submodules to plain trees,
  and allowlisted `builtin-skills/**/*.md` so a fresh clone carries the
  catalogue instead of silently losing it.
2026-04-20 08:13:48 -04:00

57 lines
2.0 KiB
Markdown
Raw 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.
# Web UI/UX icon set (favicon + PWA)
## Recommended minimal output set
This set covers modern browsers + iOS home screen + Android/PWA:
- `favicon.ico` (multi-size container): include 16×16 and 32×32 (optionally 48×48)
- `apple-touch-icon.png` (180×180)
- `icon-192.png` (192×192)
- `icon-512.png` (512×512)
- `icon-maskable-512.png` (512×512, **maskable**, opaque background, padded content)
This is intentionally “minimal but effective”. You can add more sizes if you have a specific requirement.
## HTML `<head>` snippet
Use this as a starting point:
- `<link rel="icon" href="/favicon.ico">`
- `<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">`
- `<link rel="icon" type="image/png" sizes="192x192" href="/icon-192.png">`
- `<link rel="icon" type="image/png" sizes="512x512" href="/icon-512.png">`
- `<link rel="manifest" href="/manifest.webmanifest">` (if PWA)
## `manifest.webmanifest` example
Include both normal (“any”) and maskable icons:
```json
{
"name": "My App",
"short_name": "MyApp",
"display": "standalone",
"start_url": "/",
"icons": [
{ "src": "/icon-192.png", "type": "image/png", "sizes": "192x192", "purpose": "any" },
{ "src": "/icon-512.png", "type": "image/png", "sizes": "512x512", "purpose": "any" },
{ "src": "/icon-maskable-512.png", "type": "image/png", "sizes": "512x512", "purpose": "maskable" }
]
}
```
## Maskable safe area (practical rule)
Maskable icons can be cropped into different shapes by the OS/launcher.
- Keep important content inside the **center ~80%** of the image.
- Use an **opaque background** for the full 512×512.
In the generator script, this corresponds to `--maskable-scale 0.80` (default).
## Common failure modes
- You only provide a big 512×512 and let the browser scale down → looks blurry at 16×16.
- You use transparent background for iOS “Add to Home Screen” icons → iOS may render it with an ugly fill.
- Your maskable icon has no padding → the launcher crops off your logo.