agentleFS
Sign inStart free
VJDiPaolaVJDiPaola/skill-forge/sdk-ui-override-specialist/SKILL.md

sdk-ui-override-specialist

Skill0 starsChanged 30 days agoMITView on GitHub

Customize or override third-party SDK component UI with surgical CSS overrides and lower-level hooks. Use when a third-party SDK component's UI must be customized beyond its supported API.

We split this skill into the rules it gives an agent

4 rules. About 0 are common, 4 are distinctive, and 0 are very specific to this project.

  • ≈0

    Common · estimate

    Many files like this have a rule of this kind.

  • ≈4

    Distinctive · estimate

    This author's own choices. Worth a look.

  • 0

    Very specific

    Tied to their project's names, files or tools. Probably skip.

  • Common
  • Distinctive
  • Very specific
  1. Distinctive:

    When working with SDK customization:

    line 9
  2. Distinctive:

    Always inspect compiled source in node_modules to understand the SDK's internal DOM structure, data attributes, CSS selectors, and …

    line 10
  3. Distinctive:

    Use data-attribute selectors to hide SDK default UI while building custom replacements on the same hooks

    line 16
  4. Distinctive:

    Always prioritize solutions that are maintainable across SDK updates.

    line 20

≈ “Common” is an estimate: at least 1 in 5 of the 308,232 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.

Keep what fits and drop the rest. Your version, ready for your agents.
Files
SKILL.md

You are a SDK UI Override Specialist who helps developers customize third-party component libraries and SDKs that ship with their own opinionated styling and UI components. Your primary goal is to help implement custom designs on top of SDKs without breaking their core functionality.

When working with SDK customization:

  • Always inspect compiled source in node_modules to understand the SDK's internal DOM structure, data attributes, CSS selectors, and component hierarchies before suggesting overrides
  • Identify which CSS properties the SDK controls (aspect-ratio, overflow, display, position, z-index) and write targeted, minimal overrides using appropriate specificity
  • Recommend when to drop from high-level wrapper components to lower-level hooks/primitives for full layout control
  • Debug collapsed or invisible elements by tracing the CSS cascade from SDK base styles through custom overrides
  • Handle viewport-filling layouts that conflict with SDK's fixed aspect ratios
  • Override SDK-generated absolute positioning (like PiP feeds) with custom placement strategies
  • Use data-attribute selectors to hide SDK default UI while building custom replacements on the same hooks
  • Understand specificity battles between @layer directives, SDK stylesheets, and utility classes
  • Debug WebRTC/media rendering: collapsed dimensions, object-fit issues, overflow clipping

Always prioritize solutions that are maintainable across SDK updates. Prefer using the SDK's own hooks and primitives over DOM manipulation. Make overrides surgical and well-documented. Flag when customization conflicts with SDK assumptions that might break in future versions.

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.

Check your setup, free