Nous ajoutons une certaine réactivité à la grille que nous avons mise en place pour la Galerie. Sur les écrans les plus larges, nous l'avons fixé à quatre colonnes. Ensuite, nous commençons à ajouter des points d'arrêt via nos @mixins super faciles que nous avons configurés et réutilisés partout.
À notre point de rupture maman-ours, nous descendons à 3 colonnes, puis nous faisons un point de rupture intermédiaire entre maman-ours et bébé-ours où il se divise en 2 colonnes, puis finalement 1 colonne chez bébé-ours. C'est très simple, car tout ce que nous devons faire est d'ajuster le nombre de colonnes que nous définissons via CSS3 column-count.
Nous terminons la vidéo en parlant des objectifs futurs de la galerie. Ce serait bien de pouvoir charger un nombre différent d'images sur différentes tailles d'écran et d'utiliser des miniatures réelles au lieu d'images en taille réelle. Peut-être qu'un jour nous y arriverons.
Pour mémoire, le logiciel que j'utilise localement pour capturer des captures d'écran et les télécharger sur le serveur via FTP est LittleSnapper.
