3.06 grids and autogrids RWD fixes

This commit is contained in:
raphaelgoettter 2014-08-19 13:19:37 +02:00
parent 521e568e23
commit 37d96bcd78
8 changed files with 128 additions and 137 deletions

View file

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

File diff suppressed because one or more lines are too long

View file

@ -1,5 +1,5 @@
/*!
* www.KNACSS.com V3.0.5 (2014-07-10) @author: Raphael Goetter, Alsacreations
* www.KNACSS.com V3.0.6 (2014-08-19) @author: Raphael Goetter, Alsacreations
* Licence WTFPL http://www.wtfpl.net/
*/

View file

@ -100,33 +100,6 @@
width: 75%;
}
/* Responsiv-o-matic */
@media (max-width: @large-screen) {
.grid5 > *,
.grid6 > *,
.grid8 > *,
.grid10 > *,
.grid12 > * {
width: 33.333%;
}
}
@media (max-width: @small-screen) {
.grid3 > *,
.grid4 > *,
.grid5 > *,
.grid6 > *,
.grid8 > *,
.grid10 > *,
.grid12 > * {
width: 50%;
}
}
@media (max-width: @tiny-screen) {
.grid > * > * {
width: 100% !important;
}
}
/* ---------------------------------- */
/* ==autogrids */
/* .. to automatically justify blocs */
@ -200,29 +173,3 @@
.autogrid12 > * {
width: 6.4%;
}
@media (max-width: @large-screen) {
.autogrid5 > *,
.autogrid6 > *,
.autogrid8 > *,
.autogrid10 > *,
.autogrid12 > * {
width: 32%;
}
}
@media (max-width: @small-screen) {
.autogrid5 > *,
.autogrid6 > *,
.autogrid8 > *,
.autogrid10 > *,
.autogrid12 > * {
width: 49%;
}
}
@media (max-width: @tiny-screen) {
[class*="autogrid"] > * {
width: 100%;
}
}

View file

@ -80,10 +80,41 @@
.large-man {
margin: 0 !important;
}
/* grid rwd for large screens */
.grid5 > *,
.grid6 > *,
.grid8 > *,
.grid10 > *,
.grid12 > * {
width: 33.333%;
}
/* autogrid rwd for large screens */
.autogrid5 > *,
.autogrid6 > *,
.autogrid8 > *,
.autogrid10 > *,
.autogrid12 > * {
width: 32%;
}
}
@media (max-width: @small-screen) {
/* quick small resolution reset */
.mod,
.col,
fieldset {
display: block !important;
float: none !important;
clear: none !important;
width: auto !important;
margin-left: 0 !important;
margin-right: 0 !important;
border: 0;
}
/* quick reset in small resolution and less */
.w600p,
.w700p,
@ -162,23 +193,30 @@
.small-pan {
padding: 0 !important;
}
/* grid rwd for small screens */
.grid3 > *,
.grid4 > *,
.grid5 > *,
.grid6 > *,
.grid8 > *,
.grid10 > *,
.grid12 > * {
width: 50%;
}
/* autogrid rwd for small screens */
.autogrid5 > *,
.autogrid6 > *,
.autogrid8 > *,
.autogrid10 > *,
.autogrid12 > * {
width: 49% !important;
}
}
@media (max-width: @tiny-screen) {
/* quick tiny resolution reset */
.mod,
.col,
fieldset {
display: block !important;
float: none !important;
clear: none !important;
width: auto !important;
margin-left: 0 !important;
margin-right: 0 !important;
border: 0;
}
.w300p,
.w400p,
.w500p {
@ -272,4 +310,15 @@
.tiny-pan {
padding: 0 !important;
}
/* grid rwd for tiny screens */
.grid > * > * {
width: 100% !important;
}
/* autogrid rwd for tiny screens */
[class*="autogrid"] > * {
width: 100% !important;
}
}

View file

@ -1,5 +1,5 @@
/*!
* www.KNACSS.com V3.0.5 (2014-07-10) @author: Raphael Goetter, Alsacreations (with help from Hugo Giraudel)
* www.KNACSS.com V3.0.6 (2014-08-19) @author: Raphael Goetter, Alsacreations (with help from Hugo Giraudel)
* Licence WTFPL http://www.wtfpl.net/
*/

View file

@ -100,33 +100,6 @@
width: 75%;
}
/* Responsiv-o-matic */
@media (max-width: $large-screen) {
.grid5 > *,
.grid6 > *,
.grid8 > *,
.grid10 > *,
.grid12 > * {
width: 33.333%;
}
}
@media (max-width: $small-screen) {
.grid3 > *,
.grid4 > *,
.grid5 > *,
.grid6 > *,
.grid8 > *,
.grid10 > *,
.grid12 > * {
width: 50%;
}
}
@media (max-width: $tiny-screen) {
.grid > * > * {
width: 100% !important;
}
}
/* ---------------------------------- */
/* ==autogrids */
/* .. to automatically justify blocs */
@ -200,29 +173,3 @@
.autogrid12 > * {
width: 6.4%;
}
@media (max-width: $large-screen) {
.autogrid5 > *,
.autogrid6 > *,
.autogrid8 > *,
.autogrid10 > *,
.autogrid12 > * {
width: 32%;
}
}
@media (max-width: $small-screen) {
.autogrid5 > *,
.autogrid6 > *,
.autogrid8 > *,
.autogrid10 > *,
.autogrid12 > * {
width: 49%;
}
}
@media (max-width: $tiny-screen) {
[class*="autogrid"] > * {
width: 100%;
}
}

View file

@ -80,10 +80,41 @@
.large-man {
margin: 0 !important;
}
/* grid rwd for large screens */
.grid5 > *,
.grid6 > *,
.grid8 > *,
.grid10 > *,
.grid12 > * {
width: 33.333%;
}
/* autogrid rwd for large screens */
.autogrid5 > *,
.autogrid6 > *,
.autogrid8 > *,
.autogrid10 > *,
.autogrid12 > * {
width: 32%;
}
}
@media (max-width: $small-screen) {
/* quick small resolution reset */
.mod,
.col,
fieldset {
display: block !important;
float: none !important;
clear: none !important;
width: auto !important;
margin-left: 0 !important;
margin-right: 0 !important;
border: 0;
}
/* quick reset in small resolution and less */
.w600p,
.w700p,
@ -162,23 +193,30 @@
.small-pan {
padding: 0 !important;
}
/* grid rwd for small screens */
.grid3 > *,
.grid4 > *,
.grid5 > *,
.grid6 > *,
.grid8 > *,
.grid10 > *,
.grid12 > * {
width: 50%;
}
/* autogrid rwd for small screens */
.autogrid5 > *,
.autogrid6 > *,
.autogrid8 > *,
.autogrid10 > *,
.autogrid12 > * {
width: 49% !important;
}
}
@media (max-width: $tiny-screen) {
/* quick tiny resolution reset */
.mod,
.col,
fieldset {
display: block !important;
float: none !important;
clear: none !important;
width: auto !important;
margin-left: 0 !important;
margin-right: 0 !important;
border: 0;
}
.w300p,
.w400p,
.w500p {
@ -270,4 +308,14 @@
.tiny-pan {
padding: 0 !important;
}
/* grid rwd for tiny screens */
.grid > * > * {
width: 100% !important;
}
/* autogrid rwd for tiny screens */
[class*="autogrid"] > * {
width: 100% !important;
}
}