[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M71R7EPMZFKB833WE4B3GTHC":3,"skill-same:01M71R7EPMZFKB833WE4B3GTHC":75},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":15,"categories":16,"keywords":27,"publishedAt":48,"linkOnly":49,"markdownContent":50,"markdownBody":51,"frontMatter":52,"refName":55,"commitSha":56,"skillDirectory":57,"forksCount":13,"repositoryHtmlUrl":58,"repositoryHomepageUrl":6,"ownerHtmlUrl":59,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":60,"install":61,"resources":74},"01M71R7EPMZFKB833WE4B3GTHC","baseline-ui",null,"Anti-slop UI — layout, typography, responsive, animation, tokens. Use for cleanup or polish.","LuisAlbertoMK\u002Fgentleman-agent-gh","LuisAlbertoMK","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F96153499?v=4","01M71QZX0CF9KKGQZ8ZN9BME63","01M71QZX11P5X6Z27HE1GQDF71",0,"Apache-2.0","https:\u002F\u002Fgithub.com\u002FLuisAlbertoMK\u002Fgentleman-agent-gh\u002Fblob\u002Fmain\u002Fdocs\u002Fciclos\u002Fc28-w1-backup\u002Fbaseline-ui\u002FSKILL.md",[17,22],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000015","视觉设计","SCENARIO","使用场景",{"categoryNo":23,"categoryName":24,"taxonomyType":25,"taxonomyTypeDesc":26},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47],"ui","baseline","baseline ui","container","generic","slop","for","grid","interface","tokens","query","ui audit","anti-slop","design","use","fix","Animation","cleanup","design review","review","2026-11-10 13:02:02",false,"---\nname: baseline-ui\ndescription: \"Anti-slop UI — layout, typography, responsive, animation, tokens. Use for cleanup or polish.\"\ntriggers: \"ui cleanup, polish interface, fix layout, ui slop, generic ui, design review, responsive, container query, flexbox, grid, ui audit\"\nchangelog: docs\u002Fciclos\u002Fcycle28-20260815.md\n---\n\n## When to Use\nAnti-slop UI — layout, typography, responsive, animation, to\n\n**Stack**: Existing CSS\u002FTailwind·`cn()`(clsx+tailwind-merge) React·No new approach unless project uses\n**Scope**: Audit&cleanup. For implementation→load **ui-engine** after.\n\n## Workflow\n1.Scan targets→violations(❌) 2.Classify 3.Fix 4.Verify:contrast\u002Fresponsive\u002Fmotion 5.Chain:a11y→perf\n\n## Layout\n`h-dvh`not`h-screen`·`safe-area-inset`·`size-*`over`w-*`+`h-*`·Components:CQ(`container-type:inline-size`)·Page:MQ\n❌`container-type:size`w\u002Fo`block-size`·❌`grid-auto-flow:dense`interactive\nCards:`repeat(auto-fit,minmax(280px,1fr))`·Fluid:`cqi`(ONLY containers)·Subgrid·`aspect-ratio`\nTree:1D→Flex|2D→Grid|Child→Subgrid|Parent→:has()|Unknown→auto-fit,minmax()\n```css\n\u002F* ❌ *\u002F.card{width:300px;height:200px}\n\u002F* ✅ *\u002F.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}\n.card{container-type:inline-size}\n```\n\n## Typography\n`text-balance`headings·`text-pretty`body·`tabular-nums`data·Fluid:page→`clamp(1rem,1.5vw+0.5rem,1.5rem)`, containers→`cqi`. No`letter-spacing`except labels\n```css\n\u002F* ❌ *\u002Fh1{font-size:2rem} \u002F* ✅ *\u002Fh1{font-size:clamp(1.5rem,3vw+0.5rem,2.5rem);text-wrap:balance}\n```\n\n## Animation(audit only—see ui-engine)\nProps:`transform`+`opacity`✅. ❌`width\u002Fheight\u002Ftop\u002Fleft\u002Fmargin\u002Fpadding`. Duration:120\u002F200\u002F300ms. ❌>500ms. \u003C200ms\u002Felement.\nReduced:`animation\u002Ftransition-duration:0.01ms!important`on`*`at`prefers-reduced-motion:reduce`\n❌`transition:all`·✅Scroll-Driven CSS\n\n## Tokens\n❌HSL\u002FRGB→✅OKLCH·8pt·3-tier(Prim→Sem→Comp)·`light-dark()`·≥4.5:1 all text all themes\n\n## Design\nNo gradients\u002Fmulticolor·No glow·Empty:1primary·Accent:1\u002Fview·Errors next to action·Keyboard\u002Ffocus·`aria-label`icons·No blocking paste\n\n## Review: `\u002Fbaseline-ui \u003Cfile>`→Violation→Why→Fix\n\n## Refs\n**ui-engine**(implementation)**accessibility**(focus\u002FARIA\u002FEAA)**performance**(budget\u002FCV)**web-quality-audit**(full audit)\n\n## Anti-Patterns\nFixed width·h-screen·grid-auto-flow:dense interactive·Fixed font-size·transition:all·>500ms·No reduced-motion·HSL\u002FRGB·No contrast·cqi outside container·letter-spacing body\n","## When to Use\nAnti-slop UI — layout, typography, responsive, animation, to\n\n**Stack**: Existing CSS\u002FTailwind·`cn()`(clsx+tailwind-merge) React·No new approach unless project uses\n**Scope**: Audit&cleanup. For implementation→load **ui-engine** after.\n\n## Workflow\n1.Scan targets→violations(❌) 2.Classify 3.Fix 4.Verify:contrast\u002Fresponsive\u002Fmotion 5.Chain:a11y→perf\n\n## Layout\n`h-dvh`not`h-screen`·`safe-area-inset`·`size-*`over`w-*`+`h-*`·Components:CQ(`container-type:inline-size`)·Page:MQ\n❌`container-type:size`w\u002Fo`block-size`·❌`grid-auto-flow:dense`interactive\nCards:`repeat(auto-fit,minmax(280px,1fr))`·Fluid:`cqi`(ONLY containers)·Subgrid·`aspect-ratio`\nTree:1D→Flex|2D→Grid|Child→Subgrid|Parent→:has()|Unknown→auto-fit,minmax()\n```css\n\u002F* ❌ *\u002F.card{width:300px;height:200px}\n\u002F* ✅ *\u002F.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}\n.card{container-type:inline-size}\n```\n\n## Typography\n`text-balance`headings·`text-pretty`body·`tabular-nums`data·Fluid:page→`clamp(1rem,1.5vw+0.5rem,1.5rem)`, containers→`cqi`. No`letter-spacing`except labels\n```css\n\u002F* ❌ *\u002Fh1{font-size:2rem} \u002F* ✅ *\u002Fh1{font-size:clamp(1.5rem,3vw+0.5rem,2.5rem);text-wrap:balance}\n```\n\n## Animation(audit only—see ui-engine)\nProps:`transform`+`opacity`✅. ❌`width\u002Fheight\u002Ftop\u002Fleft\u002Fmargin\u002Fpadding`. Duration:120\u002F200\u002F300ms. ❌>500ms. \u003C200ms\u002Felement.\nReduced:`animation\u002Ftransition-duration:0.01ms!important`on`*`at`prefers-reduced-motion:reduce`\n❌`transition:all`·✅Scroll-Driven CSS\n\n## Tokens\n❌HSL\u002FRGB→✅OKLCH·8pt·3-tier(Prim→Sem→Comp)·`light-dark()`·≥4.5:1 all text all themes\n\n## Design\nNo gradients\u002Fmulticolor·No glow·Empty:1primary·Accent:1\u002Fview·Errors next to action·Keyboard\u002Ffocus·`aria-label`icons·No blocking paste\n\n## Review: `\u002Fbaseline-ui \u003Cfile>`→Violation→Why→Fix\n\n## Refs\n**ui-engine**(implementation)**accessibility**(focus\u002FARIA\u002FEAA)**performance**(budget\u002FCV)**web-quality-audit**(full audit)\n\n## Anti-Patterns\nFixed width·h-screen·grid-auto-flow:dense interactive·Fixed font-size·transition:all·>500ms·No reduced-motion·HSL\u002FRGB·No contrast·cqi outside container·letter-spacing body\n",{"name":5,"triggers":53,"changelog":54,"description":7},"ui cleanup, polish interface, fix layout, ui slop, generic ui, design review, responsive, container query, flexbox, grid, ui audit","docs\u002Fciclos\u002Fcycle28-20260815.md","main","4af6946b30783e2c8f9182082324d530fc28f838","docs\u002Fciclos\u002Fc28-w1-backup\u002Fbaseline-ui","https:\u002F\u002Fgithub.com\u002FLuisAlbertoMK\u002Fgentleman-agent-gh","https:\u002F\u002Fgithub.com\u002FLuisAlbertoMK","2026-11-10 18:34:27",{"source":8,"skillName":5,"commands":62,"prompt":72,"zipAvailable":73},[63,66,69],{"tool":64,"command":65},"npx","npx skills add LuisAlbertoMK\u002Fgentleman-agent-gh --skill baseline-ui",{"tool":67,"command":68},"bunx","bunx skills add LuisAlbertoMK\u002Fgentleman-agent-gh --skill baseline-ui",{"tool":70,"command":71},"pnpm","pnpm dlx skills add LuisAlbertoMK\u002Fgentleman-agent-gh --skill baseline-ui","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FLuisAlbertoMK\u002Fgentleman-agent-gh\u002Fblob\u002Fmain\u002Fdocs\u002Fciclos\u002Fc28-w1-backup\u002Fbaseline-ui\u002FSKILL.md",true,[],[76,105,125,150,176,204],{"skillNo":77,"name":78,"nameZh":6,"description":79,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":80,"categories":81,"keywords":90,"publishedAt":48},"01M71R7K35P668DYEPYGDQP2QA","web-quality-audit","Comprehensive web audit: performance, a11y, SEO, responsive, animation, design tokens.","https:\u002F\u002Fgithub.com\u002FLuisAlbertoMK\u002Fgentleman-agent-gh\u002Fblob\u002Fmain\u002Fdocs\u002Fciclos\u002Fc28-w1-backup\u002Fweb-quality-audit\u002FSKILL.md",[82,83,86,87],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},{"categoryNo":84,"categoryName":85,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000019","营销推广",{"categoryNo":23,"categoryName":24,"taxonomyType":25,"taxonomyTypeDesc":26},{"categoryNo":88,"categoryName":89,"taxonomyType":25,"taxonomyTypeDesc":26},"01JBSEEDCAT000000000000035","市场营销",[91,92,93,94,95,44,96,41,97,28,98,99,37,39,100,101,47,102,103,104],"quality","quality audit","web quality audit","audit","web","design audit","website","responsive","seo","Lighthouse","performance","optimize","a11y","page",{"skillNo":106,"name":107,"nameZh":6,"description":108,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":109,"categories":110,"keywords":112,"publishedAt":48},"01M71R7H1RA7CQ568DHRK37PE2","ui-engine","UI system — Grid\u002FFlexbox\u002F@layer\u002F:has(), container queries, compositor-only animation, OKLCH tokens, component patterns","https:\u002F\u002Fgithub.com\u002FLuisAlbertoMK\u002Fgentleman-agent-gh\u002Fblob\u002Fmain\u002Fdocs\u002Fciclos\u002Fc28-w1-backup\u002Fui-engine\u002FSKILL.md",[111],{"categoryNo":23,"categoryName":24,"taxonomyType":25,"taxonomyTypeDesc":26},[113,114,28,44,115,116,117,104,118,37,119,120,31,41,121,38,122,123,35,124],"ui engine","engine","compositor","css","dark","system","mode","hooks","only","components","dark mode","queries",{"skillNo":126,"name":127,"nameZh":6,"description":128,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":129,"categories":130,"keywords":134,"publishedAt":48},"01M71R7CWK3FBW77Z8WD9GXQFE","skill-creator","Create new AI agent skills following Agent Skills spec -- auto-bootstrap unknown tasks, define structure, register in AGENTS.md","https:\u002F\u002Fgithub.com\u002FLuisAlbertoMK\u002Fgentleman-agent-gh\u002Fblob\u002Fmain\u002F.archive\u002Fskills\u002Fskill-creator\u002FSKILL.md",[131],{"categoryNo":132,"categoryName":133,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000023","Skill与智能体开发",[135,136,137,138,139,140,141,142,143,144,145,146,147,148,149],"skill creator","creator","create","structure","register","2026","spec","new","ai skill","auto","define","ai agent","unknown","tasks","bootstrap",{"skillNo":151,"name":152,"nameZh":6,"description":153,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":154,"categories":155,"keywords":158,"publishedAt":48},"01M71R78DZM1GA16F1KN8ND926","senior-engineer","Apply senior engineering competencies — system design, trade-off analysis, delegation, mentoring, and tech debt strategy","https:\u002F\u002Fgithub.com\u002FLuisAlbertoMK\u002Fgentleman-agent-gh\u002Fblob\u002Fmain\u002F.archive\u002Fskills\u002Fsenior-engineer\u002FSKILL.md",[156,157],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},{"categoryNo":23,"categoryName":24,"taxonomyType":25,"taxonomyTypeDesc":26},[159,160,161,162,163,164,165,41,166,167,140,168,169,170,118,171,172,173,174,175],"engineer","senior","senior engineer","system design","trade-offs","senior engineering","delegation","senior architect","analysis","debt","architect","tech","strategy","apply","trade","tech debt","engineering",{"skillNo":177,"name":178,"nameZh":6,"description":179,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":180,"categories":181,"keywords":186,"publishedAt":48},"01M71R74WQTXZMG3219RND96CE","prompt-engineering","Design effective prompts using SPEARS framework — scope, principles, examples, assertions, refinements, with ReAct and multi-agent patterns","https:\u002F\u002Fgithub.com\u002FLuisAlbertoMK\u002Fgentleman-agent-gh\u002Fblob\u002Fmain\u002F.archive\u002Fskills\u002Fprompt-engineering\u002FSKILL.md",[182,185],{"categoryNo":183,"categoryName":184,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000009","前端开发",{"categoryNo":132,"categoryName":133,"taxonomyType":20,"taxonomyTypeDesc":21},[187,188,175,189,190,41,191,140,192,193,194,195,196,197,198,199,200,201,202,203],"prompt","prompt engineering","scope","improve","react","security","patterns","multi-agent","framework","agent patterns","assertions","examples","with","multi","principles","improve prompt","prompts",{"skillNo":205,"name":206,"nameZh":6,"description":207,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":208,"categories":209,"keywords":218,"publishedAt":48},"01M71R7355SPXASHS08FPAQJMS","cognitive-doc-design","Design docs that reduce cognitive load. Trigger: writing guides, READMEs, RFCs, onboarding, architecture, or review-facing docs.","https:\u002F\u002Fgithub.com\u002FLuisAlbertoMK\u002Fgentleman-agent-gh\u002Fblob\u002Fmain\u002F.archive\u002Fskills\u002Fcognitive-doc-design\u002FSKILL.md",[210,211,214,215],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},{"categoryNo":212,"categoryName":213,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000018","写作与文案",{"categoryNo":23,"categoryName":24,"taxonomyType":25,"taxonomyTypeDesc":26},{"categoryNo":216,"categoryName":217,"taxonomyType":25,"taxonomyTypeDesc":26},"01JBSEEDCAT000000000000036","内容创作者",[41,219,220,221,222,223,224,225,226,47,227,228,140,229,230,231,232],"cognitive doc design","doc","README","trigger","writing","load","reduce","architecture","guides","documentation","design docs","docs","RFC","onboarding"]