[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M733PDQM7SP28RBY2Y6ZWD9M":3,"skill-same:01M733PDQM7SP28RBY2Y6ZWD9M":55},{"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":15,"sourceHtmlUrl":16,"categories":17,"keywords":18,"publishedAt":19,"linkOnly":20,"markdownContent":21,"markdownBody":22,"frontMatter":23,"refName":24,"commitSha":25,"skillDirectory":26,"forksCount":27,"repositoryHtmlUrl":28,"repositoryHomepageUrl":6,"ownerHtmlUrl":29,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":30,"install":31,"resources":44},"01M733PDQM7SP28RBY2Y6ZWD9M","container-lines",null,"Add vertical container-size guide lines with mini corner squares for precise, structured web layouts. Use when asked for container lines, measured layout guides, vertical boundary lines, editorial grid markers, or small corner-square frame details.","LiamVisionary\u002Fhivemindos","LiamVisionary","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F102138294?v=4","01M73379NZZ99TT4ZS17XR3Q9D","01M73379PX6AKQNWN05VNSYRXW",13,"MIT","https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos\u002Fblob\u002Fmain\u002Fpackaged-skills\u002Foptional\u002Fdesign\u002Fmengto\u002Fcontainer-lines\u002FLICENSE","https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos\u002Fblob\u002Fmain\u002Fpackaged-skills\u002Foptional\u002Fdesign\u002Fmengto\u002Fcontainer-lines\u002FSKILL.md",[],[],"2026-11-11 15:11:14",false,"---\nname: container-lines\ndescription: Add vertical container-size guide lines with mini corner squares for precise, structured web layouts. Use when asked for container lines, measured layout guides, vertical boundary lines, editorial grid markers, or small corner-square frame details.\nlicense: MIT\n---\n# Container Lines\n\n## Use When\n- A page needs subtle vertical guides that reveal the content container width.\n- A hero, section, or product page feels too loose and needs structural tension.\n- The design calls for mini corner squares, measured edges, or quiet technical framing.\n\n## Rules\n1. Draw lines at the left and right edges of the main content container.\n2. Keep lines thin: `1px` with low opacity.\n3. Add mini squares at container corners or section intersections.\n4. Keep the line system consistent across sections; do not change width per section.\n5. Place lines behind content but above the page background.\n6. Disable pointer events so the guides never block UI.\n\n## Base Tokens\n\n```css\n:root {\n  --container-max: 1120px;\n  --container-pad: clamp(20px, 4vw, 48px);\n  --line-color: rgba(24, 24, 27, 0.14);\n  --line-strong: rgba(24, 24, 27, 0.28);\n  --corner-size: 6px;\n}\n```\n\n## Page Container Lines\nUse pseudo-elements on the layout shell.\n\n```css\n.container-lines {\n  position: relative;\n  isolation: isolate;\n}\n\n.container-lines::before,\n.container-lines::after {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  z-index: -1;\n  width: 1px;\n  background: var(--line-color);\n  pointer-events: none;\n}\n\n.container-lines::before {\n  left: max(var(--container-pad), calc((100vw - var(--container-max)) \u002F 2));\n}\n\n.container-lines::after {\n  right: max(var(--container-pad), calc((100vw - var(--container-max)) \u002F 2));\n}\n```\n\n## Corner Squares\nAdd four small squares to sections that need a precise measured feel.\n\n```css\n.corner-squares {\n  position: relative;\n}\n\n.corner-squares > .corner {\n  position: absolute;\n  width: var(--corner-size);\n  height: var(--corner-size);\n  background: var(--line-strong);\n  pointer-events: none;\n}\n\n.corner.top-left { top: 0; left: 0; transform: translate(-50%, -50%); }\n.corner.top-right { top: 0; right: 0; transform: translate(50%, -50%); }\n.corner.bottom-left { bottom: 0; left: 0; transform: translate(-50%, 50%); }\n.corner.bottom-right { right: 0; bottom: 0; transform: translate(50%, 50%); }\n```\n\n```html\n\u003Cmain class=\"container-lines\">\n  \u003Csection class=\"corner-squares\">\n    \u003Cspan class=\"corner top-left\">\u003C\u002Fspan>\n    \u003Cspan class=\"corner top-right\">\u003C\u002Fspan>\n    \u003Cspan class=\"corner bottom-left\">\u003C\u002Fspan>\n    \u003Cspan class=\"corner bottom-right\">\u003C\u002Fspan>\n    ...\n  \u003C\u002Fsection>\n\u003C\u002Fmain>\n```\n\n## Minimal Section Wrapper\nUse the same container width as the line positions.\n\n```css\n.content-container {\n  width: min(100% - (var(--container-pad) * 2), var(--container-max));\n  margin-inline: auto;\n}\n```\n\n## Taste Rules\n- Use lines as structure, not decoration. They should organize the page quietly.\n- Do not add lines to every nested component; keep them at page or major-section level.\n- Mini squares should be small and exact, usually `4px` to `8px`.\n- Avoid bright accent colors unless the entire visual system is technical or industrial.\n- Keep container max-width and padding shared between content and guide lines.\n\n## Quick Checks\n- The vertical lines align exactly with the content container edges.\n- Corner squares sit on real container or section corners, not arbitrary positions.\n- Lines remain subtle on light and dark backgrounds.\n- Mobile still has enough padding between the line and content.\n- Guides do not intercept clicks, hovers, or text selection.\n","# Container Lines\n\n## Use When\n- A page needs subtle vertical guides that reveal the content container width.\n- A hero, section, or product page feels too loose and needs structural tension.\n- The design calls for mini corner squares, measured edges, or quiet technical framing.\n\n## Rules\n1. Draw lines at the left and right edges of the main content container.\n2. Keep lines thin: `1px` with low opacity.\n3. Add mini squares at container corners or section intersections.\n4. Keep the line system consistent across sections; do not change width per section.\n5. Place lines behind content but above the page background.\n6. Disable pointer events so the guides never block UI.\n\n## Base Tokens\n\n```css\n:root {\n  --container-max: 1120px;\n  --container-pad: clamp(20px, 4vw, 48px);\n  --line-color: rgba(24, 24, 27, 0.14);\n  --line-strong: rgba(24, 24, 27, 0.28);\n  --corner-size: 6px;\n}\n```\n\n## Page Container Lines\nUse pseudo-elements on the layout shell.\n\n```css\n.container-lines {\n  position: relative;\n  isolation: isolate;\n}\n\n.container-lines::before,\n.container-lines::after {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  z-index: -1;\n  width: 1px;\n  background: var(--line-color);\n  pointer-events: none;\n}\n\n.container-lines::before {\n  left: max(var(--container-pad), calc((100vw - var(--container-max)) \u002F 2));\n}\n\n.container-lines::after {\n  right: max(var(--container-pad), calc((100vw - var(--container-max)) \u002F 2));\n}\n```\n\n## Corner Squares\nAdd four small squares to sections that need a precise measured feel.\n\n```css\n.corner-squares {\n  position: relative;\n}\n\n.corner-squares > .corner {\n  position: absolute;\n  width: var(--corner-size);\n  height: var(--corner-size);\n  background: var(--line-strong);\n  pointer-events: none;\n}\n\n.corner.top-left { top: 0; left: 0; transform: translate(-50%, -50%); }\n.corner.top-right { top: 0; right: 0; transform: translate(50%, -50%); }\n.corner.bottom-left { bottom: 0; left: 0; transform: translate(-50%, 50%); }\n.corner.bottom-right { right: 0; bottom: 0; transform: translate(50%, 50%); }\n```\n\n```html\n\u003Cmain class=\"container-lines\">\n  \u003Csection class=\"corner-squares\">\n    \u003Cspan class=\"corner top-left\">\u003C\u002Fspan>\n    \u003Cspan class=\"corner top-right\">\u003C\u002Fspan>\n    \u003Cspan class=\"corner bottom-left\">\u003C\u002Fspan>\n    \u003Cspan class=\"corner bottom-right\">\u003C\u002Fspan>\n    ...\n  \u003C\u002Fsection>\n\u003C\u002Fmain>\n```\n\n## Minimal Section Wrapper\nUse the same container width as the line positions.\n\n```css\n.content-container {\n  width: min(100% - (var(--container-pad) * 2), var(--container-max));\n  margin-inline: auto;\n}\n```\n\n## Taste Rules\n- Use lines as structure, not decoration. They should organize the page quietly.\n- Do not add lines to every nested component; keep them at page or major-section level.\n- Mini squares should be small and exact, usually `4px` to `8px`.\n- Avoid bright accent colors unless the entire visual system is technical or industrial.\n- Keep container max-width and padding shared between content and guide lines.\n\n## Quick Checks\n- The vertical lines align exactly with the content container edges.\n- Corner squares sit on real container or section corners, not arbitrary positions.\n- Lines remain subtle on light and dark backgrounds.\n- Mobile still has enough padding between the line and content.\n- Guides do not intercept clicks, hovers, or text selection.\n",{"name":5,"license":14,"description":7},"main","f270c4ae4f9d09c4e5da9cfa8adab7e89ae1f53e","packaged-skills\u002Foptional\u002Fdesign\u002Fmengto\u002Fcontainer-lines",4,"https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos","https:\u002F\u002Fgithub.com\u002FLiamVisionary","2026-11-10 21:48:41",{"source":8,"skillName":5,"commands":32,"prompt":42,"zipAvailable":43},[33,36,39],{"tool":34,"command":35},"npx","npx skills add LiamVisionary\u002Fhivemindos --skill container-lines",{"tool":37,"command":38},"bunx","bunx skills add LiamVisionary\u002Fhivemindos --skill container-lines",{"tool":40,"command":41},"pnpm","pnpm dlx skills add LiamVisionary\u002Fhivemindos --skill container-lines","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos\u002Fblob\u002Fmain\u002Fpackaged-skills\u002Foptional\u002Fdesign\u002Fmengto\u002Fcontainer-lines\u002FSKILL.md",true,[45,51],{"path":46,"resourceType":47,"resourceTypeDesc":48,"sizeBytes":49,"sourceHtmlUrl":50},".hivemind-skill-source.json","REFERENCE","参考文档",1159,"https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos\u002Fblob\u002Fmain\u002Fpackaged-skills\u002Foptional\u002Fdesign\u002Fmengto\u002Fcontainer-lines\u002F.hivemind-skill-source.json",{"path":52,"resourceType":52,"resourceTypeDesc":53,"sizeBytes":54,"sourceHtmlUrl":15},"LICENSE","许可证",1064,[56,63,70,77,84,91],{"skillNo":57,"name":58,"nameZh":6,"description":59,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":60,"categories":61,"keywords":62,"publishedAt":19},"01M734AA85KQEXDQXQJ3T7769M","tailscale-generation-skill-authoring","This skill should be used when the user asks to \"create a Tailscale generation skill\", \"add a local generation skill\", \"document a generation endpoint\", \"add an image generation provider\", \"add a TTS provider\", \"add video generation\", \"add 3D generation\", or needs guidance on where HivemindOS Tailscale or local generation providers belong in the shared skills shelf.","https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos\u002Fblob\u002Fmain\u002Fskills\u002Ftailscale-generation-skill-authoring\u002FSKILL.md",[],[],{"skillNo":64,"name":65,"nameZh":6,"description":66,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":67,"categories":68,"keywords":69,"publishedAt":19},"01M734A7VD69PRA0C0EV5EFY9T","localtts","This skill should be used when the user asks to \"generate local TTS\", \"use local text to speech\", \"use remote TTS over Tailscale\", \"make speech audio\", \"add a TTS provider\", \"use Qwen3-TTS\", or needs TTS endpoint setup through local or HivemindOS Tailscale routes.","https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos\u002Fblob\u002Fmain\u002Fskills\u002Flocaltts\u002FSKILL.md",[],[],{"skillNo":71,"name":72,"nameZh":6,"description":73,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":74,"categories":75,"keywords":76,"publishedAt":19},"01M734A4K2Z0F74QZP7V7WBFRY","karpathy-guidelines","Behavioral guidelines to reduce common LLM coding mistakes. Use when writing, reviewing, or refactoring code to avoid overcomplication, make surgical changes, surface assumptions, and define verifiable success criteria.","https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos\u002Fblob\u002Fmain\u002Fskills\u002Fkarpathy-guidelines\u002FSKILL.md",[],[],{"skillNo":78,"name":79,"nameZh":6,"description":80,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":81,"categories":82,"keywords":83,"publishedAt":19},"01M734A1HMVYVJX3YJGNQ6KF6C","comfyui-image-generation","This skill should be used when the user asks to \"generate images\", \"generate images with ComfyUI\", \"use local ComfyUI\", \"use remote ComfyUI\", \"use Z-Image\", \"add an image generation provider\", or needs image-generation endpoint setup through local or HivemindOS Tailscale routes.","https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos\u002Fblob\u002Fmain\u002Fskills\u002Fcomfyui-image-generation\u002FSKILL.md",[],[],{"skillNo":85,"name":86,"nameZh":6,"description":87,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":88,"categories":89,"keywords":90,"publishedAt":19},"01M7349Y684Q676DNNHZPSC8W1","wrangler","Cloudflare Workers CLI for deploying, developing, and managing Workers, KV, R2, D1, Vectorize, Hyperdrive, Workers AI, Containers, Queues, Workflows, Pipelines, and Secrets Store. Load before running wrangler commands to ensure correct syntax and best practices. Biases towards retrieval from Cloudflare docs over pre-trained knowledge.","https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos\u002Fblob\u002Fmain\u002Fskills\u002Fcloudflare\u002Fwrangler\u002FSKILL.md",[],[],{"skillNo":92,"name":93,"nameZh":6,"description":94,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":95,"categories":96,"keywords":97,"publishedAt":19},"01M7349V3WCBF835QP74SA9Q8C","workers-best-practices","Reviews and authors Cloudflare Workers code against production best practices. Load when writing new Workers, reviewing Worker code, configuring wrangler.jsonc, or checking for common Workers anti-patterns (streaming, floating promises, global state, secrets, bindings, observability). Biases towards retrieval from Cloudflare docs over pre-trained knowledge.","https:\u002F\u002Fgithub.com\u002FLiamVisionary\u002Fhivemindos\u002Fblob\u002Fmain\u002Fskills\u002Fcloudflare\u002Fworkers-best-practices\u002FSKILL.md",[],[]]