feat: add CardSplit component

[BIA3IA]

Introduce the CardSplit component to improve layout flexibility and refactor it to utilize a new props structure, separating primary and secondary content for better organization.

Closes #62

[coderabbitai]

Walkthrough

A new CardSplit component and its supporting sub-components are introduced in the card-split directory. The component provides a responsive, two-column layout for displaying primary and secondary content with Glass styling. The home page is updated to render this component with specific text values.

Changes

Cohort / File(s)	Summary
CardSplit Component src/components/card-split/index.tsx, src/components/card-split/primary-content.tsx, src/components/card-split/secondary-content.tsx, src/components/card-split/types.ts	New CardSplit component with responsive layout (column on mobile, two-column grid on sm+). Main component conditionally renders CardSplitPrimaryContent and CardSplitSecondaryContent sub-components based on provided text props. TypeScript types define optional string fields for primary, secondary, and small secondary text.
Home Page Integration src/app/page.tsx	Added CardSplit import and renders new centered section below Hero component with textPrimary="5x1000", textSecondary="Sostienici!", and textSecondarySmall="CF: 97927490157".

Possibly related PRs

• feat: add CardIcon component #50: Modifies the same Home component in src/app/page.tsx, introducing potential conflicts or overlap in home page layout changes.

🚥 Pre-merge checks | ✅ 3 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'feat: add CardSplit component' clearly and concisely summarizes the main change - introducing a new CardSplit component.
Linked Issues check	✅ Passed	The PR implements the CardSplit component from issue #62 with primary and secondary content separation as intended for the split-card layout.
Out of Scope Changes check	✅ Passed	All changes are directly related to implementing the CardSplit component and its integration into the page - no out-of-scope modifications detected.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

🧹 Nitpick comments (2)

src/components/card-split/primary-content.tsx (1)

3-3: Avoid conflicting font-weight utilities.

Line 3 applies typo-display-medium and font-normal together; this overrides part of the typography token. Keep one source of truth for weight to preserve consistent design tokens.

♻️ Proposed cleanup

-    <p className="typo-display-medium bg-linear-to-b from-blue-secondary to-blue-primary bg-clip-text font-normal text-transparent">
+    <p className="typo-display-medium bg-linear-to-b from-blue-secondary to-blue-primary bg-clip-text text-transparent">

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@src/components/card-split/primary-content.tsx` at line 3, The class string on
the element in primary-content.tsx mixes the typography token
"typo-display-medium" with a conflicting utility "font-normal"; remove the
explicit "font-normal" from the className on that element (or, if an override is
intentionally required, update the typography token instead) so the component
uses a single source of truth for font-weight and preserves the design token's
intended weight.

src/components/card-split/types.ts (1)

1-6: Consider enforcing at least one content prop via union types.

The component currently allows <CardSplit /> to compile with no content props, which permits confusing API usage. While the implementation handles empty renders safely (lines 8–27 in index.tsx check and conditionally render each prop), the type signature does not prevent this at compile time.

♻️ Suggested type tightening

-export type CardSplitProps = {
-  textPrimary?: string
-  textSecondary?: string
-  textSecondarySmall?: string
-  className?: string
-}
+type CardSplitBaseProps = {
+  className?: string
+}
+
+type CardSplitPrimaryRequired = {
+  textPrimary: string
+  textSecondary?: string
+  textSecondarySmall?: string
+}
+
+type CardSplitSecondaryRequired = {
+  textPrimary?: string
+  textSecondary: string
+  textSecondarySmall?: string
+}
+
+type CardSplitSecondarySmallRequired = {
+  textPrimary?: string
+  textSecondary?: string
+  textSecondarySmall: string
+}
+
+export type CardSplitProps = CardSplitBaseProps &
+  (CardSplitPrimaryRequired | CardSplitSecondaryRequired | CardSplitSecondarySmallRequired)

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@src/components/card-split/types.ts` around lines 1 - 6, The CardSplitProps
type currently allows all content fields to be omitted; change it so at least
one of textPrimary, textSecondary, or textSecondarySmall is required. Replace
the loose type with a tightened union or use a small utility (e.g.,
RequireAtLeastOne<CardSplitProps, 'textPrimary' | 'textSecondary' |
'textSecondarySmall'>) and keep className optional; update any imports/usages
accordingly so CardSplitProps enforces presence of at least one of the three
content props in the component that consumes it (CardSplitProps, textPrimary,
textSecondary, textSecondarySmall).

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@src/components/card-split/primary-content.tsx`:
- Line 3: The class string on the element in primary-content.tsx mixes the
typography token "typo-display-medium" with a conflicting utility "font-normal";
remove the explicit "font-normal" from the className on that element (or, if an
override is intentionally required, update the typography token instead) so the
component uses a single source of truth for font-weight and preserves the design
token's intended weight.

In `@src/components/card-split/types.ts`:
- Around line 1-6: The CardSplitProps type currently allows all content fields
to be omitted; change it so at least one of textPrimary, textSecondary, or
textSecondarySmall is required. Replace the loose type with a tightened union or
use a small utility (e.g., RequireAtLeastOne<CardSplitProps, 'textPrimary' |
'textSecondary' | 'textSecondarySmall'>) and keep className optional; update any
imports/usages accordingly so CardSplitProps enforces presence of at least one
of the three content props in the component that consumes it (CardSplitProps,
textPrimary, textSecondary, textSecondarySmall).

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: f3095075-d5f0-4564-8608-d040c53b4bd4

📥 Commits

Reviewing files that changed from the base of the PR and between ade80e3 and c7620c0.

📒 Files selected for processing (5)

• src/app/page.tsx
• src/components/card-split/index.tsx
• src/components/card-split/primary-content.tsx
• src/components/card-split/secondary-content.tsx
• src/components/card-split/types.ts