acmpesuecc / acmpesuecc/mygpa

fix: improve responsiveness of buttons and formfields

Ouverte
#3 12 commentaires 0 réactions 0 personnes assignées Voir sur GitHub
bounty 250 bug
Langage dominant
TypeScript
Étoiles
1
Forks
10
Métriques de merge des PR
Aucune PR mergée en 30 j

Description

## Description

The form layout in `src/app/findmysgpa/sgpaform.tsx` and `src/app/findmycgpa/cgpaform.tsx` is not responsive across all screen sizes and is poorly styled with arbitrary, hard-coded widths, spacing and a lack of proper `flex` or `grid` layout rules.

## Steps to reproduce

- Visit the /findmycgpa` or `/findmysgpa` pages on the [deployed site](https://mygpa.vercel.app) or a local instace.
- Open your browser dev tools
- Open device / responsive mode and play around with different screen resolutions (particularly mobile, iPad and larger monitor sizes) to see the inconsistencies.

## Expected Behaviour

- A well designed and styled approach to the forms with inputs, labels and buttons sized and spaced consistently and predictably, retain the same 3 column layout across all screen sizes
- Consistency and no loss of visual appeal across all screen sizes ranging from mobile (<= 360×640) to larger screens (>= 1920×1080)

## Images / Videos

Image

Image

Guide de contribution

Ouvrir le guide de contribution

Évaluation

Cette issue n'a pas encore été évaluée.

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.