OpenLake/OpenLake--Website

[SPRINT-M25] fix:Improve Card Layout and Responsiveness

Open

#39 ouverte le 25 oct. 2025

Voir sur GitHub
 (0 commentaires) (0 réactions) (0 assignés)JavaScript (12 forks)auto 404
enhancementgood first issue

Métriques du dépôt

Stars
 (2 stars)
Métriques de merge PR
 (Métriques PR en attente)

Description

The current card design lacks responsiveness and has text overflow and spacing issues, especially on smaller screens. This issue aims to refine the card layout, spacing, and typography for a more consistent and readable UI.

  • Tasks:
  1. Adjust card width and height for better scaling.
  2. Add proper spacing (margin-bottom, alignment fixes).
  3. Improve responsiveness with new media queries.
  4. Fix text wrapping and overflow in titles and tech sections.
  5. Maintain smooth flip animation and clean visuals
  • Expected Result : Cards should resize smoothly, align evenly, and display text clearly on all devices.
  • Labels used : enhancement

Guide contributeur

Direction de recherche
Inspectez le CSS et la structure HTML du composant de carte actuel. Identifiez les styles responsables du débordement et d'un mauvais espacement. Ajoutez des requêtes média pour les petits écrans et assurez vous que le retour à la ligne du texte est correctement géré. Testez sur plusieurs tailles de fenêtre.
Stack technique
javascriptcss
Domaine
frontend
Type d'issue
Fonctionnalité
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
2
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
1-3 heures
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
Récente
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
Claire
Prérequis
CSSGit
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
80