F05 - Display menu items
KentuckySato opened this issue · 0 comments
KentuckySato commented
Règles métier :
- Suivre la maquette
- Les prix sont affichés en euros et arrondis au centime près.
- Dans la carte, si le nom est trop long, une ellipse tronque la fin du mot (avec les "...")
Assets (à télécharger dans le fichier .zip ci-dessous) :
- Maquette rendu finale du ticket
- Maquette rendu finale de l'appli
- Maquettes Figma disponible ici
- Jeu de données fake / fausses (dans fakeData/fakeMenu.js)
- Images des produits du menu (dans images/)
- Nouveau design system amélioré (dans theme/index.js)
- fonction formatMontant() disponible dans utils/maths.js
- CSS pour "Menu" :
- background: #F5F5F7;
- box-shadow: 0px 8px 20px 8px rgba(0, 0, 0, 0.2) inset;
- padding: 50px 50px 150px;
- grid-row-gap: 60px;
- CSS pour les cartes produit :
- box-shadow: -8px 8px 20px 0px rgb(0 0 0 / 20%);
Pour vous entrainer à grid efficacement : https://cssgridgarden.com/