Changeset 107708 in spip-zone
- Timestamp:
- Nov 23, 2017, 11:09:27 AM (3 years ago)
- Location:
- _squelettes_/integraal/theme/trunk/scss/base
- Files:
-
- 1 deleted
- 2 edited
Legend:
- Unmodified
- Added
- Removed
-
_squelettes_/integraal/theme/trunk/scss/base/_rythm.scss
r107696 r107708 2 2 * Contrôle du rythme vertical 3 3 * 4 * Définition des tailles de police, des interlignes , et des marges inférieures des principaux éléments4 * Définition des tailles de police, des interlignes et des marges inférieures pour obtenir un rythme vertical harmonieux. 5 5 * Basé sur Shevy : https://kyleshevlin.github.io/shevy/ 6 6 * 7 7 * @notes 8 * - Il faut passer *après* Tinytypo. 8 * - Il faut configurer le rythme vertical APRÈS Tinytypo. 9 * - Les variantes $shevy-[truc] ne sont pas que pour le responsive, elles peuvent être utilisées pour n'importe quel sélecteur (blocs de mises en avant, etc.). 10 * - Pour chaque variante $shevy-[truc], il vaut mieux redéclarer toutes les variables, 11 * sinon ça prend celles pas défaut (pas celles qu'on a mis nous dans le $shevy de base) 9 12 * - Pour définir des marges dans d'autres composants du projet, utiliser la mixin bs(N) 10 13 **/ 11 14 15 /** 16 * ================ 17 * 1) Configuration 18 * ================ 19 **/ 20 21 /* Presets des tailles des titres (pour aider, pas obligatoire) */ 22 $BASIC_SHEVY: (2.5, 2.1, 1.8, 1.5, 1.25, 1); 23 $MINOR_SECOND: (1.382, 1.295, 1.214, 1.138, 1.067, 1); 24 $MAJOR_SECOND: (1.802, 1.602, 1.424, 1.266, 1.125, 1); 25 $MINOR_THIRD: (2.488, 2.074, 1.728, 1.44, 1.2, 1); 26 $MAJOR_THIRD: (3.052, 2.441, 1.953, 1.563, 1.25, 1); 27 $PERFECT_FOURTH: (4.209, 3.157, 2.369, 1.777, 1.333, 1); 28 $AUGMENTED_FOURTH: (5.653, 3.998, 2.827, 1.999, 1.414, 1); 29 $PERFECT_FIFTH: (7.594, 5.063, 3.375, 2.25, 1.5, 1); 30 $MINOR_SIXTH: (10.486, 6.554, 4.096, 2.56, 1.6, 1); 31 $GOLDEN_SECTION: (11.089, 6.854, 4.236, 2.618, 1.618, 1); 32 33 /* Base (mobile first)*/ 34 $shevy: ( 35 base-font-size: $typo-font-size, // Taille de police, defaut : 14px 36 base-line-height: $typo-line-height, // Interlignage, defaut : 1.5 37 base-font-scale: $MINOR_SECOND, // Facteurs des tailles des titres, du h1 au h6, defaut : (2.5, 2.1, 1.8, 1.5, 1.25, 1) 38 margin-bottom: true, // Ajouter des marges inférieures aux titres, defaut : true 39 proximity: false, // Ressérer le contenu (proximity effect), defaut : false 40 proximity-factor: .85 // Facteur pour ressérer le contenu, defaut : .85 41 ); 42 43 /* Bureaux et plus */ 44 $shevy-desktop-up: ( 45 base-font-size: $typo-font-size * 1.2, 46 base-line-height: $typo-line-height, 47 base-font-scale: $MAJOR_SECOND, 48 margin-bottom: true, 49 proximity: false, 50 proximity-factor: .85 51 ); 52 53 54 /** 55 * ================= 56 * 2) Mise en oeuvre 57 * ================= 58 **/ 12 59 13 60 /** 14 61 * Base (mobile first) 15 62 **/ 16 17 18 // hn (font-size, line-height, margin-bottom) 19 @include headings; 20 21 // body (font-size, line-height) 22 @include body; 23 24 // p ol ul pre (font-size, line-height, margin-bottom) 25 @include content; 26 63 @include body; // body (font-size, line-height) 64 @include headings; // hn (font-size, line-height, margin-bottom) 65 @include content; // p ol ul pre (font-size, line-height, margin-bottom) 27 66 28 67 /** 29 * Responsive68 * Bureaux et plus 30 69 **/ 31 32 @include gridle_state( desktop ) { 33 @include headings($shevy-desktop); 34 @include body($shevy-desktop); 35 @include content($shevy-desktop); 70 @include gridle_state( desktop-up ) { 71 @include headings($shevy-desktop-up); 72 @include body($shevy-desktop-up); 73 @include content($shevy-desktop-up); 36 74 } 37 @include gridle_state( large ) {38 @include headings($shevy-large);39 @include body($shevy-large);40 @include content($shevy-large);41 } -
_squelettes_/integraal/theme/trunk/scss/base/_variables.scss
r107693 r107708 2 2 * Définition des variables du projet 3 3 * 4 * Voir aussi les fichiers xxx-settings.scss5 4 **/ 6 5 … … 16 15 17 16 /* Variables de typographie (voir aussi dans rythm-settings) */ 18 $typo-font-size: 1 6px;17 $typo-font-size: 1em; 19 18 $typo-line-height: 1.5; 20 19
Note: See TracChangeset
for help on using the changeset viewer.