CommunityRule/community-rule
2
0 Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Match Home, top nav, hero, and logo wall to the current marketing frames.

Browse Source 
Puts Workshops in the header, pairs the hero with a static rule card and breakpoint CTAs, and shows the three pilot marks with no wall label.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
adilalloandCursor committed 2026-11-02 18:50:32 -07:00
1 parent e12e06f7ce
commit 33cdaf135c
47 files changed
+728 -527
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/components/navigation/Top/Top.container.tsx
+34 -32
View File
@@ -1,8 +1,8 @@
"use client";
/**
* Figma: "Navigation / Top" (22078-808559); Folder-top 430–639 (18582:22056),
* 640–1023 (18580:17113).
* Figma: "Navigation / Top" (5944:17779); Folder-top 320–429 (18583:22098),
* 430–639 (18582:22056); standard 320–429 (18411:57843).
*/
import { memo, useCallback } from "react";
@@ -82,7 +82,7 @@ const TopContainer = memo<TopProps>(
const logoSize = folderTop ? "topNavFolderTop" : "topNavHeader";
const navigationItems = [
{ href: "/use-cases", text: t("navigation.useCases"), extraPadding: true },
{ href: "/workshops", text: t("navigation.workshops") },
{ href: "/learn", text: t("navigation.learn") },
{ href: "/about", text: t("navigation.about") },
];
@@ -93,30 +93,25 @@ const TopContainer = memo<TopProps>(
? FOLDER_NAV_ITEM_RESPONSIVE_CLASS
: NAV_ITEM_RESPONSIVE_CLASS;
return navigationItems.map((item) => {
const isUseCases = item.extraPadding === true;
return (
<MenuItem
key={item.href}
href={item.href}
size="X Small"
mode={mode}
state={pathname === item.href ? "selected" : "default"}
reducedPadding={isUseCases}
className={sizeClass}
ariaLabel={t("ariaLabels.navigateToPage").replace(
"{text}",
item.text,
)}
>
{item.text}
</MenuItem>
);
});
return navigationItems.map((item) => (
<MenuItem
key={item.href}
href={item.href}
size="X Small"
mode={mode}
state={pathname === item.href ? "selected" : "default"}
className={sizeClass}
ariaLabel={t("ariaLabels.navigateToPage").replace(
"{text}",
item.text,
)}
>
{item.text}
</MenuItem>
));
};
const renderLoginButton = () => {
const renderLoginButton = (className = "") => {
const label = loggedIn ? t("buttons.profile") : t("buttons.logIn");
const ariaLabel = loggedIn
? t("ariaLabels.goToProfile")
@@ -124,16 +119,23 @@ const TopContainer = memo<TopProps>(
const navSelected =
(loggedIn && pathname === "/profile") ||
(!loggedIn && pathname === "/login");
const loginClassName = folderTop
? FOLDER_NAV_ITEM_RESPONSIVE_CLASS
: NAV_ITEM_RESPONSIVE_CLASS;
const loginClassName = [
folderTop
? FOLDER_NAV_ITEM_RESPONSIVE_CLASS
: NAV_ITEM_RESPONSIVE_CLASS,
className,
]
.filter(Boolean)
.join(" ");
const inFolderTab = folderTop && className.includes("md:hidden");
const mode = inFolderTab ? "inverse" : "default";
if (loggedIn) {
return (
<MenuItem
href="/profile"
size="X Small"
mode="default"
mode={mode}
state={navSelected ? "selected" : "default"}
className={loginClassName}
ariaLabel={ariaLabel}
@@ -154,7 +156,7 @@ const TopContainer = memo<TopProps>(
}
href="/login"
size="X Small"
mode="default"
mode={mode}
state={navSelected ? "selected" : "default"}
className={loginClassName}
ariaLabel={ariaLabel}
@@ -182,8 +184,8 @@ const TopContainer = memo<TopProps>(
size="small"
className={
folderTop
? "md:-space-x-[9px] lg:-space-x-[var(--space-250)] xl:-space-x-[13px]"
: "lg:-space-x-[var(--space-250)] xl:-space-x-[13px]"
? "max-sm:hidden md:-space-x-[9px] lg:-space-x-[var(--space-250)] xl:-space-x-[13px]"
: "max-sm:hidden lg:-space-x-[var(--space-250)] xl:-space-x-[13px]"
}
>
{avatarImageSources.map((src, index) => (