Deuxième projet du parcours javascript-react chez OpenClassrooms.
L'objectif est d'intégrer la maquette d'un site de planification de vacances nommé "Booki" (voir l'image ci-dessous).
● Les usagers pourront rechercher des hébergements dans la ville de
leur choix. Le champ de recherche est un champ de saisie. La partie recherche ne doit pas être fonctionnelle.
● Chaque carte d’hébergement ou d’activité devra être cliquable dans
son intégralité. Pour l’instant, les liens sont
vides. On peut utiliser un attribut href=”#” pour simuler la
présence d’un lien.
● Les filtres doivent changer d’apparence au survol. Par contre, ils ne doivent pas être fonctionnels.
● Les textes “Hébergements” et “Activités”, situés dans l’en-tête, sont
des liens. Ils doivent mener respectivement vers la section
“Hébergements à Marseille” et “Activités à Marseille”.
● Deux maquettes ont été réalisées : l’une desktop et l’autre mobile. Le
site devra être également adapté aux formats tablette.
● Il faut d’abord réaliser l’intégration en desktop first, puis les tablettes et enfin les téléphones.
Plusieurs formats et tailles d’images ont été exportés. Il faudra choisir
le format le plus adapté par rapport à la résolution et au temps de
chargement.
● Les icônes proviennent de la bibliothèque Font Awesome.
● Les couleurs de la charte sont le bleu (#0065FC), une version plus
claire de ce bleu (#DEEBFF) et le gris pour le fond (#F2F2F2).
● La police du site est Raleway.
● Utiliser les pixels et les pourcentages plutôt que les
REM et les EM.
● Utiliser Flexbox plutôt que Grid.
Aucun framework CSS ne doit être utilisé.
● Utiliser des balises sémantiques.
● Le code doit être valide aux validateurs W3C HTML et CSS.
● La maquette doit être compatible avec les dernières versions de
Google Chrome et de Mozilla Firefox.
Venez visiter mon site https://angelique31.github.io/P2--Booki/