Luxbar

Luxbar est utilisé pour construire et styliser le menu de cette page. L'application Luxbar génère le code HTML du menu et la feuille de style "luxbar.css" paramètre l'apparence de ce menu.

Luxbar sur GitHub

Plus qu'une feuille de style

Luxbar est avant tout une application Web permettant de générer le code HTML d'une barre de menu.. Ce code fait appel à une feuille de style minifiée nommée "luxbar.min.css". Dans cette feuille de style sont codées toutes les instructions nécessaires pour présenter correctement les 4 styles de menus proposées par Luxbar.

Vous pouvez accéder à une démo en ligne de l'application Luxbar à l'adresse suivante : balzss.github.io/luxbar/

La documentation de Luxbar est disponible, en anglais, à cette adresse : github.com/balzss/luxbar/

Aménagements pédagogiques

Pour permettre de mieux comprendre comment fonctionne Luxbar, la feuille de style "luxbar.min.css" a été adaptée (...dé-minifiée) pour en faciliter la lecture. Elle a été renommée "luxbar.css". C'est elle qui est appelée dans l'entête des pages de ce site.

L'application Luxbar génère un code placé dans un élément <header>. Pour optimiser sémantique du code source, vous constaterez que, dans le code source de ce site, l'élément <header> a été remplacé par l'élément <nav>.

La transition initialement programmée au clic sur les onglets du menu a été désactivée par une mise en commentaire (entre balises /* et */). Il est donc possible de la réactiver (ligne 81 de luxbar.css), en supprimant les balises /* et */.