improvement: landing, sidebar, globals, buttons

[emir-karabeg]

Summary

UI improvement

Type of Change

• Bug fix
• New feature
• Breaking change
• Documentation
• Other: ___________

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[cursor]

PR Summary

Medium Risk
Broad UI refactor touching shared Button variants, many call sites, and theme tokens; risk is mainly visual regressions or inconsistent styling across pages rather than functional changes.

Overview
Updates landing and marketing CTAs to a new neutral/white button style, including changing the hero secondary CTA to Get a demo linking to /enterprise.

Reworks the hero “workspace preview” into a two-view experience: a new LandingPreviewHome initial view with a minimal chat input, plus a refreshed preview sidebar with Home navigation and expanded static workspace sections; prompt submission is centralized via new useLandingSubmit (stores the prompt then redirects to /signup).

Standardizes UI theming by updating the brand tertiary green to #33C482 across CSS tokens, emails, and DB defaults; revises global sidebar collapse behavior to temporarily disable pointer events during the collapse animation; and switches many in-app actions from Buttontertiary to primary with updated Button/ButtonGroup styling.

^{Written by Cursor Bugbot for commit dc98812. Configure here.}

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
docs	Skipped		Mar 23, 2026 11:47pm

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Bugbot Autofix prepared a fix for the issue found in the latest run.

• ✅ Fixed: Hero CTA links to non-existent /enterprise route
  • Reverted the hero CTA href from /enterprise to /login, restoring the working route that existed before the breaking change.

Or push these changes by commenting:

@cursor push 9f56602c98

Preview (9f56602c98)

diff --git a/apps/sim/app/(home)/components/hero/hero.tsx b/apps/sim/app/(home)/components/hero/hero.tsx--- a/apps/sim/app/(home)/components/hero/hero.tsx+++ b/apps/sim/app/(home)/components/hero/hero.tsx@@ -71,11 +71,11 @@
<div className='mt-[12px] flex items-center gap-[8px]'>
<Link
- href='/enterprise'+ href='/login'
className={`${CTA_BASE} border-[#3d3d3d] text-[#ECECEC] transition-colors hover:bg-[#2A2A2A]`}
- aria-label='Get a demo'+ aria-label='Log in'
>
- Get a demo+ Log in
</Link>
<Link
href='/signup'

_{This Bugbot Autofix run was free. To enable autofix for future PRs, go to the Cursor dashboard.}

[cursor]

Hero CTA links to non-existent /enterprise route

High Severity

The hero "Get a demo" button's href was changed from /login (a valid route) to /enterprise, which does not appear to have a corresponding page route. The Enterprise component in enterprise.tsx returns null (it's a stub), there is no enterprise/page.tsx in any route group, and no middleware or next.config rewrite handles this path. This prominent landing-page CTA will likely navigate users to a 404 page.

[greptile-apps]

Greptile Summary

This PR is a broad UI improvement pass touching 82 files across the landing page, workspace sidebar, modal components, button/button-group design tokens, and the database schema. The primary goals are: refreshing the landing page hero/CTA styling (white buttons replacing the green brand color on the public site), standardising primary and tertiary button variants to a dark/light contrast pair, tightening modal spacing, fixing sidebar dropdown overflow, and updating the --brand-tertiary-2 token (+ matching DB default + email color) to #33C482.

Key observations:

