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/sections/QuoteBlock/QuoteBlock.container.tsx
+13 -13
View File
@@ -26,10 +26,10 @@ const QuoteBlockContainer = memo<QuoteBlockProps>(
const variants: Record<string, VariantConfig> = {
compact: {
container:
"py-[var(--spacing-scale-032)] px-[var(--spacing-scale-016)]",
card: "py-[var(--spacing-scale-032)] px-[var(--spacing-scale-016)] md:py-[var(--spacing-scale-040)] md:px-[var(--spacing-scale-024)] rounded-[var(--radius-measures-radius-small)]",
gap: "gap-[var(--spacing-scale-016)] md:gap-[var(--spacing-scale-024)]",
avatarGap: "gap-[var(--spacing-scale-012)]",
"py-[var(--space-800)] px-[var(--space-400)]",
card: "py-[var(--space-800)] px-[var(--space-400)] md:py-[var(--space-1000)] md:px-[var(--space-600)] rounded-[var(--radius-300)]",
gap: "gap-[var(--space-400)] md:gap-[var(--space-600)]",
avatarGap: "gap-[var(--space-300)]",
avatar: "w-[48px] h-[48px] md:w-[64px] md:h-[64px]",
quote: "text-[16px] leading-[120%] md:text-[20px] md:leading-[110%]",
author: "text-[10px] leading-[120%] md:text-[12px]",
@@ -38,11 +38,11 @@ const QuoteBlockContainer = memo<QuoteBlockProps>(
},
standard: {
container:
"md:py-[var(--spacing-scale-032)] md:px-[var(--spacing-scale-016)] lg:p-[var(--spacing-scale-064)]",
card: "py-[var(--spacing-scale-064)] px-[var(--spacing-scale-020)] md:py-[var(--spacing-scale-064)] md:px-[var(--spacing-scale-048)] md:rounded-[var(--radius-measures-radius-medium)] lg:py-[var(--spacing-scale-064)] lg:pl-[120px] lg:pr-[320px]",
gap: "gap-[var(--spacing-scale-024)] md:gap-[var(--spacing-scale-048)] lg:gap-[var(--spacing-scale-064)] xl:gap-[105px]",
"md:py-[var(--space-800)] md:px-[var(--space-400)] lg:p-[var(--space-1800)]",
card: "py-[var(--space-1800)] px-[var(--space-500)] md:py-[var(--space-1800)] md:px-[var(--space-1200)] md:rounded-[var(--radius-400)] lg:py-[var(--space-1800)] lg:pl-[120px] lg:pr-[320px]",
gap: "gap-[var(--space-600)] md:gap-[var(--space-1200)] lg:gap-[var(--space-1800)] xl:gap-[105px]",
avatarGap:
"gap-[var(--spacing-scale-020)] lg:gap-[var(--spacing-scale-018)] xl:gap-[var(--spacing-scale-032)]",
"gap-[var(--space-500)] lg:gap-[var(--sizing-450)] xl:gap-[var(--space-800)]",
avatar:
"md:w-[120px] md:h-[120px] lg:w-[150px] lg:h-[150px] xl:w-[200px] xl:h-[200px]",
quote:
@@ -55,11 +55,11 @@ const QuoteBlockContainer = memo<QuoteBlockProps>(
},
extended: {
container:
"py-[var(--spacing-scale-048)] px-[var(--spacing-scale-024)] md:py-[var(--spacing-scale-064)] md:px-[var(--spacing-scale-032)] lg:py-[var(--spacing-scale-080)] lg:px-[var(--spacing-scale-048)]",
card: "py-[var(--spacing-scale-080)] px-[var(--spacing-scale-032)] md:py-[var(--spacing-scale-096)] md:px-[var(--spacing-scale-064)] md:rounded-[var(--radius-measures-radius-large)] lg:py-[var(--spacing-scale-112)] lg:pl-[160px] lg:pr-[400px]",
gap: "gap-[var(--spacing-scale-032)] md:gap-[var(--spacing-scale-064)] lg:gap-[var(--spacing-scale-080)] xl:gap-[140px]",
"py-[var(--space-1200)] px-[var(--space-600)] md:py-[var(--space-1800)] md:px-[var(--space-800)] lg:py-[var(--spacing-scale-080)] lg:px-[var(--space-1200)]",
card: "py-[var(--spacing-scale-080)] px-[var(--space-800)] md:py-[var(--space-2400)] md:px-[var(--space-1800)] md:rounded-[var(--radius-500)] lg:py-[var(--spacing-scale-112)] lg:pl-[160px] lg:pr-[400px]",
gap: "gap-[var(--space-800)] md:gap-[var(--space-1800)] lg:gap-[var(--spacing-scale-080)] xl:gap-[140px]",
avatarGap:
"gap-[var(--spacing-scale-032)] lg:gap-[var(--spacing-scale-040)] xl:gap-[var(--spacing-scale-048)]",
"gap-[var(--space-800)] lg:gap-[var(--space-1000)] xl:gap-[var(--space-1200)]",
avatar:
"w-[80px] h-[80px] md:w-[140px] md:h-[140px] lg:w-[180px] lg:h-[180px] xl:w-[240px] xl:h-[240px]",
quote:
@@ -72,7 +72,7 @@ const QuoteBlockContainer = memo<QuoteBlockProps>(
},
statement: {
container:
"flex w-full flex-col items-center px-[var(--spacing-scale-032)] py-[var(--spacing-scale-048)] md:px-[var(--spacing-scale-096)] md:py-[var(--space-1200)]",
"flex w-full flex-col items-center px-[var(--space-800)] py-[var(--space-1200)] md:px-[var(--space-2400)] md:py-[var(--space-1200)]",
card: "",
gap: "",
avatarGap: "",