Skip to content
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.

Sign up for GitHub

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

refactor(navbar): remove dropdown menu width #4757

Merged
merged 2 commits into from
Feb 5, 2025
Merged

refactor(navbar): remove dropdown menu width #4757

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a40620d
refactor: remove dropdown menu width
wingkwong Jan 29, 2025
dfd2eb7
refactor: shorter description
wingkwong Jan 31, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 5 additions & 6 deletions apps/docs/app/examples/navbar/with-dropdown-menu/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,42 +59,41 @@ export default function Page() {
</NavbarItem>
<DropdownMenu
aria-label="ACME features"
className="w-[340px]"
itemClasses={{
base: "gap-4",
}}
>
<DropdownItem
key="autoscaling"
description="ACME scales apps to meet user demand, automagically, based on load."
description="ACME scales apps based on demand and load"
startContent={icons.scale}
>
Autoscaling
</DropdownItem>
<DropdownItem
key="usage_metrics"
description="Real-time metrics to debug issues. Slow query added? We’ll show you exactly where."
description="Real-time metrics to debug issues"
startContent={icons.activity}
>
Usage Metrics
</DropdownItem>
<DropdownItem
key="production_ready"
description="ACME runs on ACME, join us and others serving requests at web scale."
description="ACME runs on ACME, join us at web scale"
startContent={icons.flash}
>
Production Ready
</DropdownItem>
<DropdownItem
key="99_uptime"
description="Applications stay on the grid with high availability and high uptime guarantees."
description="High availability and uptime guarantees"
startContent={icons.server}
>
+99% Uptime
</DropdownItem>
<DropdownItem
key="supreme_support"
description="Overcome any challenge with a supporting team ready to respond."
description="Support team ready to respond"
startContent={icons.user}
>
+Supreme Support
Expand Down
11 changes: 5 additions & 6 deletions apps/docs/content/components/navbar/with-dropdown-menu.raw.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -252,42 +252,41 @@ export default function App() {
</NavbarItem>
<DropdownMenu
aria-label="ACME features"
className="w-[340px]"
itemClasses={{
base: "gap-4",
}}
>
<DropdownItem
key="autoscaling"
description="ACME scales apps to meet user demand, automagically, based on load."
description="ACME scales apps based on demand and load"
startContent={icons.scale}
>
Autoscaling
</DropdownItem>
<DropdownItem
key="usage_metrics"
description="Real-time metrics to debug issues. Slow query added? We’ll show you exactly where."
description="Real-time metrics to debug issues"
startContent={icons.activity}
>
Usage Metrics
</DropdownItem>
<DropdownItem
key="production_ready"
description="ACME runs on ACME, join us and others serving requests at web scale."
description="ACME runs on ACME, join us at web scale"
startContent={icons.flash}
>
Production Ready
</DropdownItem>
<DropdownItem
key="99_uptime"
description="Applications stay on the grid with high availability and high uptime guarantees."
description="High availability and uptime guarantees"
startContent={icons.server}
>
+99% Uptime
</DropdownItem>
<DropdownItem
key="supreme_support"
description="Overcome any challenge with a supporting team ready to respond."
description="Support team ready to respond"
startContent={icons.user}
>
+Supreme Support
Expand Down
18 changes: 5 additions & 13 deletions packages/components/navbar/stories/navbar.stories.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -265,50 +265,42 @@ const WithDropdownTemplate = (args: NavbarProps) => {
</NavbarItem>
<DropdownMenu
aria-label="ACME features"
className="w-[340px]"
itemClasses={{
base: "gap-4",
wrapper: "py-3",
}}
>
<DropdownItem
key="autoscaling"
description="ACME scales apps to meet user demand, automagically, based on load."
description="ACME scales apps based on demand and load"
startContent={icons.scale}
>
Autoscaling
</DropdownItem>
<DropdownItem
key="safe_and_sound"
description="A secure mission control, without the policy headache. Permissions, 2FA, and more."
startContent={icons.lock}
>
Safe and Sound
</DropdownItem>
<DropdownItem
key="usage_metrics"
description="Real-time metrics to debug issues. Slow query added? We’ll show you exactly where."
description="Real-time metrics to debug issues"
startContent={icons.activity}
>
Usage Metrics
</DropdownItem>
<DropdownItem
key="production_ready"
description="ACME runs on ACME, join us and others serving requests at web scale."
description="ACME runs on ACME, join us at web scale"
startContent={icons.flash}
>
Production Ready
</DropdownItem>
<DropdownItem
key="99_uptime"
description="Applications stay on the grid with high availability and high uptime guarantees."
description="High availability and uptime guarantees"
startContent={icons.server}
>
+99% Uptime
</DropdownItem>
<DropdownItem
key="supreme_support"
description="Overcome any challenge with a supporting team ready to respond."
description="Support team ready to respond"
startContent={icons.user}
>
+Supreme Support
Expand Down