{"id":"7db14b96-cad1-4442-83de-ee4ad38809da","shortId":"j6jBcH","kind":"skill","title":"avalonia-layout-zafiro","tagline":"Guidelines for modern Avalonia UI layout using Zafiro.Avalonia, emphasizing shared styles, generic components, and avoiding XAML redundancy.","description":"# Avalonia Layout with Zafiro.Avalonia\n\n> Master modern, clean, and maintainable Avalonia UI layouts.\n> **Focus on semantic containers, shared styles, and minimal XAML.**\n\n## 🎯 Selective Reading Rule\n\n**Read ONLY files relevant to the layout challenge!**\n\n---\n\n## 📑 Content Map\n\n| File | Description | When to Read |\n|------|-------------|--------------|\n| `themes.md` | Theme organization and shared styles | Setting up or refining app themes |\n| `containers.md` | Semantic containers (`HeaderedContainer`, `EdgePanel`, `Card`) | Structuring views and layouts |\n| `icons.md` | Icon usage with `IconExtension` and `IconOptions` | Adding and customizing icons |\n| `behaviors.md` | `Xaml.Interaction.Behaviors` and avoiding Converters | Implementing complex interactions |\n| `components.md` | Generic components and avoiding nesting | Creating reusable UI elements |\n\n---\n\n## 🔗 Related Project (Exemplary Implementation)\n\nFor a real-world example, refer to the **Angor** project:\n`/mnt/fast/Repos/angor/src/Angor/Avalonia/Angor.Avalonia.sln`\n\n---\n\n## ✅ Checklist for Clean Layouts\n\n- [ ] **Used semantic containers?** (e.g., `HeaderedContainer` instead of `Border` with manual header)\n- [ ] **Avoided redundant properties?** Use shared styles in `axaml` files.\n- [ ] **Minimized nesting?** Flatten layouts using `EdgePanel` or generic components.\n- [ ] **Icons via extension?** Use `{Icon fa-name}` and `IconOptions` for styling.\n- [ ] **Behaviors over code-behind?** Use `Interaction.Behaviors` for UI-logic.\n- [ ] **Avoided Converters?** Prefer ViewModel properties or Behaviors unless necessary.\n\n---\n\n## ❌ Anti-Patterns\n\n**DON'T:**\n- Use hardcoded colors or sizes (literals) in views.\n- Create deep nesting of `Grid` and `StackPanel`.\n- Repeat visual properties across multiple elements (use Styles).\n- Use `IValueConverter` for simple logic that belongs in the ViewModel.\n\n**DO:**\n- Use `DynamicResource` for colors and brushes.\n- Extract repeated layouts into generic components.\n- Leverage `Zafiro.Avalonia` specific panels like `EdgePanel` for common UI patterns.\n\n## When to Use\nThis skill is applicable to execute the workflow or actions described in the overview.\n\n## Limitations\n- Use this skill only when the task clearly matches the scope described above.\n- Do not treat the output as a substitute for environment-specific validation, testing, or expert review.\n- Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.","tags":["avalonia","layout","zafiro","antigravity","awesome","skills","sickn33","agent-skills","agentic-skills","ai-agent-skills","ai-agents","ai-coding"],"capabilities":["skill","source-sickn33","skill-avalonia-layout-zafiro","topic-agent-skills","topic-agentic-skills","topic-ai-agent-skills","topic-ai-agents","topic-ai-coding","topic-ai-workflows","topic-antigravity","topic-antigravity-skills","topic-claude-code","topic-claude-code-skills","topic-codex-cli","topic-codex-skills"],"categories":["antigravity-awesome-skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/sickn33/antigravity-awesome-skills/avalonia-layout-zafiro","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add sickn33/antigravity-awesome-skills","source_repo":"https://github.com/sickn33/antigravity-awesome-skills","install_from":"skills.sh"}},"qualityScore":"0.700","qualityRationale":"deterministic score 0.70 from registry signals: · indexed on github topic:agent-skills · 34964 github stars · SKILL.md body (2,494 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-04-25T00:50:29.319Z","embedding":null,"createdAt":"2026-04-18T21:31:38.739Z","updatedAt":"2026-04-25T00:50:29.319Z","lastSeenAt":"2026-04-25T00:50:29.319Z","tsv":"'/mnt/fast/repos/angor/src/angor/avalonia/angor.avalonia.sln':127 'across':216 'action':266 'ad':90 'angor':125 'anti':194 'anti-pattern':193 'app':71 'applic':260 'ask':304 'avalonia':2,8,22,31 'avalonia-layout-zafiro':1 'avoid':19,97,106,143,184 'axaml':150 'behavior':173,190 'behaviors.md':94 'behind':177 'belong':227 'border':139 'boundari':312 'brush':237 'card':78 'challeng':53 'checklist':128 'clarif':306 'clean':28,130 'clear':279 'code':176 'code-behind':175 'color':200,235 'common':251 'complex':100 'compon':17,104,160,243 'components.md':102 'contain':37,75,134 'containers.md':73 'content':54 'convert':98,185 'creat':108,206 'criteria':315 'custom':92 'deep':207 'describ':267,283 'descript':57 'dynamicresourc':233 'e.g':135 'edgepanel':77,157,249 'element':111,218 'emphas':13 'environ':295 'environment-specif':294 'exampl':121 'execut':262 'exemplari':114 'expert':300 'extens':163 'extract':238 'fa':167 'fa-nam':166 'file':48,56,151 'flatten':154 'focus':34 'generic':16,103,159,242 'grid':210 'guidelin':5 'hardcod':199 'header':142 'headeredcontain':76,136 'icon':84,93,161,165 'iconextens':87 'iconopt':89,170 'icons.md':83 'implement':99,115 'input':309 'instead':137 'interact':101 'interaction.behaviors':179 'ivalueconvert':222 'layout':3,10,23,33,52,82,131,155,240 'leverag':244 'like':248 'limit':271 'liter':203 'logic':183,225 'maintain':30 'manual':141 'map':55 'master':26 'match':280 'minim':41,152 'miss':317 'modern':7,27 'multipl':217 'name':168 'necessari':192 'nest':107,153,208 'organ':63 'output':289 'overview':270 'panel':247 'pattern':195,253 'permiss':310 'prefer':186 'project':113,126 'properti':145,188,215 'read':44,46,60 'real':119 'real-world':118 'redund':21,144 'refer':122 'refin':70 'relat':112 'relev':49 'repeat':213,239 'requir':308 'reusabl':109 'review':301 'rule':45 'safeti':311 'scope':282 'select':43 'semant':36,74,133 'set':67 'share':14,38,65,147 'simpl':224 'size':202 'skill':258,274 'skill-avalonia-layout-zafiro' 'source-sickn33' 'specif':246,296 'stackpanel':212 'stop':302 'structur':79 'style':15,39,66,148,172,220 'substitut':292 'success':314 'task':278 'test':298 'theme':62,72 'themes.md':61 'topic-agent-skills' 'topic-agentic-skills' 'topic-ai-agent-skills' 'topic-ai-agents' 'topic-ai-coding' 'topic-ai-workflows' 'topic-antigravity' 'topic-antigravity-skills' 'topic-claude-code' 'topic-claude-code-skills' 'topic-codex-cli' 'topic-codex-skills' 'treat':287 'ui':9,32,110,182,252 'ui-log':181 'unless':191 'usag':85 'use':11,132,146,156,164,178,198,219,221,232,256,272 'valid':297 'via':162 'view':80,205 'viewmodel':187,230 'visual':214 'workflow':264 'world':120 'xaml':20,42 'xaml.interaction.behaviors':95 'zafiro':4 'zafiro.avalonia':12,25,245","prices":[{"id":"5cd1b845-23e7-4b91-b9af-ef466fa49137","listingId":"7db14b96-cad1-4442-83de-ee4ad38809da","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"sickn33","category":"antigravity-awesome-skills","install_from":"skills.sh"},"createdAt":"2026-04-18T21:31:38.739Z"}],"sources":[{"listingId":"7db14b96-cad1-4442-83de-ee4ad38809da","source":"github","sourceId":"sickn33/antigravity-awesome-skills/avalonia-layout-zafiro","sourceUrl":"https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/avalonia-layout-zafiro","isPrimary":false,"firstSeenAt":"2026-04-18T21:31:38.739Z","lastSeenAt":"2026-04-25T00:50:29.319Z"}],"details":{"listingId":"7db14b96-cad1-4442-83de-ee4ad38809da","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"sickn33","slug":"avalonia-layout-zafiro","github":{"repo":"sickn33/antigravity-awesome-skills","stars":34964,"topics":["agent-skills","agentic-skills","ai-agent-skills","ai-agents","ai-coding","ai-workflows","antigravity","antigravity-skills","claude-code","claude-code-skills","codex-cli","codex-skills","cursor","cursor-skills","developer-tools","gemini-cli","gemini-skills","kiro","mcp","skill-library"],"license":"mit","html_url":"https://github.com/sickn33/antigravity-awesome-skills","pushed_at":"2026-04-24T06:41:17Z","description":"Installable GitHub library of 1,400+ agentic skills for Claude Code, Cursor, Codex CLI, Gemini CLI, Antigravity, and more. Includes installer CLI, bundles, workflows, and official/community skill collections.","skill_md_sha":"a18475e82e8010b7e77fa6641a9bbc9522595c06","skill_md_path":"skills/avalonia-layout-zafiro/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/sickn33/antigravity-awesome-skills/tree/main/skills/avalonia-layout-zafiro"},"layout":"multi","source":"github","category":"antigravity-awesome-skills","frontmatter":{"name":"avalonia-layout-zafiro","description":"Guidelines for modern Avalonia UI layout using Zafiro.Avalonia, emphasizing shared styles, generic components, and avoiding XAML redundancy."},"skills_sh_url":"https://skills.sh/sickn33/antigravity-awesome-skills/avalonia-layout-zafiro"},"updatedAt":"2026-04-25T00:50:29.319Z"}}