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

Point color, radius, stroke, focus, and type tokens at the Figma scale so later sections use the same values.

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
adilalloandCursor committed 2026-11-02 17:03:43 -07:00
1 parent 63d5d21ae0
commit e808fe70bf
162 files changed
+1385 -1377
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/components/navigation/CreateFlowTopNav/CreateFlowTopNav.view.tsx
+8 -8
View File
@@ -8,10 +8,10 @@ import type { CreateFlowTopNavViewProps } from "./CreateFlowTopNav.types";
import { CREATE_FLOW_PAGE_GUTTER_CLASS } from "../../../(app)/create/components/createFlowLayoutTokens";
const outlineButtonClass =
"md:!text-x-small-label !text-xx-small-label !px-[var(--spacing-scale-006,6px)] md:!px-[var(--spacing-scale-008,8px)] !py-[6px] md:!py-[8px] !border md:!border-[1.5px]";
"md:!text-x-small-label !text-xx-small-label !px-[var(--space-150)] md:!px-[var(--space-200)] !py-[6px] md:!py-[8px] !border md:!border-[1.5px]";
const exitButtonFigmaClass =
"!rounded-[var(--radius-measures-radius-full,9999px)] !border-[1.25px] !px-[var(--spacing-measures-spacing-250,10px)] !py-[var(--spacing-measures-spacing-200,8px)] md:!text-x-small-label";
"!rounded-[var(--radius-full)] !border-[1.25px] !px-[var(--space-250)] !py-[var(--space-200)] md:!text-x-small-label";
function KebabIcon({ className = "" }: { className?: string }) {
return (
@@ -110,7 +110,7 @@ export function CreateFlowTopNavView({
aria-expanded={exportMenuOpen}
aria-controls={exportMenuId}
onClick={() => setExportMenuOpen((o) => !o)}
className={`justify-center gap-[var(--spacing-scale-002,2px)] !pl-[var(--spacing-scale-012,12px)] !pr-[var(--spacing-scale-006,6px)] md:!pr-[var(--spacing-scale-006,6px)] ${outlineButtonClass}`}
className={`justify-center gap-[var(--space-050)] !pl-[var(--space-300)] !pr-[var(--space-150)] md:!pr-[var(--space-150)] ${outlineButtonClass}`}
>
<span>{exportLabel}</span>
<svg
@@ -129,7 +129,7 @@ export function CreateFlowTopNavView({
</svg>
</Button>
{exportMenuOpen ? (
<div className="absolute right-0 top-[calc(100%+var(--spacing-measures-spacing-200,8px))] z-[300]">
<div className="absolute right-0 top-[calc(100%+var(--space-200))] z-[300]">
<Popover
id={exportMenuId}
menuAriaLabel={exportPopoverMenuAriaLabel}
@@ -230,13 +230,13 @@ export function CreateFlowTopNavView({
aria-label={bannerAriaLabel}
>
<nav
className={`flex items-center justify-between mx-auto w-full max-w-[1920px] ${CREATE_FLOW_PAGE_GUTTER_CLASS} py-[var(--spacing-measures-spacing-300,12px)] md:py-[var(--spacing-measures-spacing-016,16px)]`}
className={`flex items-center justify-between mx-auto w-full max-w-[1920px] ${CREATE_FLOW_PAGE_GUTTER_CLASS} py-[var(--space-300)] md:py-[var(--space-400)]`}
role="navigation"
aria-label={navAriaLabel}
>
<Logo size="createFlow" wordmark palette={buttonPalette} />
<div className="flex flex-wrap items-center justify-end gap-[var(--spacing-scale-012,12px)]">
<div className="flex flex-wrap items-center justify-end gap-[var(--space-300)]">
{useKebabMenu ? (
<div className="relative" ref={actionsWrapRef}>
<Button
@@ -249,12 +249,12 @@ export function CreateFlowTopNavView({
aria-expanded={actionsMenuOpen}
aria-controls={actionsMenuId}
onClick={() => setActionsMenuOpen((open) => !open)}
className={`!px-[var(--spacing-scale-010,10px)] ${outlineButtonClass}`}
className={`!px-[var(--space-250)] ${outlineButtonClass}`}
>
<KebabIcon />
</Button>
{actionsMenuOpen ? (
<div className="absolute right-0 top-[calc(100%+var(--spacing-measures-spacing-200,8px))] z-[300]">
<div className="absolute right-0 top-[calc(100%+var(--space-200))] z-[300]">
<Popover id={actionsMenuId} menuAriaLabel={actionsMenuAriaLabel}>
{actionMenuItems.map((item, index) => (
<ListItem