Aller au contenu

Des propriétés personnalisées très, très personnalisées

Par Gaël Poupard

Mini-conf (30 mn) :
Langue :
Français
CC
  • Diaporama
  • Le sujet

    Voici une esquisse de sommaire :

    — les custom properties : les origines — et non, ce ne sont pas des variables !
    — l’héritage (Mitsouko !)
    — les valeurs de repli dans var() !
    — cas d’usage consensuel : les variantes de composants
    — factorisation du code et optimisation : par ex. les font-family à rallonge, images en data URI, polygon(), fonction de transformation… répétées gagnent à être dans des custom properties :) (un exemple: background: white var(--stripes);pun intended)
    — gestion de palette de couleurs grâce aux custom properties : avec un peu de calculs dedans grâce à hsl() ou rgb()
    — respect des préférences utilisateur sans circonvolution en utilisant des valeurs pseudos-booléennes
    — partager des propriétés à quelques valeurs près, par exemple… des positions dans un polygone ?
    — hydrater des données dans une page statique en limitant la manipulation du DOM
    — et oui, côté JS aussi c’est cool, les custom properties !
    — pour le fun : conversion d’un entier en chaîne dans CSS <3

    C’est facile, ce n’est que du CSS ;)

    Présenté par