Les deux révisions précédentes Révision précédente | Prochaine révisionLes deux révisions suivantes |
txs:peertube-a18:concepts_bootstrap [2018/12/19 18:09] – andres | txs:peertube-a18:concepts_bootstrap [2019/01/12 18:17] – aurelien.beranger |
---|
====== Bootstrap ====== | ====== Bootstrap ====== |
Bootstrap est un framework open-source qui permet de faire rapidement et facilement le design d'une page web. PeerTube utilise la version 4. | Bootstrap est un //framework// open-source qui permet de faire rapidement et facilement le design d'une page web. PeerTube utilise la version 4. |
| |
D'habitude, Bootstrap est composé de quelques fichiers CSS et JS, mais dans le cas de PeerTube, Bootstrap est inclu sous la forme d'un ''node_module'' contenant les sources au format Sass (fichiers ''.scss''). Ces sources sont compilées avec les assets propres à PeerTube, qui sont définis dans plusieurs fichiers ''.scss'', notamment ''client/src/sass/include/_mixins.scss''. | D'habitude, Bootstrap est composé de quelques fichiers CSS et JS, mais dans le cas de PeerTube, Bootstrap est inclut sous la forme d'un ''node_module'' contenant les sources au format Sass (fichiers ''.scss''). Ces sources sont compilées avec les //assets// propres à PeerTube, qui sont définis dans plusieurs fichiers ''.scss'', notamment ''client/src/sass/include/_mixins.scss''. |
| |
===== Système de grilles ===== | ===== Système de grilles ===== |
{{ :txs:peertube-a18:grille_bootstrap.jpg |}} | {{ :txs:peertube-a18:grille_bootstrap.jpg |}} |
| |
Chaque ligne (''row'') de Bootstrap peut contenir jusqu'à 12 colonnes (''col''), qui peuvent elles même contenir d'autres ''row''. | Chaque ligne (''row'') de Bootstrap peut contenir jusqu'à 12 colonnes (''col''), qui peuvent elles-même contenir d'autres ''row''. |
| |
Il est possible de définir le nombre de colonnes utilisées par chaque élément, en ajoutant un suffixe ''-1'', ''-2'', ... , ''-12'' à ''col''. Par exemple: | Il est possible de définir le nombre de colonnes utilisées par chaque élément, en ajoutant un suffixe ''-1'', ''-2'', ... , ''-12'' à ''col''. Par exemple: |