Le Xmode est une plateforme de straming musicale fictive qui rend hommage à un artiste à choisir, en transformant temporairement l’apparence du site à la manière d’un Dark Mode en cliquant sur un bouton.

J’ai choisi Ryoji Ikeda qui est musicien et a un univers artistique reconnaissable.

Il y avait un certain nombre de contraintes, le changement de mode devait au moins utiliser/modifier les éléments suivant: - des propriétés de texte au choix (couleur, taille, graisse,…)
- des couleurs de background
- des bordures
- une ou des images (remplacer une image par une autre)
- le menu (couleur des liens et background des boutons)
- call to action (inscription)
- les différentes partie de la page: header, hero, sections, accordéon, encarts, footer
- masquer/faire apparaître un contenu
- une taille d’un élément (div ou autre)
- des balises html sémantiques, des div, des balises de texte span et h
- utilisation des fonction de manipulation des classes add, remove et toggle (classList)
- modifier directement une propriété CSS sans manipuler de classe (style)
- introduire un changement selon un test conditionnel
- introduire un contenu généré à l’aide d’une boucle
- faire apparaître / disparaître un élément animé
- modifier du contenu HTML (innerHTML)
- ajouter un contenu flottant au choix (particules, 3d, motif, image, texte, …)

Ce lien mène au projet. Cliquez sur le bouton "Ikeda mode" pour découvrir un autre univers.