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

stories/buttons/Button.stories.js
+14 -14
View File
@@ -78,10 +78,10 @@ export const Variants = {
<Button {..._args} buttonType="ghost" palette="inverse">
Ghost Inverse
</Button>
<Button {..._args} buttonType="danger" palette="default">
<Button {..._args} danger buttonType="outline" palette="default">
Danger
</Button>
<Button {..._args} buttonType="danger" palette="inverse">
<Button {..._args} danger buttonType="outline" palette="inverse">
Danger Inverse
</Button>
</div>
@@ -295,19 +295,19 @@ export const AllVariants = {
<div>
<h3 className="text-white font-semibold mb-3">Danger Variant</h3>
<div className="space-x-4">
<Button buttonType="danger" palette="default" size="xsmall">
<Button danger buttonType="outline" palette="default" size="xsmall">
XSmall
</Button>
<Button buttonType="danger" palette="default" size="small">
<Button danger buttonType="outline" palette="default" size="small">
Small
</Button>
<Button buttonType="danger" palette="default" size="medium">
<Button danger buttonType="outline" palette="default" size="medium">
Medium
</Button>
<Button buttonType="danger" palette="default" size="large">
<Button danger buttonType="outline" palette="default" size="large">
Large
</Button>
<Button buttonType="danger" palette="default" size="xlarge">
<Button danger buttonType="outline" palette="default" size="xlarge">
XLarge
</Button>
</div>
@@ -318,19 +318,19 @@ export const AllVariants = {
Danger Inverse Variant
</h3>
<div className="space-x-4">
<Button buttonType="danger" palette="inverse" size="xsmall">
<Button danger buttonType="outline" palette="inverse" size="xsmall">
XSmall
</Button>
<Button buttonType="danger" palette="inverse" size="small">
<Button danger buttonType="outline" palette="inverse" size="small">
Small
</Button>
<Button buttonType="danger" palette="inverse" size="medium">
<Button danger buttonType="outline" palette="inverse" size="medium">
Medium
</Button>
<Button buttonType="danger" palette="inverse" size="large">
<Button danger buttonType="outline" palette="inverse" size="large">
Large
</Button>
<Button buttonType="danger" palette="inverse" size="xlarge">
<Button danger buttonType="outline" palette="inverse" size="xlarge">
XLarge
</Button>
</div>
@@ -357,10 +357,10 @@ export const AllVariants = {
<Button buttonType="ghost" palette="inverse" size="large" disabled>
Ghost Inverse Disabled
</Button>
<Button buttonType="danger" palette="default" size="large" disabled>
<Button danger buttonType="outline" palette="default" size="large" disabled>
Danger Disabled
</Button>
<Button buttonType="danger" palette="inverse" size="large" disabled>
<Button danger buttonType="outline" palette="inverse" size="large" disabled>
Danger Inverse Disabled
</Button>
</div>
stories/buttons/Button.visual.stories.js
+1 -1
View File
@@ -24,7 +24,7 @@ export default {
},
buttonType: {
control: { type: "select" },
options: ["filled", "outline", "ghost", "danger"],
options: ["filled", "outline", "ghost"],
},
palette: {
control: { type: "select" },
stories/modals/Login.stories.tsx
+4 -4
View File
@@ -46,7 +46,7 @@ function FakeMarketingPageBehindOverlay({
return (
<div className="relative min-h-[100dvh] overflow-hidden">
<div
className="absolute inset-0 bg-[var(--color-surface-inverse-brand-primary)]"
className="absolute inset-0 bg-[var(--color-surface-invert-brand-primary)]"
aria-hidden
/>
<div className="relative z-0 px-8 py-16">
@@ -132,7 +132,7 @@ export const FullPageRouteSolid = {
},
decorators: [
(Story: () => React.ReactNode) => (
<div className="min-h-[100dvh] bg-[var(--color-surface-inverse-brand-primary)]">
<div className="min-h-[100dvh] bg-[var(--color-surface-invert-brand-primary)]">
<Story />
</div>
),
@@ -163,7 +163,7 @@ export const FullPageRouteSolid = {
export const ModalChromeOnly = {
name: "Modal chrome only (placeholder)",
render: () => (
<div className="min-h-[100dvh] bg-[var(--color-surface-inverse-brand-primary)]">
<div className="min-h-[100dvh] bg-[var(--color-surface-invert-brand-primary)]">
<Login
isOpen
onClose={() => {}}
@@ -203,7 +203,7 @@ export const FormOnly = {
},
decorators: [
(Story: () => React.ReactNode) => (
<div className="min-h-[200px] bg-[var(--color-surface-inverse-brand-primary)] p-8">
<div className="min-h-[200px] bg-[var(--color-surface-invert-brand-primary)] p-8">
<Story />
</div>
),
stories/modals/Share.stories.js
+1 -1
View File
@@ -19,7 +19,7 @@ export default {
function ShareStoryHost() {
const [open, setOpen] = useState(true);
return (
<div className="min-h-[100dvh] bg-[var(--color-surface-inverse-brand-primary)] p-6">
<div className="min-h-[100dvh] bg-[var(--color-surface-invert-brand-primary)] p-6">
<button
type="button"
className="rounded-md bg-[var(--color-surface-default-primary)] px-4 py-2 text-small-paragraph text-[var(--color-content-default-primary)]"