• The workspace.color schema default change now has a corresponding migration (0176_clear_luckman.sql), which resolves a previously noted drift concern.
• The primary and tertiary button CVA variants (and button-group active variant) continue to use hardcoded hex values (#1D1D1D, #2A2A2A, #E0E0E0, #2DAC72) instead of CSS custom properties, bypassing the theme token system.
• A tracking-[0.02em] wrapper <div> was added in workspace/layout.tsx to apply letter-spacing globally. Because letter-spacing is an inherited CSS property, this silently propagates to every descendant including code editors, inputs, and monospace elements that do not explicitly override it; a CSS-level declaration would be more appropriate.
• The sidebar collapse pointer-events guard (@keyframes sidebar-collapse-guard) and the .sidebar-container[data-collapsed] rule were added to globals.css instead of being scoped to the sidebar component.
• useLandingSubmit is exported from the component file landing-preview-panel.tsx and useAnimatedPlaceholder is imported from the workspace feature's private hook directory — both of which were flagged in a previous review cycle and remain unresolved.

Confidence Score: 3/5

• Mostly safe to merge — no functional regressions detected, but several style/architecture concerns are unresolved from a prior review cycle and a new global-typography side-effect was introduced.
• The DB migration is now correctly included. All changes are UI-only (spacing, colours, tracking) so runtime breakage is unlikely. However, the tracking-[0.02em] wrapper div introduces an unscoped global side-effect on inherited letter-spacing; the hardcoded hex colours in button variants remain unaddressed from the previous review; and the sidebar CSS additions to globals.css instead of a component file remain. These lower confidence from a clean pass.
• apps/sim/app/workspace/layout.tsx (global tracking side-effect), apps/sim/components/emcn/components/button/button.tsx and button-group/button-group.tsx (hardcoded hex colour tokens), apps/sim/app/_styles/globals.css (sidebar animation rules).

Important Files Changed

Filename	Overview
apps/sim/app/workspace/layout.tsx	Adds a tracking-[0.02em] wrapper div around all workspace children; letter-spacing is inherited so this silently applies to every descendant including code editors and inputs.
apps/sim/components/emcn/components/button/button.tsx	Rewrites primary and tertiary CVA variants using hardcoded hex values (#1D1D1D, #2A2A2A, #E0E0E0, #2DAC72) instead of CSS design tokens, bypassing the theme system.
apps/sim/components/emcn/components/button-group/button-group.tsx	Updates the active variant to use hardcoded hex colors rather than CSS variables, consistent pattern with button.tsx but still bypasses the token system.
apps/sim/app/_styles/globals.css	Adds @keyframes sidebar-collapse-guard animation and .sidebar-container[data-collapsed] rule, which should be scoped to the sidebar component file; also updates --brand-tertiary-2 token in both light and dark mode.
packages/db/migrations/0176_clear_luckman.sql	New migration correctly alters workspace.color default from #32bd7e to #33C482 to match the updated schema default.
packages/db/schema.ts	Updates workspace.color default value to #33C482; migration file 0176 is included, schema drift concern is addressed.
apps/sim/components/emcn/components/modal/modal.tsx	Minor spacing adjustments to ModalHeader (py-4 → pt-4 pb-2), ModalTabsList (pt-3 → pt-1), and ModalBody (adds pt-3); no logic changes.
apps/sim/app/workspace/[workspaceId]/w/components/sidebar/components/workspace-header/workspace-header.tsx	Restructures DropdownMenuContent to use flex layout with max-h-none overflow-hidden; moves "Create new workspace" button out of DropdownMenuGroup into a plain <div>, losing the role="group" accessibility semantic.
apps/sim/app/(home)/components/landing-preview/components/landing-preview-panel/landing-preview-panel.tsx	Exports useLandingSubmit hook from a component file rather than a dedicated hook file; this hook is then imported by landing-preview-home.tsx, creating a confusing dependency direction.
apps/sim/app/(home)/components/landing-preview/components/landing-preview-home/landing-preview-home.tsx	Imports useAnimatedPlaceholder from the workspace feature's private hooks directory and useLandingSubmit from a sibling component file; both coupling issues were previously noted.
apps/sim/components/emails/_styles/base.ts	Updates brandTertiary email color to #33C482 to stay in sync with the updated --brand-tertiary-2 design token.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
A[WorkspaceRootLayout\nworkspace/layout.tsx] -->|wraps all children with\ntracking-0.02em div| B[All Workspace Pages]
C[Button CVA\nbutton.tsx] -->|primary variant\nbg-#1D1D1D / dark:bg-white| D[~60 modal & sidebar consumers\nvariants changed tertiary → primary]
C -->|tertiary variant\nbg-brand-tertiary-2 / hover-#2DAC72| D
E[ButtonGroup CVA\nbutton-group.tsx] -->|active variant\nbg-#1D1D1D / dark:bg-white| F[ButtonGroup consumers]
G[globals.css] -->|--brand-tertiary-2: #33C482| H[Design Token Consumers]
G -->|sidebar-collapse-guard keyframe| I[.sidebar-container data-collapsed]
J[schema.ts\ncolor default #33C482] -->|matched by| K[Migration 0176\nALTER TABLE workspace\nSET DEFAULT #33C482]
J -->|matched by| L[emails/base.ts\nbrandTertiary #33C482]

Loading

_{Last reviewed commit: 01c3745}

[emir-karabeg]

@greptile

[greptile-apps]

Global letter-spacing via wrapper div

letter-spacing is an inherited CSS property, so adding tracking-[0.02em] to this wrapper div propagates to every descendant in the workspace — including monospace code editors, password inputs, inline code snippets, and any other element that relies on the browser's default tracking. Elements that don't explicitly set their own tracking-* class will silently inherit this value.

A more targeted and conventional approach is to declare this on the <body> (or a relevant root container) in globals.css:

body {
letter-spacing:0.02em;
}

…or, if it should only apply to the workspace, use a dedicated CSS class scoped to the workspace root layout rather than a generic wrapper <div>.

_{Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!}

[greptile-apps]

"Create workspace" button moved outside DropdownMenuGroup

DropdownMenuGroup from Radix UI renders a role="group" element, which is important for keyboard navigation and screen-reader announcement inside the dropdown. Moving the "Create new workspace" button into a plain <div> removes that grouping semantic for the button.

Consider keeping the button inside its own DropdownMenuGroup (or at minimum a DropdownMenuItem-wrapped element) to maintain consistent keyboard navigation behaviour and accessibility parity with the rest of the dropdown items:

<DropdownMenuGroupclassName='flex flex-col gap-[2px]'><button...>Create new workspace</button></DropdownMenuGroup>