Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Add the Gift Card e-commerce template (`ecommerce-gift-card`)

Chiusa Adatta ai principianti
#235 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

I maintainer di solito rispondono entro 1 giorno

@bhushan4work ci sta già lavorando.

Dal 24/10/2026.

  • #240 di @bhushan4work — integrata

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
85/100
Tipo di issue
Funzionalità
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
typescript
Ambito
frontend

Direzione di ricerca

Inizia con src/templates/ecommerce/coupon-code.ts per il layout promozionale in evidenza e con src/templates/product/glassmorphism.ts per un pannello della scheda in rilievo. Implementa il template in src/templates/ecommerce/gift-card.ts, poi riesportalo da src/templates/ecommerce/index.ts e registralo in src/templates/registry.ts. Controlla la leggibilità del testo indicato, i testi lunghi e i casi con nota vuota, quindi conferma che soddisfa la checklist condivisa in #5.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

good first issue hacktoberfest templates

Part of #5. For gift card promos around holidays and launches.

Idea
The headline sits on the left ("Give them the choice"), with an optional note under it ("Delivered instantly by email"). On the right is a card-shaped panel filled with the accent color: the store name at its top left, "Gift card" at its top right, and the amount large at its bottom left ("$50").

Template details

  • File: src/templates/ecommerce/gift-card.ts, id ecommerce-gift-card
  • Fields: commonFields.siteName (the store name), commonFields.title (the headline), amount (text, default "$50"), note (text, optional), commonFields.bgColor, commonFields.accentColor, commonFields.textColor

Where to look

  • Closest reference: src/templates/ecommerce/coupon-code.ts (a promo layout with a highlighted box), src/templates/product/glassmorphism.ts (a raised card panel)

Acceptance criteria

  • Text on the card stays readable on any accent color (contrastText()), and the headline stays readable on a light background
  • Long amounts and headlines shrink or truncate, and an empty note (or only spaces) hides cleanly
  • Re-exported in src/templates/ecommerce/index.ts and registered in the E-commerce block of src/templates/registry.ts
  • Meets the shared template checklist in #5

One template per contributor at a time, so more people get a chance.


Want to work on this? Comment below and I'll assign it to you. Please take one issue at a time, branch off dev, and open your PR against dev with Closes #235 in the description.

Lingua principale
TypeScript
Stelle
8
Fork
4
Merge medio
8h 19m
PR unite (30g)
129

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di codercops/ogcops

Tutte le issue di codercops/ogcops

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.