-
-
Notifications
You must be signed in to change notification settings - Fork 407
docs: update docs navbar #888
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
|
This comment has been minimized.
This comment has been minimized.
Deploying voltagent with
|
| Latest commit: |
78e1f0f
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://5035f9ad.voltagent.pages.dev |
| Branch Preview URL: | https://update-doc-navbar.voltagent.pages.dev |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
3 issues found across 13 files
Prompt for AI agents (all issues)
Check if these issues are valid — if so, understand the root cause of each and fix them.
<file name="website/src/components/navbar/index.tsx">
<violation number="1" location="website/src/components/navbar/index.tsx:230">
P2: Incomplete ARIA tablist implementation. The `role="tablist"` container requires children with `role="tab"` and `aria-selected` attributes. Since these are navigation links rather than content-switching tabs, consider either removing `role="tablist"` or adding proper tab semantics.</violation>
</file>
<file name="website/src/components/ops/Observability.tsx">
<violation number="1" location="website/src/components/ops/Observability.tsx:686">
P2: Removing the biome lint suppression without fixing the accessibility issue. The `<div>` with `onClick` still lacks keyboard handlers. Either restore the ignore comment or properly fix the accessibility by adding `role="button"`, `tabIndex={0}`, and an `onKeyDown` handler that responds to Enter/Space keys.</violation>
</file>
<file name="website/src/css/layout.css">
<violation number="1" location="website/src/css/layout.css:211">
P1: `overflow: hidden` on a documentation sidebar will prevent users from scrolling to see navigation items that exceed the viewport height. Consider using `overflow-y: auto` to allow vertical scrolling while keeping horizontal overflow hidden.</violation>
</file>
Reply to cubic to teach it or ask questions. Re-run a review with @cubic-dev-ai review this PR
| </div> | ||
| {/* Bottom Row: Tabs */} | ||
| <div className={styles.docsNavbarBottom}> | ||
| <div className={styles.docsTabList} role="tablist" aria-label="Documentation sections"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
P2: Incomplete ARIA tablist implementation. The role="tablist" container requires children with role="tab" and aria-selected attributes. Since these are navigation links rather than content-switching tabs, consider either removing role="tablist" or adding proper tab semantics.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At website/src/components/navbar/index.tsx, line 230:
<comment>Incomplete ARIA tablist implementation. The `role="tablist"` container requires children with `role="tab"` and `aria-selected` attributes. Since these are navigation links rather than content-switching tabs, consider either removing `role="tablist"` or adding proper tab semantics.</comment>
<file context>
@@ -117,6 +141,112 @@ export default function Navbar() {
+ </div>
+ {/* Bottom Row: Tabs */}
+ <div className={styles.docsNavbarBottom}>
+ <div className={styles.docsTabList} role="tablist" aria-label="Documentation sections">
+ {docTabs.map((tab) => (
+ <Link
</file context>
| <div className={styles.docsTabList} role="tablist" aria-label="Documentation sections"> | |
| <div className={styles.docsTabList} aria-label="Documentation sections"> |
| }) => { | ||
| return ( | ||
| // biome-ignore lint/a11y/useKeyWithClickEvents: ignore | ||
| <div |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
P2: Removing the biome lint suppression without fixing the accessibility issue. The <div> with onClick still lacks keyboard handlers. Either restore the ignore comment or properly fix the accessibility by adding role="button", tabIndex={0}, and an onKeyDown handler that responds to Enter/Space keys.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At website/src/components/ops/Observability.tsx, line 686:
<comment>Removing the biome lint suppression without fixing the accessibility issue. The `<div>` with `onClick` still lacks keyboard handlers. Either restore the ignore comment or properly fix the accessibility by adding `role="button"`, `tabIndex={0}`, and an `onKeyDown` handler that responds to Enter/Space keys.</comment>
<file context>
@@ -683,7 +683,6 @@ const TabItem = ({
}) => {
return (
- // biome-ignore lint/a11y/useKeyWithClickEvents: ignore
<div
className={`flex flex-col items-center px-3 pt-2 cursor-pointer transition-all duration-300 ease-in-out min-w-[80px] ${
isActive ? " " : "border-transparent text-gray-300 hover:text-gray-200 "
</file context>
| top: 100px; | ||
| height: calc(100vh - 100px); | ||
| align-self: flex-start; | ||
| overflow: hidden; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
P1: overflow: hidden on a documentation sidebar will prevent users from scrolling to see navigation items that exceed the viewport height. Consider using overflow-y: auto to allow vertical scrolling while keeping horizontal overflow hidden.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At website/src/css/layout.css, line 211:
<comment>`overflow: hidden` on a documentation sidebar will prevent users from scrolling to see navigation items that exceed the viewport height. Consider using `overflow-y: auto` to allow vertical scrolling while keeping horizontal overflow hidden.</comment>
<file context>
@@ -204,6 +204,11 @@ div[class^="announcementBar_"] button {
+ top: 100px;
+ height: calc(100vh - 100px);
+ align-self: flex-start;
+ overflow: hidden;
}
</file context>
| overflow: hidden; | |
| overflow-y: auto; |
PR Checklist
Please check if your PR fulfills the following requirements:
Bugs / Features
What is the current behavior?
What is the new behavior?
fixes (issue)
Notes for reviewers
Summary by cubic
Updated the docs navigation with a new sticky, two-row navbar and streamlined layout to make browsing and search faster and more consistent across documentation pages. Removes the old docs header and aligns the sidebar and TOC with the new navbar.
New Features
Refactors
Written for commit 78e1f0f. Summary will update automatically on new commits.