From 4fca25f51abec49ddef4c745b618be7074c753a7 Mon Sep 17 00:00:00 2001 From: Waleed Latif Date: Thu, 9 Jul 2026 08:37:16 -0700 Subject: [PATCH 1/6] feat(landing): add enterprise link to navbar and footer --- apps/sim/app/(landing)/components/footer/footer.tsx | 1 + .../components/navbar/components/mobile-nav/mobile-nav.tsx | 5 ++++- apps/sim/app/(landing)/components/navbar/navbar.tsx | 3 +++ 3 files changed, 8 insertions(+), 1 deletion(-) diff --git a/apps/sim/app/(landing)/components/footer/footer.tsx b/apps/sim/app/(landing)/components/footer/footer.tsx index 0607613b4e1..b0849740fba 100644 --- a/apps/sim/app/(landing)/components/footer/footer.tsx +++ b/apps/sim/app/(landing)/components/footer/footer.tsx @@ -27,6 +27,7 @@ interface FooterItem { } const PRODUCT_LINKS: FooterItem[] = [ + { label: 'Enterprise', href: '/enterprise' }, { label: 'Mothership', href: 'https://docs.sim.ai/mothership', external: true }, { label: 'Workflows', href: 'https://docs.sim.ai', external: true }, { label: 'Knowledge Base', href: 'https://docs.sim.ai/knowledgebase', external: true }, diff --git a/apps/sim/app/(landing)/components/navbar/components/mobile-nav/mobile-nav.tsx b/apps/sim/app/(landing)/components/navbar/components/mobile-nav/mobile-nav.tsx index 96e5a74d7ca..f4d08956ef7 100644 --- a/apps/sim/app/(landing)/components/navbar/components/mobile-nav/mobile-nav.tsx +++ b/apps/sim/app/(landing)/components/navbar/components/mobile-nav/mobile-nav.tsx @@ -38,7 +38,10 @@ interface MobileNavProps { * {@link NAV_MENUS} automatically expands them here as grouped sections too - the * sheet mirrors the desktop nav's information architecture with no extra edit. */ -const STANDALONE_LINKS = [{ label: 'Pricing', href: '/pricing' }] as const +const STANDALONE_LINKS = [ + { label: 'Enterprise', href: '/enterprise' }, + { label: 'Pricing', href: '/pricing' }, +] as const /** Shared row chrome for every tappable text link in the sheet. */ const SHEET_ROW = diff --git a/apps/sim/app/(landing)/components/navbar/navbar.tsx b/apps/sim/app/(landing)/components/navbar/navbar.tsx index e0fcbc8f9c9..5799d9780ea 100644 --- a/apps/sim/app/(landing)/components/navbar/navbar.tsx +++ b/apps/sim/app/(landing)/components/navbar/navbar.tsx @@ -74,6 +74,9 @@ export function Navbar({ stars, logoOnly = false }: NavbarProps) { {NAV_MENUS.map((menu) => ( ))} + From 1ffe926fc841e33846e2505d117b7edb9d5fc9b6 Mon Sep 17 00:00:00 2001 From: andresdjasso Date: Fri, 10 Jul 2026 17:29:35 -0400 Subject: [PATCH 2/6] feat(landing): redesign enterprise page with platform-loop hero and feature graphics - New enterprise hero with animated platform loop (sidebar + home stage) and hero background - Nine redesigned feature tiles under enterprise/components/feature-graphics with a shared monochrome design vocabulary, per-tile tones, and CSS-module animations - Shared hero-header component and landing-layout constants; hero/platform/solutions pages aligned to the same layout system Co-authored-by: Cursor --- .../components/hero-header/hero-header.tsx | 48 +++ .../hero/components/hero-header/index.ts | 1 + .../hero-workflow-stage.tsx | 59 ++- .../app/(landing)/components/hero/hero.tsx | 41 +- .../(landing)/components/landing-layout.ts | 19 + .../components/navbar-shell/navbar-shell.tsx | 26 +- .../platform-hero/platform-hero.tsx | 5 +- .../solutions-card/solutions-card.tsx | 91 ++++- .../solutions-card-row/solutions-card-row.tsx | 59 ++- .../solutions-hero/solutions-hero.tsx | 93 ++++- .../components/solutions-page/constants.ts | 73 +++- .../components/solutions-page/types.ts | 18 +- .../enterprise-home-stage.tsx | 292 ++++++++++++++ .../enterprise-platform-loop.tsx | 169 ++++++++ .../enterprise-sidebar.tsx | 147 +++++++ .../enterprise-platform-loop/index.ts | 3 + .../enterprise-platform-loop/stage-data.ts | 180 +++++++++ .../access-control-graphic.module.css | 136 +++++++ .../access-control-graphic.tsx | 195 +++++++++ .../audit-trail-graphic.module.css | 47 +++ .../feature-graphics/audit-trail-graphic.tsx | 165 ++++++++ .../build-methods-graphic.tsx | 337 ++++++++++++++++ .../deploy-graphic.module.css | 141 +++++++ .../feature-graphics/deploy-graphic.tsx | 144 +++++++ .../feature-graphics/feature-graphic-node.tsx | 114 ++++++ .../feature-graphic-shell.tsx | 14 + .../feature-platform-panel.tsx | 41 ++ .../components/feature-graphics/index.ts | 15 + .../it-platform-teams-graphic.module.css | 32 ++ .../it-platform-teams-graphic.tsx | 120 ++++++ .../lifecycle-graphic.module.css | 30 ++ .../feature-graphics/lifecycle-graphic.tsx | 115 ++++++ .../operations-teams-graphic.module.css | 380 ++++++++++++++++++ .../operations-teams-graphic.tsx | 296 ++++++++++++++ .../feature-graphics/rollback-graphic.tsx | 123 ++++++ .../run-monitoring-graphic.module.css | 30 ++ .../run-monitoring-graphic.tsx | 128 ++++++ .../staging-graphic.module.css | 30 ++ .../feature-graphics/staging-graphic.tsx | 123 ++++++ .../standards-graphic.module.css | 106 +++++ .../feature-graphics/standards-graphic.tsx | 161 ++++++++ .../technical-teams-graphic.module.css | 31 ++ .../technical-teams-graphic.tsx | 120 ++++++ .../app/(landing)/enterprise/enterprise.tsx | 185 +++++---- apps/sim/app/(landing)/landing.tsx | 4 +- .../landing/enterprise-hero-background.png | Bin 0 -> 8901315 bytes apps/sim/public/landing/team-avatar-1.png | Bin 0 -> 34327 bytes apps/sim/public/landing/team-avatar-2.png | Bin 0 -> 36507 bytes apps/sim/public/landing/team-avatar-3.png | Bin 0 -> 31735 bytes 49 files changed, 4509 insertions(+), 178 deletions(-) create mode 100644 apps/sim/app/(landing)/components/hero/components/hero-header/hero-header.tsx create mode 100644 apps/sim/app/(landing)/components/hero/components/hero-header/index.ts create mode 100644 apps/sim/app/(landing)/components/landing-layout.ts create mode 100644 apps/sim/app/(landing)/enterprise/components/enterprise-platform-loop/enterprise-home-stage.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/enterprise-platform-loop/enterprise-platform-loop.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/enterprise-platform-loop/enterprise-sidebar.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/enterprise-platform-loop/index.ts create mode 100644 apps/sim/app/(landing)/enterprise/components/enterprise-platform-loop/stage-data.ts create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/access-control-graphic.module.css create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/access-control-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/audit-trail-graphic.module.css create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/audit-trail-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/build-methods-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/deploy-graphic.module.css create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/deploy-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/feature-graphic-node.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/feature-graphic-shell.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/feature-platform-panel.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/index.ts create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/it-platform-teams-graphic.module.css create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/it-platform-teams-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/lifecycle-graphic.module.css create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/lifecycle-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/operations-teams-graphic.module.css create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/operations-teams-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/rollback-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/run-monitoring-graphic.module.css create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/run-monitoring-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/staging-graphic.module.css create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/staging-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/standards-graphic.module.css create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/standards-graphic.tsx create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/technical-teams-graphic.module.css create mode 100644 apps/sim/app/(landing)/enterprise/components/feature-graphics/technical-teams-graphic.tsx create mode 100644 apps/sim/public/landing/enterprise-hero-background.png create mode 100644 apps/sim/public/landing/team-avatar-1.png create mode 100644 apps/sim/public/landing/team-avatar-2.png create mode 100644 apps/sim/public/landing/team-avatar-3.png diff --git a/apps/sim/app/(landing)/components/hero/components/hero-header/hero-header.tsx b/apps/sim/app/(landing)/components/hero/components/hero-header/hero-header.tsx new file mode 100644 index 00000000000..c2e9b566956 --- /dev/null +++ b/apps/sim/app/(landing)/components/hero/components/hero-header/hero-header.tsx @@ -0,0 +1,48 @@ +import type { ReactNode } from 'react' +import { cn } from '@sim/emcn' +import { HeroStat } from '@/app/(landing)/components/hero/components/hero-stat' +import { HeroCta } from '@/app/(landing)/components/hero-cta' +import { LANDING_HERO_CTA_GAP } from '@/app/(landing)/components/landing-layout' + +interface LandingHeroHeaderProps { + description: string + eyebrow?: ReactNode + heading: ReactNode + headingId: string +} + +/** + * Shared homepage hero header geometry. Marketing routes use this component so + * the headline measure, CTA stack, and right-side global-work stat cannot drift. + */ +export function LandingHeroHeader({ + description, + eyebrow, + heading, + headingId, +}: LandingHeroHeaderProps) { + return ( +
+
+ {eyebrow} + +

+ {heading} +

+ +

+ {description} +

+ +
+ +
+
+ + +
+ ) +} diff --git a/apps/sim/app/(landing)/components/hero/components/hero-header/index.ts b/apps/sim/app/(landing)/components/hero/components/hero-header/index.ts new file mode 100644 index 00000000000..8d84bd58bca --- /dev/null +++ b/apps/sim/app/(landing)/components/hero/components/hero-header/index.ts @@ -0,0 +1 @@ +export { LandingHeroHeader } from './hero-header' diff --git a/apps/sim/app/(landing)/components/hero/components/hero-platform-loop/hero-workflow-stage.tsx b/apps/sim/app/(landing)/components/hero/components/hero-platform-loop/hero-workflow-stage.tsx index 3265e49e389..20d1ffbb057 100644 --- a/apps/sim/app/(landing)/components/hero/components/hero-platform-loop/hero-workflow-stage.tsx +++ b/apps/sim/app/(landing)/components/hero/components/hero-platform-loop/hero-workflow-stage.tsx @@ -10,7 +10,10 @@ import { STAGE_EDGES, verticalSmoothStep, } from '@/app/(landing)/components/hero/components/hero-platform-loop/stage-data' -import { BLOCK_WIDTH } from '@/app/(landing)/components/hero/components/hero-visual/workflow-data' +import { + BLOCK_WIDTH, + type BlockDef, +} from '@/app/(landing)/components/hero/components/hero-visual/workflow-data' /** Upper bound on the canvas render scale (the scale at the full 1300px cap). */ const MAX_STAGE_SCALE = 0.71 @@ -18,12 +21,16 @@ const MAX_STAGE_SCALE = 0.71 const STAGE_MARGIN = 20 interface HeroWorkflowStageProps { - /** How many of {@link STAGE_BLOCKS} (in build order) are on canvas. */ + /** How many of the stage's blocks (in build order) are on canvas. */ builtCount: number + /** Blocks to stage, in build order. Defaults to the homepage's lead flow. */ + blocks?: BlockDef[] + /** Source → target pairs among {@link blocks}. Defaults with them. */ + edges?: ReadonlyArray + /** Design-space bounding box of the block layout. Defaults with them. */ + canvas?: { width: number; height: number } } -const STAGE_BLOCKS_BY_ID = new Map(STAGE_BLOCKS.map((b) => [b.id, b])) - /** * The hero window's live workflow canvas - the right-pane counterpart of the * chat loop. Blocks pop in one by one as `builtCount` advances (staggered @@ -38,10 +45,20 @@ const STAGE_BLOCKS_BY_ID = new Map(STAGE_BLOCKS.map((b) => [b.id, b])) * Blocks reuse the hero-visual's {@link WorkflowBlockContent} (the faithful * icon-tile + rows card body) in a card shell with vertical-flow handle nubs * (top in / bottom out), matching the real editor's vertical layout. + * + * The staged flow is injectable (`blocks`/`edges`/`canvas`), defaulting to the + * homepage's lead-enrichment flow - the enterprise loop stages its own flow + * through the same component. */ -export function HeroWorkflowStage({ builtCount }: HeroWorkflowStageProps) { +export function HeroWorkflowStage({ + builtCount, + blocks = STAGE_BLOCKS, + edges = STAGE_EDGES, + canvas = STAGE_CANVAS, +}: HeroWorkflowStageProps) { const containerRef = useRef(null) const [scale, setScale] = useState(MAX_STAGE_SCALE) + const blocksById = useMemo(() => new Map(blocks.map((b) => [b.id, b])), [blocks]) // Fit the design canvas to the card: scale down when the pane narrows so the // branch blocks never clip, capped at the full-width scale. Measures LAYOUT @@ -58,8 +75,8 @@ export function HeroWorkflowStage({ builtCount }: HeroWorkflowStageProps) { setScale( Math.min( MAX_STAGE_SCALE, - (w - STAGE_MARGIN) / STAGE_CANVAS.width, - (h - STAGE_MARGIN) / STAGE_CANVAS.height + (w - STAGE_MARGIN) / canvas.width, + (h - STAGE_MARGIN) / canvas.height ) ) } @@ -67,11 +84,11 @@ export function HeroWorkflowStage({ builtCount }: HeroWorkflowStageProps) { const ro = new ResizeObserver(measure) ro.observe(el) return () => ro.disconnect() - }, []) + }, [canvas.width, canvas.height]) const builtIds = useMemo( - () => new Set(STAGE_BLOCKS.slice(0, builtCount).map((b) => b.id)), - [builtCount] + () => new Set(blocks.slice(0, builtCount).map((b) => b.id)), + [blocks, builtCount] ) return ( @@ -82,30 +99,30 @@ export function HeroWorkflowStage({ builtCount }: HeroWorkflowStageProps) {
- {STAGE_BLOCKS.map((block) => { + {blocks.map((block) => { const built = builtIds.has(block.id) return (

Sim is the open-source AI workspace where teams build, deploy, and manage AI agents. Connect @@ -72,25 +82,16 @@ export function Hero() { production-ready for teams of every size.

-
-
-

+ Sim is your AI workspace
for building agentic workflows. -

- -

- The open-source workspace where teams build, deploy, and manage AI agents. -

- - -
- - -
+ + } + description='The open-source workspace where teams build, deploy, and manage AI agents.' + />