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
- Show only three templates (Cipher, Atelier, and Nimbus) in the landing page preview section.
- Define a separate constant for these three templates in the landing page component instead of importing
templates from the global library.
- 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
Affected Apps / Packages
Portfolio (apps/portfolio)
Metadata
feat/portfolio-landing-template-stack[Feature] [Portfolio]: Limit templates list and redesign stacked layoutIs 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
templatesfrom the global library.bg-accent) to the stackedarticleelements inTemplateLinksSection.tsxso 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