dbroqua/KNACSS
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

modifications des breakpoints

Browse source
This commit is contained in:
Raphael Goetter 2016-12-01 15:45:23 +01:00
parent 725124d380
commit 204d870d31
10 changed files with 58 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
bower.json
View file

@ -1,6 +1,6 @@
{
"name": "KNACSS",
"version": "6.0.4",
"version": "6.0.5",
"homepage": "http://www.knacss.com/",
"authors": [
"Raphaël GOETTER, Alsacreations"

3
changelog.md
View file

@ -1,3 +1,6 @@
# changelog v6.0.5 (1er décembre 2016)
- redéfinition des variables de breakpoints, à présent calées sur [celles de Bootstrap](https://v4-alpha.getbootstrap.com/layout/overview/#responsive-breakpoints)
# changelog v6.0.4 (22 novembre 2016)
- renommage des variables

2
css/grillade.css
View file

File diff suppressed because one or more lines are too long

10
css/grillade.scss
View file

@ -2,11 +2,11 @@
// Warning : you should use your own values, regardless of the devices
// Best practise : (max-width: $BP) and (min-width: ($BP + 1))
$tiny: 544px !default; // or 'em' if you prefer, of course
$small: 768px !default;
$medium: 1024px !default;
$large: 1200px !default;
$extra-large: 1440px !default;
$tiny: 543px !default; // or 'em' if you prefer, of course
$small: 767px !default;
$medium: 991px !default;
$large: 1199px !default;
$extra-large: 1439px !default;
/* ---------------------------------- */
/* ==Grillade : Simple Grid System */

32
css/knacss-unminified.css
View file

@ -1,6 +1,6 @@
@charset "UTF-8";
/*!
* www.KNACSS.com V6.0.4 (22 novembre 2016) @author: Alsacreations, Raphael Goetter
* www.KNACSS.com V6.0.5 (1er décembre 2016) @author: Alsacreations, Raphael Goetter
* Licence WTFPL http://www.wtfpl.net/
*/
/* ----------------------------- */
@ -737,7 +737,7 @@ th {
overflow: visible;
clip: auto; }
@media (max-width: 544px) {
@media (max-width: 543px) {
/* you shall not pass */
div,
textarea,
@ -752,7 +752,7 @@ th {
-ms-hyphens: auto;
hyphens: auto; } }
@media (max-width: 544px) {
@media (max-width: 543px) {
.no-wrapping {
word-wrap: normal;
-webkit-hyphens: manual;
@ -884,7 +884,7 @@ input[type="reset"].unstyled {
outline: none; }
/* Media object */
@media (min-width: 545px) {
@media (min-width: 544px) {
.o-media {
display: -webkit-box;
display: -ms-flexbox;
@ -900,7 +900,7 @@ input[type="reset"].unstyled {
/* avoid min-width:auto */ } }
/* Media variants */
@media (min-width: 545px) {
@media (min-width: 544px) {
.o-media--reverse {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
@ -911,7 +911,7 @@ input[type="reset"].unstyled {
align-self: center; } }
/* Autogrid object */
@media (min-width: 545px) {
@media (min-width: 544px) {
[class^="autogrid"],
[class*=" autogrid"] {
display: -webkit-box;
@ -926,7 +926,7 @@ input[type="reset"].unstyled {
/* avoid min-width:auto */ } }
/* Autogrid variants */
@media (min-width: 545px) {
@media (min-width: 544px) {
.has-gutter > *:not(:first-child) {
margin-left: 1rem; }
[class*="--reverse"] {
@ -1320,7 +1320,7 @@ ul.unstyled {
/* -------------------------- */
/* large screens */
/* ------------- */
@media (min-width: 1025px) {
@media (min-width: 992px) {
/* layouts for large screens */
.large-hidden {
display: none !important; }
@ -1359,7 +1359,7 @@ ul.unstyled {
/* medium screens */
/* -------------- */
@media (min-width: 769px) and (max-width: 1200px) {
@media (min-width: 768px) and (max-width: 1199px) {
/* layouts for medium screens */
.medium-hidden {
display: none !important; }
@ -1398,7 +1398,7 @@ ul.unstyled {
/* small screens */
/* ------------- */
@media (min-width: 545px) and (max-width: 768px) {
@media (min-width: 544px) and (max-width: 767px) {
/* layouts for small screens */
.small-hidden {
display: none !important; }
@ -1440,7 +1440,7 @@ ul.unstyled {
/* tiny screens */
/* ------------ */
@media (max-width: 544px) {
@media (max-width: 543px) {
/* quick small resolution reset */
.mod,
.col,
@ -1500,7 +1500,7 @@ ul.unstyled {
/* ==Grillade : Simple Grid System */
/* ---------------------------------- */
/* Doc : http://grillade.knacss.com */
@media (min-width: 545px) {
@media (min-width: 544px) {
[class*=" grid-"],
[class^="grid-"] {
display: -webkit-box;
@ -1518,7 +1518,7 @@ ul.unstyled {
min-width: 0;
min-height: 0; } }
@media (min-width: 545px) {
@media (min-width: 544px) {
.grid,
.grid--reverse {
display: -webkit-box;
@ -1542,7 +1542,7 @@ ul.unstyled {
.grid--reverse.has-gutter-xl > * + * {
margin-left: calc(4rem - 0.01px); } }
@media (min-width: 545px) {
@media (min-width: 544px) {
[class*="grid-2"] > * {
width: calc(100% / 2 - 0.01px); }
[class*="grid-2"].has-gutter {
@ -1819,7 +1819,7 @@ ul.unstyled {
-ms-flex-direction: row-reverse;
flex-direction: row-reverse; }
@media (min-width: 545px) {
@media (min-width: 544px) {
.full {
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
@ -1921,7 +1921,7 @@ ul.unstyled {
width: calc(100% / 6 * 5 - 4rem - 0.01px); } }
/* Responsive Small Breakpoint */
@media (min-width: 545px) and (max-width: 768px) {
@media (min-width: 544px) and (max-width: 767px) {
[class*="-small-1"] > * {
width: calc(100% / 1 - 0.01px); }
[class*="-small-1"].has-gutter > * {

4
css/knacss.css
View file

File diff suppressed because one or more lines are too long

2
package.json
View file

@ -1,6 +1,6 @@
{
"name": "knacss",
"version": "6.0.4",
"version": "6.0.5",
"homepage": "http://www.knacss.com/",
"bugs": "https://github.com/alsacreations/KNACSS/issues",
"author": [

10
sass/_config/_breakpoints.scss
View file

@ -2,8 +2,8 @@
// Warning : you should use your own values, regardless of the devices
// Best practise : (max-width: $BP) and (min-width: ($BP + 1))
$tiny: 544px !default; // or 'em' if you prefer, of course
$small: 768px !default;
$medium: 1024px !default;
$large: 1200px !default;
$extra-large: 1440px !default;
$tiny: 543px !default; // or 'em' if you prefer, of course
$small: 767px !default;
$medium: 991px !default;
$large: 1199px !default;
$extra-large: 1439px !default;

40
sass/_config/_mixins.scss
View file

@ -1,30 +1,36 @@
// Additionnal "utility" breakpoints aliases
// ex. @include respond-to("portrait-up") {...}
// ex. @include respond-to("medium-up") {...}
@function breakpoint($bp) {
@if $bp == 'mobile' {
@if $bp == 'tiny' {
@return '(max-width: #{$tiny})';
}
@else if $bp == 'portrait' {
@return '(min-width: #{$tiny + 1}) and (max-width: #{$small})';
}
@else if $bp == 'landscape' {
@return '(min-width: #{$small + 1}) and (max-width: #{$medium})';
}
@else if $bp == 'desktop' {
@return '(min-width: #{$medium + 1})';
}
@else if $bp == 'portrait-down' {
@else if $bp == 'small' {
@return '(max-width: #{$small})';
}
@else if $bp == 'portrait-up' {
@return '(min-width: #{$tiny + 1})';
}
@else if $bp == 'landscape-down' {
@else if $bp == 'medium' {
@return '(max-width: #{$medium})';
}
@else if $bp == 'landscape-up' {
@else if $bp == 'large' {
@return '(max-width: #{$large})';
}
@else if $bp == 'extra-large' {
@return '(max-width: #{$extra-large})';
}
@else if $bp == 'tiny-up' {
@return '(min-width: #{$tiny + 1})';
}
@else if $bp == 'small-up' {
@return '(min-width: #{$small + 1})';
}
@else if $bp == 'medium-up' {
@return '(min-width: #{$medium + 1})';
}
@else if $bp == 'large-up' {
@return '(min-width: #{$large + 1})';
}
@else if $bp == 'extra-large-up' {
@return '(min-width: #{$extra-large + 1})';
}
@else if $bp == 'retina' {
@return '(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi), (min-resolution: 2dppx)';
}

2
sass/knacss.scss
View file

@ -1,5 +1,5 @@
/*!
* www.KNACSS.com V6.0.4 (22 novembre 2016) @author: Alsacreations, Raphael Goetter
* www.KNACSS.com V6.0.5 (1er décembre 2016) @author: Alsacreations, Raphael Goetter
* Licence WTFPL http://www.wtfpl.net/
*/