feat(docs): comprehensive documentation and website improvements #28
Conversation
Website improvements: - Add AdvancedFeatures component for Memory, Primer, Mesh, Messaging - Add UseCases component with real-world scenarios - Add TeamEnterprise component for collaboration features - Update Hero section with better value proposition - Update Features section with improved presentation - Make all components mobile responsive - Pre-populate StackBuilder with default skills - Hide Apache 2.0 on mobile, show Docs link on mobile Documentation updates: - Create primer.mdx for auto-generate instructions feature - Create teams.mdx for team collaboration documentation - Enhance index.mdx with comprehensive feature overview - Update quickstart.mdx with advanced features section - Expand api-reference.mdx with Mesh, Messaging, Workflow APIs - Update configuration.mdx with Memory, Mesh, Primer settings - Simplify fumadocs homepage for cleaner presentation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Important Review skippedToo many files! This PR contains 300 files, which is 150 over the limit of 150. You can disable this status message by setting the
📝 WalkthroughWalkthroughThis PR expands SkillKit's documentation and marketing website with new public data structures (SkillMetadata, ProjectAnalysis, MeshMessage, WorkflowResult), comprehensive guides for new features (Primer, Mesh Networks, Team Collaboration), and a redesigned landing page with new UI components showcasing advanced capabilities and use cases. Changes
Sequence Diagram(s)No sequence diagrams generated — changes are primarily documentation, UI markup, and styling updates without introducing multi-component control flow interactions or complex sequential logic. Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![devin-ai-integration[bot]](https://avatars.githubusercontent.com/in/811515?s=60&v=4){kind=small}
docs/fumadocs/content/docs/index.mdx
Outdated
| - **New Project Starter** - Auto-generate agent instructions with Primer | ||
| - **Enterprise Architect** - Distribute agents across multiple machines with Mesh Network | ||
|
|
||
| ## Enterprise Features- **Private Registries** - Host internal skills in private repos |
There was a problem hiding this comment.
🟡 Missing newline between markdown heading and list causes malformed rendering
The markdown heading ## Enterprise Features is directly concatenated with the first bullet point without a newline separator, resulting in ## Enterprise Features- **Private Registries**....
Click to expand
What happens
The heading and first bullet are on the same line:
## Enterprise Features- **Private Registries** - Host internal skills in private reposExpected
There should be a blank line between the heading and the bullet list:
## Enterprise Features
- **Private Registries** - Host internal skills in private reposImpact
The markdown parser will not correctly render the heading and first list item. The heading will include the first bullet text, and the bullet list will be missing its first item or render incorrectly depending on the markdown renderer.
Recommendation: Add a newline after ## Enterprise Features and before the first bullet point - **Private Registries**
Was this helpful? React with 👍 or 👎 to provide feedback.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 5
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
docs/skillkit/App.tsx (1)
46-81:⚠️ Potential issue | 🟡 MinorMissing navigation link for the Team section.
The navigation includes links to Trending, Stack, Features (advanced), Use Cases, and Generator, but there's no link to the "team" section (Line 186) where
TeamEnterpriseis rendered. This may be intentional, but users won't be able to navigate directly to it from the header.🔗 Suggested fix to add Team navigation link
<a href="#use-cases" onClick={(e) => scrollToSection(e, 'use-cases')} className="text-zinc-500 hover:text-white transition-colors" > Use Cases </a> + <a + href="#team" + onClick={(e) => scrollToSection(e, 'team')} + className="text-zinc-500 hover:text-white transition-colors" + > + Teams + </a> <a href="#skills"
🤖 Fix all issues with AI agents
In `@docs/fumadocs/content/docs/configuration.mdx`:
- Around line 190-201: The example profiles use mesh.security but the schema
expects mesh.security.mode; update both profile blocks (the development and
production entries under profiles) to set mesh.security.mode to the correct
values ("development" and "strict") instead of mesh.security, preserving the
rest of the keys (agent, autoSync) so the example matches the schema.
In `@docs/fumadocs/content/docs/index.mdx`:
- Around line 142-146: The "Enterprise Features- **Private Registries**" header
is merged with the first list item; separate the Markdown heading from the list
by placing the header on its own line (e.g., change "## Enterprise Features-
**Private Registries** - Host internal skills in private repos" to a standalone
heading like "## Enterprise Features" or "## Enterprise Features — Private
Registries" on its own line) and move the bullets ("- **Git-Based Sync** …", "-
**CI/CD Integration** …", etc.) onto subsequent lines as a proper list so the
heading and the list are distinct and render correctly; update the header text
in the same block where "Enterprise Features- **Private Registries**" appears.
In `@docs/fumadocs/content/docs/primer.mdx`:
- Around line 159-163: Prepend a POSIX-compatible bash shebang line (for
example, using the env wrapper to locate bash) as the very first line of the git
hook shown in the primer so the hook file (.git/hooks/post-checkout) is executed
with the correct interpreter; keep the existing echo and chmod +x steps intact
so the hook content is written and made executable. Ensure the documentation
snippet shows the shebang on its own first line before the echo "skillkit primer
--incremental" redirection.
In `@docs/skillkit/components/Features.tsx`:
- Around line 38-40: Update the description string for the feature object with
title 'Primer' to reflect multi-agent output rather than only CLAUDE.md; locate
the object containing title: 'Primer' and replace the description value
(currently 'Auto-generate CLAUDE.md from your codebase.') with a concise phrase
like 'Auto-generate agent instructions and documentation (e.g., CLAUDE.md and
other agents) from your codebase.' to accurately describe multi-agent output.
In `@docs/skillkit/styles.css`:
- Around line 32-35: The css rule setting smooth scrolling on the html selector
should respect users' reduced-motion preferences; wrap or override html {
scroll-behavior: smooth; } with a prefers-reduced-motion media query so that
when (prefers-reduced-motion: reduce) the html scroll-behavior is set to auto
(or removed). Update the styles.css to add the media query targeting
prefers-reduced-motion and ensure the html selector inside it resets
scroll-behavior accordingly.
🧹 Nitpick comments (2)
docs/fumadocs/src/app/(home)/page.tsx (1)
9-12: Consider extracting the version number to a shared constant.The version
v1.8.0is hardcoded here. If this version is displayed elsewhere or needs to stay in sync with package.json, consider extracting it to a shared constant or importing it from the package configuration.docs/skillkit/components/AdvancedFeatures.tsx (1)
119-134: Consider adding accessible attributes to the tab buttons.The tab interface lacks ARIA attributes for screen readers. Adding
role="tablist"to the container androle="tab",aria-selected, andaria-controlsto buttons would improve accessibility.♿ Suggested accessibility improvements
- <div className="flex justify-center gap-1 sm:gap-2 mb-8 flex-wrap"> + <div className="flex justify-center gap-1 sm:gap-2 mb-8 flex-wrap" role="tablist" aria-label="Advanced features"> {ADVANCED_FEATURES.map((f) => { const isActive = f.id === activeFeature; return ( <button key={f.id} onClick={() => setActiveFeature(f.id)} + role="tab" + aria-selected={isActive} + aria-controls={`${f.id}-panel`} className={`group relative px-2 sm:px-4 py-1.5 sm:py-2 font-mono text-xs sm:text-sm transition-all duration-300 ${Then add
id={${feature.id}-panel}androle="tabpanel"to the feature content container at Line 138.
| profiles: | ||
| development: | ||
| agent: claude | ||
| autoSync: true | ||
| mesh: | ||
| security: development | ||
|
|
||
| production: | ||
| agent: universal | ||
| autoSync: false | ||
| mesh: | ||
| security: strict |
There was a problem hiding this comment.
Keep profile examples consistent with the mesh schema.
The profile snippet uses mesh.security: development, but earlier config shows mesh.security.mode.
✅ Suggested fix
profiles:
development:
agent: claude
autoSync: true
mesh:
- security: development
+ security:
+ mode: development
production:
agent: universal
autoSync: false
mesh:
- security: strict
+ security:
+ mode: strict📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| profiles: | |
| development: | |
| agent: claude | |
| autoSync: true | |
| mesh: | |
| security: development | |
| production: | |
| agent: universal | |
| autoSync: false | |
| mesh: | |
| security: strict | |
| profiles: | |
| development: | |
| agent: claude | |
| autoSync: true | |
| mesh: | |
| security: | |
| mode: development | |
| production: | |
| agent: universal | |
| autoSync: false | |
| mesh: | |
| security: | |
| mode: strict |
🤖 Prompt for AI Agents
In `@docs/fumadocs/content/docs/configuration.mdx` around lines 190 - 201, The
example profiles use mesh.security but the schema expects mesh.security.mode;
update both profile blocks (the development and production entries under
profiles) to set mesh.security.mode to the correct values ("development" and
"strict") instead of mesh.security, preserving the rest of the keys (agent,
autoSync) so the example matches the schema.
docs/fumadocs/content/docs/index.mdx
Outdated
| ## Enterprise Features- **Private Registries** - Host internal skills in private repos | ||
| - **Git-Based Sync** - Skills live in your repo, push to share | ||
| - **CI/CD Integration** - Auto-validate and deploy skills on every commit | ||
| - **TypeScript API** - Full programmatic access for custom workflows | ||
| - **Security** - Ed25519 encryption, XChaCha20-Poly1305, TLS 1.3 |
There was a problem hiding this comment.
Fix the Enterprise Features heading formatting.
The heading and first list item are on the same line, which breaks Markdown rendering.
✅ Suggested fix
-## Enterprise Features- **Private Registries** - Host internal skills in private repos
+## Enterprise Features
+
+- **Private Registries** - Host internal skills in private repos📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| ## Enterprise Features- **Private Registries** - Host internal skills in private repos | |
| - **Git-Based Sync** - Skills live in your repo, push to share | |
| - **CI/CD Integration** - Auto-validate and deploy skills on every commit | |
| - **TypeScript API** - Full programmatic access for custom workflows | |
| - **Security** - Ed25519 encryption, XChaCha20-Poly1305, TLS 1.3 | |
| ## Enterprise Features | |
| - **Private Registries** - Host internal skills in private repos | |
| - **Git-Based Sync** - Skills live in your repo, push to share | |
| - **CI/CD Integration** - Auto-validate and deploy skills on every commit | |
| - **TypeScript API** - Full programmatic access for custom workflows | |
| - **Security** - Ed25519 encryption, XChaCha20-Poly1305, TLS 1.3 |
🤖 Prompt for AI Agents
In `@docs/fumadocs/content/docs/index.mdx` around lines 142 - 146, The "Enterprise
Features- **Private Registries**" header is merged with the first list item;
separate the Markdown heading from the list by placing the header on its own
line (e.g., change "## Enterprise Features- **Private Registries** - Host
internal skills in private repos" to a standalone heading like "## Enterprise
Features" or "## Enterprise Features — Private Registries" on its own line) and
move the bullets ("- **Git-Based Sync** …", "- **CI/CD Integration** …", etc.)
onto subsequent lines as a proper list so the heading and the list are distinct
and render correctly; update the header text in the same block where "Enterprise
Features- **Private Registries**" appears.
| ```bash | ||
| # Auto-generate on git hooks | ||
| echo "skillkit primer --incremental" >> .git/hooks/post-checkout | ||
| chmod +x .git/hooks/post-checkout | ||
| ``` |
There was a problem hiding this comment.
Add a shebang to the git hook snippet.
Without a shebang, the hook can fail with an exec format error when Git runs it.
✅ Suggested doc fix
-# Auto-generate on git hooks
-echo "skillkit primer --incremental" >> .git/hooks/post-checkout
-chmod +x .git/hooks/post-checkout
+# Auto-generate on git hooks
+cat > .git/hooks/post-checkout <<'EOF'
+#!/bin/sh
+skillkit primer --incremental
+EOF
+chmod +x .git/hooks/post-checkout🤖 Prompt for AI Agents
In `@docs/fumadocs/content/docs/primer.mdx` around lines 159 - 163, Prepend a
POSIX-compatible bash shebang line (for example, using the env wrapper to locate
bash) as the very first line of the git hook shown in the primer so the hook
file (.git/hooks/post-checkout) is executed with the correct interpreter; keep
the existing echo and chmod +x steps intact so the hook content is written and
made executable. Ensure the documentation snippet shows the shebang on its own
first line before the echo "skillkit primer --incremental" redirection.
| title: 'Primer', | ||
| description: 'Auto-generate CLAUDE.md from your codebase.', | ||
| icon: ( |
There was a problem hiding this comment.
Align Primer copy with multi-agent output.
The text currently implies only CLAUDE.md; Primer generates instructions for multiple agents.
✅ Suggested copy update
- description: 'Auto-generate CLAUDE.md from your codebase.',
+ description: 'Auto-generate agent instructions (CLAUDE.md, .cursorrules, and more).',📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| title: 'Primer', | |
| description: 'Auto-generate CLAUDE.md from your codebase.', | |
| icon: ( | |
| title: 'Primer', | |
| description: 'Auto-generate agent instructions (CLAUDE.md, .cursorrules, and more).', | |
| icon: ( |
🤖 Prompt for AI Agents
In `@docs/skillkit/components/Features.tsx` around lines 38 - 40, Update the
description string for the feature object with title 'Primer' to reflect
multi-agent output rather than only CLAUDE.md; locate the object containing
title: 'Primer' and replace the description value (currently 'Auto-generate
CLAUDE.md from your codebase.') with a concise phrase like 'Auto-generate agent
instructions and documentation (e.g., CLAUDE.md and other agents) from your
codebase.' to accurately describe multi-agent output.
docs/skillkit/styles.css
Outdated
| /* Smooth scrolling */ | ||
| html { | ||
| scroll-behavior: smooth; | ||
| } |
There was a problem hiding this comment.
Respect reduced-motion preferences for smooth scrolling.
Smooth scrolling can be problematic for motion-sensitive users; add a reduced-motion override.
✅ Suggested fix
html {
scroll-behavior: smooth;
}
+@media (prefers-reduced-motion: reduce) {
+ html {
+ scroll-behavior: auto;
+ }
+}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| /* Smooth scrolling */ | |
| html { | |
| scroll-behavior: smooth; | |
| } | |
| /* Smooth scrolling */ | |
| html { | |
| scroll-behavior: smooth; | |
| } | |
| `@media` (prefers-reduced-motion: reduce) { | |
| html { | |
| scroll-behavior: auto; | |
| } | |
| } |
🤖 Prompt for AI Agents
In `@docs/skillkit/styles.css` around lines 32 - 35, The css rule setting smooth
scrolling on the html selector should respect users' reduced-motion preferences;
wrap or override html { scroll-behavior: smooth; } with a prefers-reduced-motion
media query so that when (prefers-reduced-motion: reduce) the html
scroll-behavior is set to auto (or removed). Update the styles.css to add the
media query targeting prefers-reduced-motion and ensure the html selector inside
it resets scroll-behavior accordingly.
- Fix markdown heading/list separation in index.mdx - Fix mesh.security schema in configuration.mdx profiles - Add shebang to git hook script in primer.mdx - Update Primer description for multi-agent support in Features.tsx - Add prefers-reduced-motion media query for accessibility in styles.css - Add ARIA attributes (role, aria-selected, aria-controls) to AdvancedFeatures tabs
Website improvements:
Documentation updates:
Summary by CodeRabbit
Release Notes v1.8.0
Documentation
New Features
Style
✏️ Tip: You can customize this high-level summary in your review settings.