From 75644329fdbe9a1bf81e4059bb93977d2b1cfdb8 Mon Sep 17 00:00:00 2001 From: Raphael Date: Fri, 19 Jul 2019 10:46:41 +0200 Subject: [PATCH] =?UTF-8?q?renommage=20des=20classes=20`grid-`=20en=20`gri?= =?UTF-8?q?llade-`=20pour=20=C3=A9viter=20tout=20conflit?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- changelog.md | 3 ++- sass/base/grillade-flex.scss | 12 ++++++------ sass/base/grillade-grid.scss | 16 ++++++++-------- 3 files changed, 16 insertions(+), 15 deletions(-) diff --git a/changelog.md b/changelog.md index afea702..fded701 100644 --- a/changelog.md +++ b/changelog.md @@ -7,9 +7,10 @@ - ajout d'une variable pour supporter ou non IE11 : `$ie: true !default;`. Activation de Grid Layout ou flexbox selon cette variable - ajout d'une variable pour supporter ou non les classes utilitaires : `$utilities: true !default;`. - ajout d'une variable pour supporter ou non WordPress : `$wordpress: false !default;`. Activation de reset et styles WordPress selon cette variable -- corrections typo +- renommage les classes `grid-` en `grillade-` pour éviter tout conflit - renommage de dossiers à la "7-1 pattern": `_config` > `abstracts`, `_library` > `base`, et du fichier `_base.scss` en `_reset.scss` - Browserslist devenu `.browserslistrc` +- corrections typo ## Changelog v7.1.2 (30 janvier 2019) diff --git a/sass/base/grillade-flex.scss b/sass/base/grillade-flex.scss index 283ca5e..7163882 100644 --- a/sass/base/grillade-flex.scss +++ b/sass/base/grillade-flex.scss @@ -22,8 +22,8 @@ $grid-gutters: ( '': 1rem, '-l': 2rem, '-xl': 4rem ); // https://github.com/alsacreations/KNACSS/issues/133; $iefix: 0.01px; @media (min-width: $small) { - [class*=" grid-"], - [class^="grid-"] { + [class*=" grillade-"], + [class^="grillade-"] { display: flex; flex-direction: row; flex-wrap: wrap; @@ -66,8 +66,8 @@ $iefix: 0.01px; } // Mono-line grid constructor (.grid) @media (min-width: $small) { - .grid, - .grid--reverse { + .grillade, + .grillade--reverse { display: flex; & > * { @@ -86,7 +86,7 @@ $iefix: 0.01px; // Constructing grids : will be compiled in CSS @media (min-width: $small) { @for $i from 2 through $cols { - [class*="grid-#{$i}"] { + [class*="grillade-#{$i}"] { @include grid(#{$i}, 0); } } @@ -110,7 +110,7 @@ $iefix: 0.01px; order: 1; } -[class*="grid-"][class*="--reverse"] { +[class*="grillade-"][class*="--reverse"] { flex-direction: row-reverse; } // sizing individual children diff --git a/sass/base/grillade-grid.scss b/sass/base/grillade-grid.scss index 3780ed0..6d4933b 100644 --- a/sass/base/grillade-grid.scss +++ b/sass/base/grillade-grid.scss @@ -13,8 +13,8 @@ $medium: 768px !default; $cols: 12 !default; // classic Grid -[class*=" grid-"], -[class^="grid-"] { +[class*=" grillade-"], +[class^="grillade-"] { @media (min-width: $tiny) { display: grid; grid-auto-flow: dense; @@ -35,8 +35,8 @@ $cols: 12 !default; } // autogrid -.autogrid, -.grid { +.autogrillade, +.grillade { @media (min-width: $tiny) { display: grid; grid-auto-flow: column; @@ -57,9 +57,9 @@ $cols: 12 !default; } } -// grid constructor (.grid-2 to .grid-$cols) +// grid constructor (.grillade-2 to .grillade-$cols) @for $i from 2 through $cols { - [class*="grid-#{$i}"] { + [class*="grillade-#{$i}"] { grid-template-columns: repeat(#{$i}, 1fr); } } @@ -77,10 +77,10 @@ $cols: 12 !default; /* intermediate breakpoints */ // -small-X suffix means "X columns when < medium screen" -// example : .grid-4-small-2 will be 1 column (< tiny) then 2 columns (< medium) then 4 columns +// example : .grillade-4-small-2 will be 1 column (< tiny) then 2 columns (< medium) then 4 columns @media (min-width: $tiny) and (max-width: ($medium - 1)) { @for $i from 1 through 4{ - [class*="grid-"][class*="-small-#{$i}"] { + [class*="grillade-"][class*="-small-#{$i}"] { grid-template-columns: repeat(#{$i}, 1fr); }