skezu/minimalist-frontend-logic
skills/minimalist-frontend-logic/SKILL.md
Expert guide for building minimalist, high-end interfaces. Use when: (1) General frontend coding, (2) Layout discussions, (3) Polishing UI/UX. Enforces the Item-over-Card pattern, standardized spacing, and proper component categorization.
development
Updated Jun 2, 2026
$ install --global
skillsauthnpx skillsauth add skezu/skills minimalist-frontend-logicInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Jun 2, 2026, 3:43 AM208.3s1 file scanned
SKILL.md
- name:
- minimalist-frontend-logic
- description:
- Expert guide for building minimalist, high-end interfaces. Use when: (1) General frontend coding, (2) Layout discussions, (3) Polishing UI/UX. Enforces the Item-over-Card pattern, standardized spacing, and proper component categorization.
Minimalist Frontend Logic
This skill distills the "Apple/OpenAI-style" minimalist interface patterns used in this project.
"Items > Cards" Principle
Strictly prefer the ItemGroup and Item pattern for settings, lists, and content groups. Avoid bulky cards with borders/shadows.
ItemGroup: Groups related items. Can have an optional uppercaselabel.Item: A single interactive or informational row.- Use
ItemContent,ItemTitle, andItemDescriptionfor the left side. - Use
ItemActionsfor the right side (buttons, toggles, badges).
- Use
- Separators: Use
separator={true}(default) between items in a group. Manually setseparator={false}for the last element in a group.
Layout Logic (Standard Spacing)
gap-2: For tight lists or very closely related elements.gap-3: For standard interactive elements and action bars.gap-4: For standard block-level spacing (e.g., between an icon and text).gap-8/gap-10: For major section layout in features.
Component Categorization Heuristics
src/components/ui/(Shared):- Truly universal primitives (Button, Input, Dialog, Item).
- No business logic.
- Controlled via props only.
src/features/<name>/components/(Private):- Business-aware components (e.g.,
SentimentBadge,ResultActions). - Can use feature-specific hooks.
- Should use
uicomponents as building blocks.
- Business-aware components (e.g.,
UX Micro-Logic
- Interactivity: Add
onClickto anItemto make it interactive (automatically adds hover states). - Animation: Use
animate-in fade-in slide-in-from-bottom-2 duration-500for entry transitions. - Empty States: Prefer minimalist text or subtle icons over complex illustrations.
- Color Palette: Use CSS variables for semantic colors (
var(--color-text-secondary),var(--color-border)).
Related Skills
skezu/pptx
documentation
VerifiedTrustedCommunity
Use this skill any time a .pptx file is involved in any way — as input, output, or both. This includes: creating slide decks, pitch decks, or presentations; reading, parsing, or extracting text from any .pptx file (even if the extracted content will be used elsewhere, like in an email or summary); editing, modifying, or updating existing presentations; combining or splitting slide files; working with templates, layouts, speaker notes, or comments. Trigger whenever the user mentions "deck," "slides," "presentation," or references a .pptx filename, regardless of what they plan to do with the content afterward. If a .pptx file needs to be opened, created, or touched, use this skill.
SKILL.mdUpdated Jun 2, 2026
skezu/pdf
content-media
VerifiedTrustedCommunity
Use this skill whenever the user wants to do anything with PDF files. This includes reading or extracting text/tables from PDFs, combining or merging multiple PDFs into one, splitting PDFs apart, rotating pages, adding watermarks, creating new PDFs, filling PDF forms, encrypting/decrypting PDFs, extracting images, and OCR on scanned PDFs to make them searchable. If the user mentions a .pdf file or asks to produce one, use this skill.
SKILL.mdUpdated Jun 2, 2026
skezu/openai-ui-sdk-mastery
development
VerifiedTrustedCommunity
Expert UI component builder and OpenAI SDK integrator. Use when building or refactoring React components using the `@openai/apps-sdk-ui` library to ensure visual consistency, logic-driven variant selection, and adherence to specific workspace conventions (Anti-Pill rule, uniform icons).
SKILL.mdUpdated Jun 2, 2026
skezu/n8n-workflows-master
tools
VerifiedTrustedCommunity
A skill for designing, building, validating, and securing n8n automation workflows, using specialized AI personas (Build Captain, QA, Security Architect). Use this skill to create production-ready n8n workflows from plain language specifications.
SKILL.mdUpdated Jun 2, 2026