3.06 grids and autogrids RWD fixes
This commit is contained in:
raphaelgoettter
parent
521e568e23
commit
37d96bcd78
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "KNACSS",
|
"name": "KNACSS",
|
||||||
"version": "3.0.5",
|
"version": "3.0.6",
|
||||||
"homepage": "http://www.knacss.com/",
|
"homepage": "http://www.knacss.com/",
|
||||||
"authors": [
|
"authors": [
|
||||||
"Raphaël GOETTER, Alsacreations"
|
"Raphaël GOETTER, Alsacreations"
|
||||||
|
|||||||
File diff suppressed because one or more lines are too long
@ -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/
|
* Licence WTFPL http://www.wtfpl.net/
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
|||||||
@ -100,33 +100,6 @@
|
|||||||
width: 75%;
|
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 */
|
/* ==autogrids */
|
||||||
/* .. to automatically justify blocs */
|
/* .. to automatically justify blocs */
|
||||||
@ -200,29 +173,3 @@
|
|||||||
.autogrid12 > * {
|
.autogrid12 > * {
|
||||||
width: 6.4%;
|
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%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|||||||
@ -80,10 +80,41 @@
|
|||||||
.large-man {
|
.large-man {
|
||||||
margin: 0 !important;
|
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) {
|
@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 */
|
/* quick reset in small resolution and less */
|
||||||
.w600p,
|
.w600p,
|
||||||
.w700p,
|
.w700p,
|
||||||
@ -162,23 +193,30 @@
|
|||||||
.small-pan {
|
.small-pan {
|
||||||
padding: 0 !important;
|
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) {
|
@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,
|
.w300p,
|
||||||
.w400p,
|
.w400p,
|
||||||
.w500p {
|
.w500p {
|
||||||
@ -272,4 +310,15 @@
|
|||||||
.tiny-pan {
|
.tiny-pan {
|
||||||
padding: 0 !important;
|
padding: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* grid rwd for tiny screens */
|
||||||
|
.grid > * > * {
|
||||||
|
width: 100% !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* autogrid rwd for tiny screens */
|
||||||
|
[class*="autogrid"] > * {
|
||||||
|
width: 100% !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -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/
|
* Licence WTFPL http://www.wtfpl.net/
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
|||||||
@ -100,33 +100,6 @@
|
|||||||
width: 75%;
|
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 */
|
/* ==autogrids */
|
||||||
/* .. to automatically justify blocs */
|
/* .. to automatically justify blocs */
|
||||||
@ -200,29 +173,3 @@
|
|||||||
.autogrid12 > * {
|
.autogrid12 > * {
|
||||||
width: 6.4%;
|
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%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|||||||
@ -80,10 +80,41 @@
|
|||||||
.large-man {
|
.large-man {
|
||||||
margin: 0 !important;
|
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) {
|
@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 */
|
/* quick reset in small resolution and less */
|
||||||
.w600p,
|
.w600p,
|
||||||
.w700p,
|
.w700p,
|
||||||
@ -162,23 +193,30 @@
|
|||||||
.small-pan {
|
.small-pan {
|
||||||
padding: 0 !important;
|
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) {
|
@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,
|
.w300p,
|
||||||
.w400p,
|
.w400p,
|
||||||
.w500p {
|
.w500p {
|
||||||
@ -270,4 +308,14 @@
|
|||||||
.tiny-pan {
|
.tiny-pan {
|
||||||
padding: 0 !important;
|
padding: 0 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* grid rwd for tiny screens */
|
||||||
|
.grid > * > * {
|
||||||
|
width: 100% !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* autogrid rwd for tiny screens */
|
||||||
|
[class*="autogrid"] > * {
|
||||||
|
width: 100% !important;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user