gestion de conflit des classes .grid-item-*

This commit is contained in:
Raphael Goetter 2016-11-10 16:45:11 +01:00
parent 5d7ce42692
commit 4eec65bf89
9 changed files with 24 additions and 22 deletions

View file

@ -1,3 +1,6 @@
# changelog v6.0.3 (10 novembre 2016)
- renommage `grid-item-*` en `item-*` pour éviter [les conflits](https://github.com/alsacreations/KNACSS/issues/222)
# changelog v6.0.2 (27 octobre 2016)
- optimisation de la grille (de 8ko à 3ko pour la version Sass)

File diff suppressed because one or more lines are too long

View file

@ -95,11 +95,11 @@ $iefix: 0.01px;
margin-right: auto !important;
}
// Grid order
.grid-item-first {
.item-first {
order: -1;
}
.grid-item-last {
.item-last {
order: 1;
}

View file

@ -1,6 +1,6 @@
@charset "UTF-8";
/*!
* www.KNACSS.com V6.0.2 (27 octobre 2016) @author: Alsacreations, Raphael Goetter
* www.KNACSS.com V6.0.3 (31 octobre 2016) @author: Alsacreations, Raphael Goetter
* Licence WTFPL http://www.wtfpl.net/
*/
/* ----------------------------- */
@ -908,7 +908,6 @@ input[type="reset"].unstyled {
flex-direction: row-reverse; }
.o-media-figure--center {
-ms-flex-item-align: center;
-ms-grid-row-align: center;
align-self: center; } }
/* Autogrid object */
@ -1028,25 +1027,25 @@ http://www.alsacreations.com/tuto/lire/1493-css3-flexbox-layout-module.html
min-width: 0; }
.flex-item-first,
.grid-item-first {
.item-first {
-webkit-box-ordinal-group: 0;
-ms-flex-order: -1;
order: -1; }
.flex-item-medium,
.grid-item-medium {
.item-medium {
-webkit-box-ordinal-group: 1;
-ms-flex-order: 0;
order: 0; }
.flex-item-last,
.grid-item-last {
.item-last {
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1; }
.flex-item-center,
.grid-item-center {
.item-center {
margin: auto; }
/* ---------------------------------- */
@ -1799,12 +1798,12 @@ ul.unstyled {
.pull {
margin-right: auto !important; }
.grid-item-first {
.item-first {
-webkit-box-ordinal-group: 0;
-ms-flex-order: -1;
order: -1; }
.grid-item-last {
.item-last {
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1; }

File diff suppressed because one or more lines are too long

View file

@ -18,7 +18,7 @@ Grillade a les caractéristiques globales suivantes :
Spécificités techniques :
- Grillade est basé sur CSS3 Flexbox, ce qui le rend incompatible avec les anciennes versions d'Internet Explorer (IE9 inclus) ainsi que certains anciens navigateurs (Android <4.4 par exemple)
- Grillade est basé sur CSS3 Flexbox, ce qui le rend incompatible avec les anciennes versions d'Internet Explorer (IE9 inclus) ainsi que certains anciens navigateurs (Android &lt;4.4 par exemple)
- Les préfixes CSS3 (`-webkit-`, `-moz-`, `-ms-`, …) sont pris en charge au sein de la version CSS de Grillade, mais pas dans sa version Sass. Il vous sera donc nécessaire de les ajouter, de préférence automatiquement grâce à l'excellent outil autoprefixer.
- Les valeurs par défaut des points de rupture responsive (Breakpoints) de Grillade sont : `$tiny = 544px` et `$small = 768px`, vous pouvez modifier ou ajouter des valeurs dans la version Sass.

View file

@ -15,8 +15,8 @@ $font-stack-common : sans-serif !default; // common font
$font-stack-headings : sans-serif !default; // headings font
$font-stack-monospace : consolas, courier, monospace !default; // monospace font
// font colors
$base-color : #000 !default; // text color on body and content
// colors (content and/or backgrounds)
$base-color : #000 !default;
$alpha-color : #fff !default;
$beta-color : #333 !default;
$gamma-color : #000 !default;

View file

@ -85,11 +85,11 @@ $iefix: 0.01px;
margin-right: auto !important;
}
// Grid order
.grid-item-first {
.item-first {
order: -1;
}
.grid-item-last {
.item-last {
order: 1;
}

View file

@ -102,21 +102,21 @@ http://www.alsacreations.com/tuto/lire/1493-css3-flexbox-layout-module.html
}
.#{$kna-namespace}flex-item-first,
.#{$kna-namespace}grid-item-first {
.#{$kna-namespace}item-first {
order : -1;
}
.#{$kna-namespace}flex-item-medium,
.#{$kna-namespace}grid-item-medium {
.#{$kna-namespace}item-medium {
order : 0;
}
.#{$kna-namespace}flex-item-last,
.#{$kna-namespace}grid-item-last {
.#{$kna-namespace}item-last {
order : 1;
}
.#{$kna-namespace}flex-item-center,
.#{$kna-namespace}grid-item-center {
.#{$kna-namespace}item-center {
margin: auto;
}