open-duelyst/duelyst

Game gifs - hero & map - does not render if the screen size is too small

Ouverte

#290 ouverte le 31 mai 2023

Voir sur GitHubGuide contributeur
 (0 commentaire) (0 réaction) (0 personne assignée)JavaScript (526 forks)batch import
bugfrontendhelp wanted

Métriques du dépôt

Stars
 (3 443 étoiles)
Métriques de merge PR
 (Aucune PR mergée en 30 j)

Description

Summary

When the screen is too small, the assets don't load in the game, this includes the map and the characters such as heros & character gifs, making it not really possible to play.

Impacted services

  • The frontend app

Steps to reproduce

  1. Start a local server and open the game in the chrome browser.
  2. Open the chrome inspector and use the device toolbar to use Pixel 4 dimensions, 353 * 745 in the webapp.
  3. Restart the game
  4. Load a practice match

The map does not render in the game & the heros don't load. (This also happens if you open the webapp on a phone like Pixel 6). Expected behaviour is that the characters load.

Environment information

  • Operating system: E.g. Linux
  • Browser: E.g. Chrome or Safari (could repro in both)

Guide contributeur

Direction de recherche
Étudiez le mécanisme de chargement des ressources dans le frontend, en particulier la façon dont les GIF de carte et de héros sont rendus. Vérifiez s'il y a du CSS réactif ou du JavaScript qui charge conditionnellement les ressources en fonction de la taille de l'écran. Examinez des fichiers comme src/components/GameBoard.js ou des requêtes média CSS similaires. Le problème peut être causé par des points de rupture manquants ou une gestion incorrecte des petites dimensions d'écran.
Stack technique
javascript
Domaine
frontend
Type d'issue
Bug
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
3
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
Une demi journée
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
HTMLCSSResponsive Design
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
60