Add a better looking frame for mobile and web previews

Repository-Metriken

Stars

72.582 Stars (72.582 Stars)

PR-Merge-Metriken

Durchschn. Merge 1h 33m (Durchschn. Merge 1h 33m)5 gemergte PRs in 30 T (5 gemergte PRs in 30 T)

Beschreibung

Contributor Guide

Research-Richtung

Pruefe die aktuelle Vorschau Komponente im Code (wahrscheinlich in src/components/Preview.tsx oder ähnlich), um zu verstehen, wie die mobilen und Web Vorschauen gerendert werden. Suche nach vorhandenen CSS Stilen oder Rahmen Wrappern. Schlage vor, einen gestalteten Container mit einem simulierten Geräterahmen für Mobilgeräte mittels CSS border radius und Schatten sowie einen Web Fensterrahmen mit einer Kopfzeile hinzuzufügen. Prüfe, ob es ein vorhandenes Designsystem oder Thema gibt, dem man folgen kann.

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

HTMLCSSReact

EinsteigerfreundlichkeitEin Score von 1 bis 100, der schätzt, wie zugänglich dieses Issue für First-Time Contributors ist.

70