CSS

Convention de nommage BEM

Dans le cadre du projet, j'ai choisis d'appliquer la convention de nommage BEM pour faciliter le travail en équipe et la continuité du développement du projet. J'ai donc établi cette convention-ci :

Gabarit titre de page

• .menu__site
• .menu--logo

Gabarit page index

• .menu__restaurant

• .menu__restaurant__liste

• .menu__restaurant__liste__carte

• .menu__restaurant__liste__carte--titre

• .menu__restaurant__liste__carte--detail

• .menu__restaurant__annonce

• .menu__restaurant__annonce--prochainement

• .menu__restaurant__annonce--loading

Gabarit page restaurant

• .menu menu--note
• .menu__header
• .menu__header--titre

Les entrées

• .menu__plats menu__plats--entree

• .menu__plats__hearder

• .menu__plats__hearder--titre

• .menu__plats__detail

• .menu__plats__detail__element

• .menu__plats__detail__element__nom

• .menu__plats__detail__element__prix

...

les plats principaux

• .menu__plats menu__plats--principal
• .menu__plats__hearder
• .menu__plats__hearder--titre
• .menu__plats__detail

...

Les desserts

• .menu__plats menu__plats--dessert
• .menu__plats__hearder
• .menu__plats__hearder--titre
• .menu__plats__detail

...

Contenu en bas de carte ( la note enchantée)

• .menu__carte__footer
• .menu__carte__footer--titre

Bouton prochainement

• .menu__restaurant__annonce
• .menu__restaurant__annonce--prochainement
• .menu__restaurant__annonce--loading

Bouton accueil

• .menu__accueil
• .menu__accueil--retour

Gabarit pied de page

• .menu__footer
• .menu__footer--mention
• .menu__footer--contact

---

Mobile-first

Le site est pensé en Mobile-first pour 3 raisons principales:

• Le référencement par le crawler de google
• L'UX
• et en terme de performance

---