DESIGN SYSTEM Bootstrap SCSS / CSS

ds-bootstrap est un kit de démarrage contenant les éléments graphiques Malakoff Humanis au format scss et css.

• Lien vers la documentation
• Lien vers le package

Le code source est rédigé en SCSS et il est compilé en CSS.

Sommaire

• Prérequis
• Démarrage rapide
• Déployer la librairie

Prérequis

installer la dernière version stable de Nodejs

Démarrage rapide

1- cloner le projet et se placer sur la branche develop

2- installer les dépendances de dev.

npm install

3- créer un fichier .env en vous aidant du fichier .env.exemple disponible à la racine du projet

4- lancer le projet en mode watch

npm start

• Le serveur se recharge à la modification du scss et du html.
• Le CSS est généré à chaque modification du SCSS.

Déployer le module sur nexus

• taguer la version sur master
• changer la version dans le package.json
• Lancer un build sur Jenkins
• La librairie est déployée sur nexus

Ajouter de nouvelles icônes

• se connecter sur https://icomoon.io/app
• cliquer sur "imports icons"
• sélectionner le dernier fichier json préalablement telecharger dans les fichiers de ce canal dans le dossier ico-moon
• drag and droper les nouveau svg sur ico-moon
• cliquer sur le burger menu en haut et sur "download json"
• renommer le fichier avec la date et l'uploader dans le dossier "ico-moon" sur ce canal
• cliquer sur "generate font" sur la barre du bas puis sur download au même endroit
• dans le fichier zip obtenu dans le dossier 'fonts' il y a 4 fichiers extraire et renommer les en ds-icon
• dans le projet lib remplacer les 4 fichiers dans assets/fonts/dsicon par ce fraîchement telecharger et renommé
• prendre le fichier style.css du zip et répliquer chaque class css au format clef valeur dans la lib sur le fichier scss se trouvant dans variables/icones.scss (clef = nom de la class, valeur = le content