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

Match the marketing homepage and About page to the latest Figma: black hero CTA, spaces in word-split headings, redesigned feature grid, and cited About statistics.

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
adilallo
2026-09-09 17:40:11 -06:00
co-authored by Cursor
parent 2d351987cf
commit 40225e2845
32 changed files with 362 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/sections/FeatureGrid/FeatureGrid.container.tsx
+23 -35
View File
@@ -1,11 +1,11 @@
"use client";
/**
* Figma: "Section / Feature-Grid" (18847:22410)
* Figma: "Section / Feature-Grid" (18632:10668)
*/
import { memo, useMemo } from "react";
import { getAssetPath, featurePanelLayout, featurePanelPath } from "../../../../lib/assetUtils";
import { featureIconPath, getAssetPath } from "../../../../lib/assetUtils";
import { useTranslation } from "../../../contexts/MessagesContext";
import FeatureGridView from "./FeatureGrid.view";
import type { FeatureGridProps, Feature } from "./FeatureGrid.types";
@@ -17,52 +17,40 @@ const FeatureGridContainer = memo<FeatureGridProps>(
const features: Feature[] = useMemo(
() => [
{
backgroundColor: "bg-[var(--color-surface-invert-brand-royal)]",
labelLine1: t(
"pages.home.featureGrid.features.decisionMaking.labelLine1",
backgroundColor: "bg-[var(--color-surface-invert-brand-lavender)]",
title: t("pages.home.featureGrid.features.decisionMaking.title"),
description: t(
"pages.home.featureGrid.features.decisionMaking.description",
),
labelLine2: t(
"pages.home.featureGrid.features.decisionMaking.labelLine2",
),
panelContent: getAssetPath(featurePanelPath("support")),
...featurePanelLayout("support"),
ariaLabel: t("featureGrid.features.decisionMaking.ariaLabel"),
descriptionClassName: "text-[#3a3273]",
iconSrc: getAssetPath(featureIconPath("git-branch")),
},
{
backgroundColor: "bg-[var(--color-surface-invert-brand-lime)]",
labelLine1: t(
"pages.home.featureGrid.features.valuesAlignment.labelLine1",
title: t("pages.home.featureGrid.features.valuesAlignment.title"),
description: t(
"pages.home.featureGrid.features.valuesAlignment.description",
),
labelLine2: t(
"pages.home.featureGrid.features.valuesAlignment.labelLine2",
),
panelContent: getAssetPath(featurePanelPath("exercises")),
...featurePanelLayout("exercises"),
ariaLabel: t("featureGrid.features.valuesAlignment.ariaLabel"),
descriptionClassName: "text-[#424f1a]",
iconSrc: getAssetPath(featureIconPath("arrow-left-right")),
},
{
backgroundColor: "bg-[var(--color-surface-invert-brand-rust)]",
labelLine1: t(
"pages.home.featureGrid.features.membershipGuidance.labelLine1",
title: t("pages.home.featureGrid.features.membershipGuidance.title"),
description: t(
"pages.home.featureGrid.features.membershipGuidance.description",
),
labelLine2: t(
"pages.home.featureGrid.features.membershipGuidance.labelLine2",
),
panelContent: getAssetPath(featurePanelPath("guidance")),
...featurePanelLayout("guidance"),
ariaLabel: t("featureGrid.features.membershipGuidance.ariaLabel"),
descriptionClassName: "text-[#5e2e23]",
iconSrc: getAssetPath(featureIconPath("door-open")),
},
{
backgroundColor: "bg-[var(--color-surface-invert-brand-teal)]",
labelLine1: t(
"pages.home.featureGrid.features.conflictResolution.labelLine1",
title: t("pages.home.featureGrid.features.conflictResolution.title"),
description: t(
"pages.home.featureGrid.features.conflictResolution.description",
),
labelLine2: t(
"pages.home.featureGrid.features.conflictResolution.labelLine2",
),
panelContent: getAssetPath(featurePanelPath("tools")),
...featurePanelLayout("tools"),
ariaLabel: t("featureGrid.features.conflictResolution.ariaLabel"),
descriptionClassName: "text-[#1f4d47]",
iconSrc: getAssetPath(featureIconPath("message-square-share")),
},
],
[t],