Crypto-Jaguars/Revo-Marketplace

Implement Marketplace Hero

Offen

#125 geöffnet am 26.09.2025

Auf GitHub ansehen
 (5 Kommentare) (0 Reaktionen) (1 zugewiesene Person)TypeScript (71 Forks)auto 404
Frontendeasygood first issueonlydust-wave

Repository-Metriken

Stars
 (5 Sterne)
PR-Merge-Metriken
 (Keine gemergten PRs in 30 T)

Beschreibung

Task Description Create marketplace hero section with title, description, and main search bar.

Deliverable Hero with "Agricultural Marketplace" title, motivational description, and main search.

Requirements

  • Large bilingual title
  • Description "Fresh products, directly from farm to table"
  • Centered main search bar
  • Green gradient background with translucent overlay

Technical Requirements

  • Titles with font-black and large sizes
  • Centered search input with icons
  • Radial green gradient background
  • Translucent background image

Content Updates Required

  • Texts according to translations object
  • Placeholder: "Search by product, producer or location"
  • Background: /images/farm-background.png with opacity 0.5
  • Overlaid green gradient

Additional Notes

  • Clear visual hierarchy
  • Search as prominent element
  • Background visible but not intrusive

Definition of Done

  • Title and description visible
  • Main search functional
  • Translucent background displays correctly
  • Bilingual texts update
  • Responsive on mobile and desktop

Image:

Contributor Guide

Research-Richtung
Erkunde zunächst die Komponentenstruktur und das Routing des Projekts, um zu verstehen, wo der Hero Bereich hinzugefügt werden soll. Sieh dir vorhandene Komponenten an, um Muster zu erkennen (z.B. wie Tailwind Klassen verwendet werden). Erstelle dann eine neue Hero Komponente mit dem angegebenen Farbverlaufshintergrund und der Suchleiste. Verwende das Translations Objekt für zweisprachigen Text. Stelle ein responsives Design mit Tailwinds Breakpoints sicher.
Tech Stack
typescriptreacttailwindcss
Domain
frontend
Issue Type
Funktion
SchwierigkeitGeschätzte Implementierungsschwierigkeit für neue Contributors, von 1 für sehr kleine Änderungen bis 5 für Expertenarbeit.
2
Geschätzte ZeitEin grober Zeitrahmen, um zu recherchieren, zu implementieren, zu testen und einen Pull Request vorzubereiten.
Halber Tag
AktivitätsstatusWie verfügbar das Issue gerade wirkt: frisch, aktiv, stale, blockiert oder wartet auf Maintainer-Input.
Aktiv
KlarheitWie klar das Issue die erwartete Änderung, Akzeptanzkriterien und den nächsten Schritt erklärt.
Klar
Voraussetzungen
GitTypeScriptReactTailwind CSS
EinsteigerfreundlichkeitEin Score von 1 bis 100, der schätzt, wie zugänglich dieses Issue für First-Time Contributors ist.
75