Update package
This commit is contained in:
Rodolphe
Raphael
parent
e6dcf97f60
commit
d7214f2fdd
8 changed files with 2699 additions and 1919 deletions
26
changelog.md
26
changelog.md
|
|
@ -2,19 +2,21 @@
|
|||
|
||||
## Changelog v8.0.0 (xxx 2019)
|
||||
|
||||
- mise à jour du reset, suppression des reset vendors (Reboot de Boostrap)
|
||||
- support passé de IE10 à IE11 (browserlist)
|
||||
- Browserslist devenu `.browserslistrc` et mise à jour du support à `>0.25%
|
||||
- Architecture : mise à jour du reset, suppression des reset vendors (Reboot de Boostrap)
|
||||
- Architecture : renommage de dossiers à la "7-1 pattern": `_config` > `abstracts`, `_library` > `base`, et du fichier `_base.scss` en `_reset.scss`
|
||||
- Architecture : modification de l'ordre d'import des fichiers : les utilitaires sont importées à la fin à présent
|
||||
- Compatibilité : support passé de IE10 à IE11 (browserlist)
|
||||
- Compatibilité : Browserslist devenu `.browserslistrc` et mise à jour du support à `>0.25%
|
||||
not op_mini all`
|
||||
- versions exactes des dépendances dans package.json (pour éviter "latest")
|
||||
- renommage des 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`
|
||||
- fichier gulpfile.js dorénavant compatible Gulp 4
|
||||
- modification de l'ordre d'import des fichiers : les utilitaires sont importées à la fin à présent
|
||||
- ajout d'une variable pour supporter ou non IE11 : `$ie: true !default;`.
|
||||
- ajout d'une variable pour supporter ou non WordPress : `$wordpress: false !default;`.
|
||||
- `visually-hidden` devient un mixin
|
||||
- corrections typo
|
||||
- Compatibilité : fichier gulpfile.js dorénavant compatible Gulp 4
|
||||
- Compatibilité : versions exactes des dépendances dans package.json (pour éviter "latest")
|
||||
- Grillade :renommage des classes `grid-` en `grillade-` pour éviter tout conflit
|
||||
- Grillade : ajout du constructeur `medium-X` en plus de `small-X`
|
||||
- Grillade : ajout des constructeus `-start`, `-end`, `-center`, `-space-between`, `-space-around`, `-space-evenly` pour l'alignement général de la grille
|
||||
- Divers : ajout d'une variable pour supporter ou non IE11 : `$ie: true !default;`.
|
||||
- Divers :ajout d'une variable pour supporter ou non WordPress : `$wordpress: false !default;`.
|
||||
- Divers :`visually-hidden` devient un mixin
|
||||
- Divers :corrections typo
|
||||
|
||||
## Changelog v7.1.2 (30 janvier 2019)
|
||||
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -1 +1 @@
|
|||
@media (min-width:480px){[class*=" grid-"],[class^=grid-]{display:-ms-grid;display:grid;grid-auto-flow:dense}[class*=" grid-"].has-gutter,[class^=grid-].has-gutter{grid-gap:1rem}[class*=" grid-"].has-gutter-l,[class^=grid-].has-gutter-l{grid-gap:2rem}[class*=" grid-"].has-gutter-xl,[class^=grid-].has-gutter-xl{grid-gap:4rem}}@media (min-width:480px){.autogrid,.grid{display:-ms-grid;display:grid;grid-auto-flow:column;grid-auto-columns:1fr}.autogrid.has-gutter,.grid.has-gutter{grid-column-gap:1rem}.autogrid.has-gutter-l,.grid.has-gutter-l{grid-column-gap:2rem}.autogrid.has-gutter-xl,.grid.has-gutter-xl{grid-column-gap:4rem}}[class*=grid-2]{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr)}[class*=grid-3]{-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3,1fr)}[class*=grid-4]{-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4,1fr)}[class*=grid-5]{-ms-grid-columns:(1fr)[5];grid-template-columns:repeat(5,1fr)}[class*=grid-6]{-ms-grid-columns:(1fr)[6];grid-template-columns:repeat(6,1fr)}[class*=grid-7]{-ms-grid-columns:(1fr)[7];grid-template-columns:repeat(7,1fr)}[class*=grid-8]{-ms-grid-columns:(1fr)[8];grid-template-columns:repeat(8,1fr)}[class*=grid-9]{-ms-grid-columns:(1fr)[9];grid-template-columns:repeat(9,1fr)}[class*=grid-10]{-ms-grid-columns:(1fr)[10];grid-template-columns:repeat(10,1fr)}[class*=grid-11]{-ms-grid-columns:(1fr)[11];grid-template-columns:repeat(11,1fr)}[class*=grid-12]{-ms-grid-columns:(1fr)[12];grid-template-columns:repeat(12,1fr)}[class*=col-1]{grid-column:auto/span 1}[class*=row-1]{grid-row:auto/span 1}[class*=col-2]{grid-column:auto/span 2}[class*=row-2]{grid-row:auto/span 2}[class*=col-3]{grid-column:auto/span 3}[class*=row-3]{grid-row:auto/span 3}[class*=col-4]{grid-column:auto/span 4}[class*=row-4]{grid-row:auto/span 4}[class*=col-5]{grid-column:auto/span 5}[class*=row-5]{grid-row:auto/span 5}[class*=col-6]{grid-column:auto/span 6}[class*=row-6]{grid-row:auto/span 6}[class*=col-7]{grid-column:auto/span 7}[class*=row-7]{grid-row:auto/span 7}[class*=col-8]{grid-column:auto/span 8}[class*=row-8]{grid-row:auto/span 8}[class*=col-9]{grid-column:auto/span 9}[class*=row-9]{grid-row:auto/span 9}[class*=col-10]{grid-column:auto/span 10}[class*=row-10]{grid-row:auto/span 10}[class*=col-11]{grid-column:auto/span 11}[class*=row-11]{grid-row:auto/span 11}[class*=col-12]{grid-column:auto/span 12}[class*=row-12]{grid-row:auto/span 12}@media (min-width:480px) and (max-width:767px){[class*=grid-][class*=-small-1]{-ms-grid-columns:(1fr)[1];grid-template-columns:repeat(1,1fr)}[class*=col-][class*=-small-1]{grid-column:auto/span 1}[class*=grid-][class*=-small-2]{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr)}[class*=col-][class*=-small-2]{grid-column:auto/span 2}[class*=grid-][class*=-small-3]{-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3,1fr)}[class*=col-][class*=-small-3]{grid-column:auto/span 3}[class*=grid-][class*=-small-4]{-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4,1fr)}[class*=col-][class*=-small-4]{grid-column:auto/span 4}[class*=-small-all]{grid-column:1/-1}}.item-first{-webkit-box-ordinal-group:0;-ms-flex-order:-1;order:-1}.item-last{-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1}.grid-offset{visibility:hidden}.col-all{grid-column:1/-1}.row-all{grid-row:1/-1}
|
||||
@media (min-width:480px){[class*=" grillade-"],[class^=grillade-]{display:-ms-grid;display:grid}[class*=" grillade-"].has-gutter,[class^=grillade-].has-gutter{grid-gap:1rem}[class*=" grillade-"].has-gutter-l,[class^=grillade-].has-gutter-l{grid-gap:2rem}[class*=" grillade-"].has-gutter-xl,[class^=grillade-].has-gutter-xl{grid-gap:4rem}}@media (min-width:480px){.autogrillade,.grillade{display:-ms-grid;display:grid;grid-auto-flow:column;grid-auto-columns:1fr}.autogrillade.has-gutter,.grillade.has-gutter{grid-column-gap:1rem}.autogrillade.has-gutter-l,.grillade.has-gutter-l{grid-column-gap:2rem}.autogrillade.has-gutter-xl,.grillade.has-gutter-xl{grid-column-gap:4rem}}[class*=grillade-2]{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr)}[class*=grillade-3]{-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3,1fr)}[class*=grillade-4]{-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4,1fr)}[class*=grillade-5]{-ms-grid-columns:(1fr)[5];grid-template-columns:repeat(5,1fr)}[class*=grillade-6]{-ms-grid-columns:(1fr)[6];grid-template-columns:repeat(6,1fr)}[class*=grillade-7]{-ms-grid-columns:(1fr)[7];grid-template-columns:repeat(7,1fr)}[class*=grillade-8]{-ms-grid-columns:(1fr)[8];grid-template-columns:repeat(8,1fr)}[class*=grillade-9]{-ms-grid-columns:(1fr)[9];grid-template-columns:repeat(9,1fr)}[class*=grillade-10]{-ms-grid-columns:(1fr)[10];grid-template-columns:repeat(10,1fr)}[class*=grillade-11]{-ms-grid-columns:(1fr)[11];grid-template-columns:repeat(11,1fr)}[class*=grillade-12]{-ms-grid-columns:(1fr)[12];grid-template-columns:repeat(12,1fr)}[class*=col-1]{grid-column:auto/span 1}[class*=row-1]{grid-row:auto/span 1}[class*=col-2]{grid-column:auto/span 2}[class*=row-2]{grid-row:auto/span 2}[class*=col-3]{grid-column:auto/span 3}[class*=row-3]{grid-row:auto/span 3}[class*=col-4]{grid-column:auto/span 4}[class*=row-4]{grid-row:auto/span 4}[class*=col-5]{grid-column:auto/span 5}[class*=row-5]{grid-row:auto/span 5}[class*=col-6]{grid-column:auto/span 6}[class*=row-6]{grid-row:auto/span 6}[class*=col-7]{grid-column:auto/span 7}[class*=row-7]{grid-row:auto/span 7}[class*=col-8]{grid-column:auto/span 8}[class*=row-8]{grid-row:auto/span 8}[class*=col-9]{grid-column:auto/span 9}[class*=row-9]{grid-row:auto/span 9}[class*=col-10]{grid-column:auto/span 10}[class*=row-10]{grid-row:auto/span 10}[class*=col-11]{grid-column:auto/span 11}[class*=row-11]{grid-row:auto/span 11}[class*=col-12]{grid-column:auto/span 12}[class*=row-12]{grid-row:auto/span 12}@media (min-width:480px) and (max-width:991px){[class*=grillade-][class*=-medium-1]{-ms-grid-columns:(1fr)[1];grid-template-columns:repeat(1,1fr)}[class*=col-][class*=-medium-1]{grid-column:auto/span 1}[class*=grillade-][class*=-medium-2]{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr)}[class*=col-][class*=-medium-2]{grid-column:auto/span 2}[class*=grillade-][class*=-medium-3]{-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3,1fr)}[class*=col-][class*=-medium-3]{grid-column:auto/span 3}[class*=grillade-][class*=-medium-4]{-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4,1fr)}[class*=col-][class*=-medium-4]{grid-column:auto/span 4}[class*=-medium-all]{grid-column:1/-1}}@media (min-width:480px) and (max-width:767px){[class*=grillade-][class*=-small-1]{-ms-grid-columns:(1fr)[1];grid-template-columns:repeat(1,1fr)}[class*=col-][class*=-small-1]{grid-column:auto/span 1}[class*=grillade-][class*=-small-2]{-ms-grid-columns:(1fr)[2];grid-template-columns:repeat(2,1fr)}[class*=col-][class*=-small-2]{grid-column:auto/span 2}[class*=grillade-][class*=-small-3]{-ms-grid-columns:(1fr)[3];grid-template-columns:repeat(3,1fr)}[class*=col-][class*=-small-3]{grid-column:auto/span 3}[class*=grillade-][class*=-small-4]{-ms-grid-columns:(1fr)[4];grid-template-columns:repeat(4,1fr)}[class*=col-][class*=-small-4]{grid-column:auto/span 4}[class*=-small-all]{grid-column:1/-1}}[class*=-start]{-webkit-box-pack:start;justify-content:start}[class*=-end]{-webkit-box-pack:end;justify-content:end}[class*=-center]{-webkit-box-pack:center;justify-content:center}[class*=-space-between]{-webkit-box-pack:justify;justify-content:space-between}[class*=-space-around]{justify-content:space-around}[class*=-space-evenly]{-webkit-box-pack:space-evenly;justify-content:space-evenly}.item-first{-webkit-box-ordinal-group:0;order:-1}.item-last{-webkit-box-ordinal-group:2;order:1}.grid-offset{visibility:hidden}.col-all{grid-column:1/-1}.row-all{grid-row:1/-1}
|
||||
File diff suppressed because it is too large
Load diff
File diff suppressed because one or more lines are too long
2036
package-lock.json
generated
2036
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -37,4 +37,4 @@
|
|||
"postcss-unprefix": "^2.1.4"
|
||||
},
|
||||
"engines": {}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,16 +8,16 @@
|
|||
|
||||
// use these variables only for a standalone Grillade
|
||||
// in KNACSS, you shall modify variables file instead
|
||||
$tiny: 480px !default;
|
||||
$medium: 768px !default;
|
||||
$cols: 12 !default;
|
||||
$tiny : 480px !default;
|
||||
$medium : 768px !default;
|
||||
$large : 992px !default;
|
||||
$cols : 12 !default;
|
||||
|
||||
// classic Grid
|
||||
[class*=" grillade-"],
|
||||
[class^="grillade-"] {
|
||||
@media (min-width: $tiny) {
|
||||
display: grid;
|
||||
grid-auto-flow: dense;
|
||||
|
||||
// gutters
|
||||
@if variable_exists(grid-gutters) {
|
||||
|
|
@ -75,11 +75,30 @@ $cols: 12 !default;
|
|||
}
|
||||
}
|
||||
|
||||
/* intermediate breakpoints */
|
||||
/* medium intermediate breakpoints */
|
||||
// -medium-X suffix means "X columns when < large screen"
|
||||
// example : .grillade-4-medium-2 will be 1 column (< tiny) then 2 columns (< large) then 4 columns
|
||||
@media (min-width: $tiny) and (max-width: ($large - 1)) {
|
||||
@for $i from 1 through 4 {
|
||||
[class*="grillade-"][class*="-medium-#{$i}"] {
|
||||
grid-template-columns: repeat(#{$i}, 1fr);
|
||||
}
|
||||
|
||||
[class*="col-"][class*="-medium-#{$i}"] {
|
||||
grid-column: auto / span #{$i};
|
||||
}
|
||||
}
|
||||
|
||||
[class*="-medium-all"] {
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
}
|
||||
|
||||
/* small intermediate breakpoints */
|
||||
// -small-X suffix means "X columns when < medium screen"
|
||||
// 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{
|
||||
@for $i from 1 through 4 {
|
||||
[class*="grillade-"][class*="-small-#{$i}"] {
|
||||
grid-template-columns: repeat(#{$i}, 1fr);
|
||||
}
|
||||
|
|
@ -94,6 +113,31 @@ $cols: 12 !default;
|
|||
}
|
||||
}
|
||||
|
||||
// grid overall alignment
|
||||
[class*="-start"] {
|
||||
justify-content: start;
|
||||
}
|
||||
|
||||
[class*="-end"] {
|
||||
justify-content: end;
|
||||
}
|
||||
|
||||
[class*="-center"] {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
[class*="-space-between"] {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
[class*="-space-around"] {
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
[class*="-space-evenly"] {
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
// grid order
|
||||
.item-first {
|
||||
order: -1;
|
||||
|
|
|
|||
Loading…
Reference in a new issue