skills.rest
PavelLizunov
PavelLizunovCOMMUNITY
Explore all skills by this author →
GitHub

audit-overflow-fix

Replaces bare strings with wrapped TextBlocks in Avalonia XAML to fix UI overflow.

3|1|Updated Feb 20, 2026
Search Tags:#ui#debugging#layout#avalonia#xaml#vpnrouter
One-click install
npx skills add https://github.com/PavelLizunov/VPNRouter --skill audit-overflow-fix
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: audit-overflow-fix
Source: https://github.com/PavelLizunov/VPNRouter/tree/main/.agents/skills/audit-overflow-fix
Command: npx skills add https://github.com/PavelLizunov/VPNRouter --skill audit-overflow-fix

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill resolves horizontal UI overflow issues in VPNRouter Avalonia windows where long localized labels cause elements to push past the window boundaries.

Core Features & Use Cases

  • Layout Auditing: Identifies and corrects bare-string content in CheckBox and Button elements that lack proper text wrapping.
  • Design System Compliance: Ensures UI components adhere to the project's design tokens for spacing, radius, and color brushes.
  • Use Case: When a user reports that a settings label is cut off or causes a horizontal scrollbar on a narrow window, this Skill provides the specific XAML patterns to wrap text and constrain container widths.

Quick Start

Apply the audit-overflow-fix patterns to the NetworkPage XAML file to ensure all CheckBox labels wrap correctly within the 520px window constraint.

Frequently Asked Questions about audit-overflow-fix

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I fix horizontal UI overflow in Avalonia XAML when localized labels are cut off?▼

To fix horizontal UI overflow in Avalonia XAML, replace bare-string content in CheckBox and Button elements with wrapped TextBlock elements to constrain container widths and prevent clipping.

Why does my CheckBox label push past the window boundaries in an Avalonia desktop app?▼

A CheckBox label pushes past window boundaries because bare-string content lacks text wrapping. Wrapping the text in a TextBlock element constrains the layout and prevents horizontal scrolling.

How do I wrap text in Avalonia StackPanel containers to prevent layout clipping?▼

To wrap text in Avalonia StackPanel containers and prevent layout clipping, replace bare-string content with TextBlock elements and validate against project-specific design tokens to maintain responsive design.

Does this UI layout audit work with fixed-width Avalonia windows?▼

Yes, this UI layout audit specifically targets fixed-width Avalonia windows. It validates XAML implementation against layout constraints, such as a 520px window limit, ensuring labels wrap correctly without horizontal scrollbars.

What is the best way to ensure Avalonia UI components adhere to design tokens during overflow fixes?▼

The best way to ensure Avalonia UI components adhere to design tokens is to replace bare-strings with wrapped TextBlocks in CheckBox and Button containers while validating spacing, radius, and color brushes against project constraints.

Related Skills

Explore More Software Engineering Skills→
Claude-Code-Community-IrelandClaude-Code-Community-Ireland
10

avalonia-layout-zafiro

Develop Avalonia UI layouts with Zafiro.Avalonia semantic containers and shared styles.

Official
Intermediate
kobogithubkobogithub

uiux-viewport-testing

Automate responsive design testing by resizing browser viewports and capturing screenshots.

Community
Intermediate
veerababumanyamveerababumanyam

accessibility

Validate UI components against WCAG 2.1 AA accessibility standards.

Community
Basic
MakotoUwayaMakotoUwaya

xaml-layout-review

Review WPF XAML diffs for margin consistency and text clipping issues.

Community
Basic