diff --git a/changelog.md b/changelog.md index 23de528..fa6fc80 100644 --- a/changelog.md +++ b/changelog.md @@ -1,6 +1,8 @@ # changelog v6.0.0 (21 septembre 2016) - suppression de include-media (crée des bugs d'encodage, nécessite un temps d'apprentissage, et n'apporte pas grand chose au final). - refonte des valeurs des Breakpoints et des classes responsive. +- modularisation des fichiers et dossiers, classés par fonctions (config, vendor, library, objects, utility) +- ajout des objects courants : media et autogrid # changelog v5.0.1 (24 mai 2016) - les helpers de largeurs deviennent mobile-first et ne s'activent que sur écran d'une certaine taille. Ex. `.w700p {width: 700px;}` devient `@include media('>640px') {.w700p {width: 700px;}}`. Ainsi il n'est plus nécessaire de les écraser dans la feuille de style responsive. diff --git a/sass/_layout-grids.scss b/sass/grids/_grillade.scss similarity index 100% rename from sass/_layout-grids.scss rename to sass/grids/_grillade.scss diff --git a/sass/knacss.scss b/sass/knacss.scss index b863a44..42ebd79 100644 --- a/sass/knacss.scss +++ b/sass/knacss.scss @@ -33,25 +33,25 @@ @import "_config/_breakpoints.scss"; @import "_config/_mixins.scss"; - // Libraries -@import "_library-base.scss"; // basic styles -@import "_library-print.scss"; // print quick reset -@import "_library-styling.scss"; // minor stylings -@import "_library-misc.scss"; // skip links, hyphens -// @import "_library-wordpress.scss"; // WordPress reset and basic styles - -// Layout -@import "_layout-general.scss"; // alignment, modules, positionning -@import "_layout-grids.scss"; // grids +@import "library/_base.scss"; // basic styles +@import "library/_print.scss"; // print quick reset +@import "library/_styling.scss"; // minor stylings +@import "library/_misc.scss"; // skip links, hyphens +@import "library/_tables.scss"; // data tables consistency +@import "library/_forms.scss"; // forms consistency // Objects -@import "_object-tables.scss"; // data tables consistency -@import "_object-forms.scss"; // forms consistency +@import "objects/_media.scss"; // media object -// Overrides -@import "_override-helpers.scss"; // width and spacers helpers -@import "_override-responsive.scss"; // Responsive Web Design helpers +// Utilities +@import "utilities/_layout.scss"; // alignment, modules, positionning +@import "utilities/_helpers.scss"; // width and spacers helpers +// @import "utilities/_wordpress.scss"; // WordPress reset and basic styles +@import "utilities/_responsive.scss"; // Responsive Web Design helpers + +// Grids +@import "grids/_grillade.scss"; // grids /* ----------------------------- */ diff --git a/sass/_library-base.scss b/sass/library/_base.scss similarity index 100% rename from sass/_library-base.scss rename to sass/library/_base.scss diff --git a/sass/_object-forms.scss b/sass/library/_forms.scss similarity index 100% rename from sass/_object-forms.scss rename to sass/library/_forms.scss diff --git a/sass/_library-misc.scss b/sass/library/_misc.scss similarity index 100% rename from sass/_library-misc.scss rename to sass/library/_misc.scss diff --git a/sass/_library-print.scss b/sass/library/_print.scss similarity index 100% rename from sass/_library-print.scss rename to sass/library/_print.scss diff --git a/sass/_library-styling.scss b/sass/library/_styling.scss similarity index 100% rename from sass/_library-styling.scss rename to sass/library/_styling.scss diff --git a/sass/_object-tables.scss b/sass/library/_tables.scss similarity index 100% rename from sass/_object-tables.scss rename to sass/library/_tables.scss diff --git a/sass/objects/_autogrid.scss b/sass/objects/_autogrid.scss new file mode 100644 index 0000000..feb6a57 --- /dev/null +++ b/sass/objects/_autogrid.scss @@ -0,0 +1,22 @@ +/* Autogrid object */ +@media (min-width: ($tiny + 1)) { + [class^="autogrid"], + [class*=" autogrid"] { + display: flex; + } + [class^="autogrid"] > *, + [class*=" autogrid"] > * { + flex: 1; + min-width: 0; /* avoid min-width:auto */ + } +} + +/* Autogrid variants */ +@media (min-width: ($tiny + 1)) { + .has-gutter > *:not(:first-child) { + margin-left: 1rem; + } + [class*="--reverse"] { + flex-direction: row-reverse; + } +} diff --git a/sass/objects/_media.scss b/sass/objects/_media.scss new file mode 100644 index 0000000..53ec75d --- /dev/null +++ b/sass/objects/_media.scss @@ -0,0 +1,21 @@ +/* Media object */ +@media (min-width: ($tiny + 1)) { + .o-media { + display: flex; + align-items: flex-start; + } + .o-media-content { + flex: 1; + min-width: 0; /* avoid min-width:auto */ + } +} + +/* Media variants */ +@media (min-width: ($tiny + 1)) { + .o-media--reverse { + flex-direction: row-reverse; + } + .o-media-figure--center { + align-self: center; + } +} diff --git a/sass/_override-helpers.scss b/sass/utilities/_helpers.scss similarity index 100% rename from sass/_override-helpers.scss rename to sass/utilities/_helpers.scss diff --git a/sass/_layout-general.scss b/sass/utilities/_layout.scss similarity index 100% rename from sass/_layout-general.scss rename to sass/utilities/_layout.scss diff --git a/sass/_override-responsive.scss b/sass/utilities/_responsive.scss similarity index 100% rename from sass/_override-responsive.scss rename to sass/utilities/_responsive.scss diff --git a/sass/_library-wordpress.scss b/sass/utilities/_wordpress.scss similarity index 100% rename from sass/_library-wordpress.scss rename to sass/utilities/_wordpress.scss