Milligram: Changez facilement la couleur de surbrillance (#9b4dca)

Créé le 22 févr. 2018  ·  6Commentaires  ·  Source: milligram/milligram

En utilisant des variables CSS3 (propriétés personnalisées), il est possible de remplacer la couleur de surbrillance dans 1 ligne de CSS.

Dans milligram.css, ayez quelque chose du genre :

:root {
  --highlight-color: #9b4dca;
}

puis remplacez chaque #9b4dca par var(--highlight-color) .

Une fois cela fait, remplacer la couleur de surbrillance est aussi simple que d'inclure un fichier custom.css avec

:root {
  --highlight-color: #abcabc;
}
Hacktoberfest new feature

Commentaire le plus utile

Je suis venu ici pour la même chose ^^ mais comme il est écrit en SASS et que vous voudrez peut-être prendre en charge les anciens navigateurs, je recommanderais de faire un exemple plus éprouvé comme celui-ci :

button {
  background-color: $color-primary;
  background-color: var(--color-primary, $color-primary);
}

De cette façon, les navigateurs qui ne prennent pas en charge les propriétés personnalisées CSS reviendront toujours à une version de travail. De cette façon, aucun :root {} dans les feuilles de style réelles n'est nécessaire puisque var() fournit déjà une option de secours.

Acclamations,
Dominique

Tous les 6 commentaires

Je suis venu ici pour la même chose ^^ mais comme il est écrit en SASS et que vous voudrez peut-être prendre en charge les anciens navigateurs, je recommanderais de faire un exemple plus éprouvé comme celui-ci :

button {
  background-color: $color-primary;
  background-color: var(--color-primary, $color-primary);
}

De cette façon, les navigateurs qui ne prennent pas en charge les propriétés personnalisées CSS reviendront toujours à une version de travail. De cette façon, aucun :root {} dans les feuilles de style réelles n'est nécessaire puisque var() fournit déjà une option de secours.

Acclamations,
Dominique

Y a-t-il des progrès ou quelque chose de fait à ce sujet jusqu'à présent ? 😄

Y a-t-il des progrès ou quelque chose de fait à ce sujet jusqu'à présent ? 😄

vous pouvez toujours changer les valeurs des couleurs à partir de src/_Color.sass puis recompiler à nouveau avec sass --update . Vous pouvez également ajouter vos propres fichiers sass.

Y a-t-il des progrès ou quelque chose de fait à ce sujet jusqu'à présent ? 😄

vous pouvez toujours changer les valeurs des couleurs à partir de src/_Color.sass puis recompiler à nouveau avec sass --update . Vous pouvez également ajouter vos propres fichiers sass.

Bon point! Je suppose que je cherche une solution un peu plus prête à l'emploi puisque je n'utilise pas Sass, mais je ne sais pas vraiment comment cela pourrait être fait facilement autre que de changer les valeurs elles-mêmes dans /dist/milligram.min.css ce qui serait problématique.

J'adore ce cadre ! J'ai hâte que cette fonctionnalité soit publiée 🚀

Salut @mterron @dkundel @timrossback @dntzbgh @cilim

Peut-être quelque chose comme ça ?
https://github.com/milligram/milligram/pull/262/files#diff -7b0a61514569d183adbda861549f9d98

Cette page vous a été utile?
0 / 5 - 0 notes