Skip to content

[FEATURE]: Show max 3 templates and clean up card stack buttons on landing page #168

Description

@Gautam25Raj

Affected Apps / Packages

Portfolio (apps/portfolio)

Metadata

  • Suggested Branch: feat/portfolio-landing-template-stack
  • Suggested PR Title: [Feature] [Portfolio]: Limit templates list and redesign stacked layout

Is your feature request related to a problem?

Yes. The "Live template links" section on the landing page imports the entire template list. As the registry grows to 20+ templates, this list will become too long.

Also, the action buttons at the bottom of the card stack look messy when cards are stacked on top of each other because the cards use bg-transparent.

Describe the solution you'd like

  1. Show only three templates (Cipher, Atelier, and Nimbus) in the landing page preview section.
  2. Define a separate constant for these three templates in the landing page component instead of importing templates from the global library.
  3. Add a solid background color (bg-accent) to the stacked article elements in TemplateLinksSection.tsx so that when a card is sticky-stacked, it completely hides the buttons of the card behind it.

Describe alternatives you've considered

Hiding buttons dynamically with JavaScript scroll listeners, but a CSS background mask is simpler and performs better.

Additional Context

No response

Metadata

Metadata

Assignees

Labels

enhancementNew feature or requestfrontendUI/client-side codeperformancePerformance improvements

Fields

No fields configured for Feature.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions