Commande de Raymond :
Le taquin est une figure divisée en 16 morceaux de dimensions similaires(en hauteur et en largeur).
Les 16 morceaux sont disposés sur une grille de 16 emplacements adjacents(4 colonnes, 4 rangées).
Le 16eme morceau est invisible.
Si un des 15 morceaux visibles est voisin du morceau invisible, il devient cliquable. Au clic sur un morceau visible, il échange sa place avec le morceau invisible.
Les 16 div sont contenues par une boite flex. La largeur de la dite boite Flex correspond à 4 fois la largeur de chaque morceau.
Nous attribuons un comportement wrap à cette boite: La mise en tableau des pièces dépend de ce comportement.
Une propriété order pour chaque pièce du taquin lui donne sa position dans le tableau.
L'image n'a pa été découpée en 16 morceaux au préalable, une seule image est employée et est ensuite utilisée comme background de chaque case pour simuler des morceaux différents.
Une autre version de ce Taquin reproduira le même fonctionnement avec une vidéo.
Le Javascript est employé pour gérer le CSS existant, permettre l'écoute des actions du joueur et y réagir.
simple:
- Un Header qui reprend le nom de domaine.
- Un Nav latéral avec la galerie d'images/video cliquables.
- 3 pages composeront le site
- -Une page galerie, avec toutes les images représentant les taquins potentiel, qui ménera à:
- Une page Taquin contenant un Main centré, qui sera le contenant du composant "Taquin jouable".
- Une page à propos ou ReadMe
- Un footer reprenant les références minimum(générique, conditions générales, liens externes, réseaux sociaux potentiels).
- Footer, header,
- aplats unis communs,
- font : sans-serif brute, sobre, blanc grand pour h1 header et pour le footer petite taille, peu de strong, noir.
- Composant, fond gris clair, adoucir le biseau de chaque pièce.