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

summer refreshing

This commit is contained in:
raphaelgoetter 2013-08-01 08:56:52 +02:00
parent a1b4fd6b05
commit 6d1bd3f825
2 changed files with 99 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
css/knacss.css
View File

@ -1,10 +1,10 @@
/* /*
* www.KNACSS.com V2.6k @author: Raphael Goetter, Alsacreations * www.KNACSS.com V2.6l @author: Raphael Goetter, Alsacreations
* Licence CC-BY http://creativecommons.org/licenses/by/3.0/fr/ * Licence CC-BY http://creativecommons.org/licenses/by/3.0/fr/
*/ */
/* ----------------------------- */ /* ----------------------------- */
/* ==reset */ /* ==reset */
/* ----------------------------- */ /* ----------------------------- */
/* base font-size corresponds to 10px and is adapted to rem unit */ /* base font-size corresponds to 10px and is adapted to rem unit */
@ -125,6 +125,11 @@ em {
strong { strong {
font-weight: bold; font-weight: bold;
} }
i,
b {
font-style: normal;
font-weight: normal;
}
kbd { kbd {
padding: 0 2px; padding: 0 2px;
border: 1px solid #999; border: 1px solid #999;
@ -211,7 +216,7 @@ body > script {display: none !important;}
} }
/* ----------------------------- */ /* ----------------------------- */
/* ==layout and modules */ /* ==layout and modules */
/* ----------------------------- */ /* ----------------------------- */
/* switching box model for all elements */ /* switching box model for all elements */
@ -222,8 +227,8 @@ body > script {display: none !important;}
} }
/* float layout */ /* float layout */
/* module, contains floats (.item is the same) */ /* module, gains superpower "BFC" Block Formating Context */
.mod, .item { .mod {
overflow: hidden; overflow: hidden;
} }
@ -294,11 +299,11 @@ img.left, img.right {
.w20 { width: 20%; } .w20 { width: 20%; }
.w25 { width: 25%; } .w25 { width: 25%; }
.w30 { width: 30%; } .w30 { width: 30%; }
.w33 { width: 33.333%; } .w33 { width: 33.3333%; }
.w40 { width: 40%; } .w40 { width: 40%; }
.w50 { width: 50%; } .w50 { width: 50%; }
.w60 { width: 60%; } .w60 { width: 60%; }
.w66 { width: 66.666%; } .w66 { width: 66.6666%; }
.w70 { width: 70%; } .w70 { width: 70%; }
.w75 { width: 75%; } .w75 { width: 75%; }
.w80 { width: 80%; } .w80 { width: 80%; }
@ -383,19 +388,7 @@ source https://github.com/stubbornella/oocss/blob/master/core/spacing/space.css
.desktop-hidden { display: none; } /* hidden on desktop */ .desktop-hidden { display: none; } /* hidden on desktop */
/* ----------------------------- */ /* ----------------------------- */
/* ==header */ /* ==forms */
/* ----------------------------- */
/* ----------------------------- */
/* ==sidebar */
/* ----------------------------- */
/* ----------------------------- */
/* ==footer */
/* ----------------------------- */
/* ----------------------------- */
/* ==forms */
/* ----------------------------- */ /* ----------------------------- */
form, form,
fieldset { fieldset {
@ -415,11 +408,17 @@ textarea {
} }
/* ----------------------------- */ /* ----------------------------- */
/* ==main */ /* ==own stylesheet */
/* ----------------------------- */ /* ----------------------------- */
/* Here should go your own CSS styles */
/* You can link them with an @import or, better for webperf, just paste them here */
/* @import url(my-styles.css); */
/* ----------------------------- */ /* ----------------------------- */
/* ==iefix */ /* ==iefix */
/* ----------------------------- */ /* ----------------------------- */
/* hasLayout for IE6/IE7 */ /* hasLayout for IE6/IE7 */
@ -452,7 +451,7 @@ textarea {
*/ */
/* ----------------------------- */ /* ----------------------------- */
/* ==print */ /* ==print */
/* ----------------------------- */ /* ----------------------------- */
/* quick print reset */ /* quick print reset */

103
less/knacss.less
View File

@ -1,5 +1,5 @@
/* /*
* www.KNACSS.com V2.6i @author: Raphael Goetter, Alsacreations * www.KNACSS.com V2.6l @author: Raphael Goetter, Alsacreations
* Licence CC-BY http://creativecommons.org/licenses/by/3.0/fr/ * Licence CC-BY http://creativecommons.org/licenses/by/3.0/fr/
*/ */
@ -30,9 +30,8 @@
margin-bottom: 0; margin-bottom: 0;
} }
/* ----------------------------- */ /* ----------------------------- */
/* ==reset */ /* ==reset */
/* ----------------------------- */ /* ----------------------------- */
/* base font-size corresponds to 10px and is adapted to rem unit */ /* base font-size corresponds to 10px and is adapted to rem unit */
@ -140,6 +139,11 @@ em {
strong { strong {
font-weight: bold; font-weight: bold;
} }
i,
b {
font-style: normal;
font-weight: normal;
}
kbd { kbd {
padding: 0 2px; padding: 0 2px;
border: 1px solid #999; border: 1px solid #999;
@ -210,7 +214,7 @@ body > script {display: none !important;}
} }
/* ----------------------------- */ /* ----------------------------- */
/* ==layout and modules */ /* ==layout and modules */
/* ----------------------------- */ /* ----------------------------- */
/* switching box model for all elements */ /* switching box model for all elements */
@ -221,8 +225,8 @@ body > script {display: none !important;}
} }
/* float layout */ /* float layout */
/* module, contains floats (.item is the same) */ /* module, gains superpower "BFC" Block Formating Context */
.mod, .item { .mod {
overflow: hidden; overflow: hidden;
} }
@ -342,10 +346,10 @@ img.left, img.right {
.txtright { text-align: right; } .txtright { text-align: right; }
.txtcenter { text-align: center; } .txtcenter { text-align: center; }
/* grids */ /* grids */
/* ------------------------------ */ /* ------------------------------ */
[class*=grid] > * {float: left; } /* direct childrens are floating */ [class^=grid] > * {float: left; } /* direct childrens are floating */
.grid2 > * {.grid(2);} .grid2 > * {.grid(2);}
.grid3 > * {.grid(3);} .grid3 > * {.grid(3);}
@ -381,16 +385,69 @@ img.left, img.right {
width: (100%-@gutter) * 3 / 4; width: (100%-@gutter) * 3 / 4;
} }
/* ----------------------------- */
/* ==autogrids */
/* ----------------------------- */
/* auto-justified equal grids */
[class^="autogrid"] {
text-align: justify;
font-size: 1px; letter-spacing: -1px; /* whitespace fi xpart 1 */
}
[class^="autogrid"]:after {
content: "";
display: inline-block;
width: 100%;
}
[class^="autogrid"] > * {
display: inline-block;
vertical-align: top;
text-align: left;
font-size: 14em; font-size: 1.4rem; letter-spacing: normal; /* whitespace fix part 2 */
*display: inline; *zoom: 1; /* ie6 / ie7 hack */
}
.autogrid2 > * {width: 49.55%}
.autogrid3 > * {width: 32.8%}
.autogrid4 > * {width: 24.4%}
.autogrid5 > * {width: 19.4%}
.autogrid6 > * {width: 16%}
.autogrid8 > * {width: 11.75%}
.autogrid10 > * {width: 9.3%}
.autogrid12 > * {width: 7.6%}
/* Responsiv-o-matic */
@media (max-width: @largescreen) {
.autogrid5 > *,
.autogrid6 > *,
.autogrid8 > *,
.autogrid10 > *,
.autogrid12 > * {width: 32.8%}
}
@media (max-width: @mediumscreen) {
.autogrid3 > *,
.autogrid4 > *,
.autogrid5 > *,
.autogrid6 > *,
.autogrid8 > *,
.autogrid10 > *,
.autogrid12 > * {width: 49.55%}
}
@media (max-width: @tinyscreen) {
[class^="autogrid"] > * {width: 100%}
}
/* blocks widths (percentage and pixels) */ /* blocks widths (percentage and pixels) */
.w10 { width: 10%; } .w10 { width: 10%; }
.w20 { width: 20%; } .w20 { width: 20%; }
.w25 { width: 25%; } .w25 { width: 25%; }
.w30 { width: 30%; } .w30 { width: 30%; }
.w33 { width: 33.333%; } .w33 { width: 33.3333%; }
.w40 { width: 40%; } .w40 { width: 40%; }
.w50 { width: 50%; } .w50 { width: 50%; }
.w60 { width: 60%; } .w60 { width: 60%; }
.w66 { width: 66.666%; } .w66 { width: 66.6666%; }
.w70 { width: 70%; } .w70 { width: 70%; }
.w75 { width: 75%; } .w75 { width: 75%; }
.w80 { width: 80%; } .w80 { width: 80%; }
@ -476,19 +533,7 @@ source https://github.com/stubbornella/oocss/blob/master/core/spacing/space.css
.mobile-hidden { display: block; } .mobile-hidden { display: block; }
/* ----------------------------- */ /* ----------------------------- */
/* ==header */ /* ==forms */
/* ----------------------------- */
/* ----------------------------- */
/* ==sidebar */
/* ----------------------------- */
/* ----------------------------- */
/* ==footer */
/* ----------------------------- */
/* ----------------------------- */
/* ==forms */
/* ----------------------------- */ /* ----------------------------- */
form, form,
fieldset { fieldset {
@ -508,11 +553,17 @@ textarea {
} }
/* ----------------------------- */ /* ----------------------------- */
/* ==main */ /* ==own stylesheet */
/* ----------------------------- */ /* ----------------------------- */
/* Here should go your own CSS styles */
/* You can link them with an @import or, better for webperf, just paste them here */
/* @import url(my-styles.css); */
/* ----------------------------- */ /* ----------------------------- */
/* ==iefix */ /* ==iefix */
/* ----------------------------- */ /* ----------------------------- */
/* haslayout for IE6/IE7 */ /* haslayout for IE6/IE7 */
@ -545,7 +596,7 @@ textarea {
*/ */
/* ----------------------------- */ /* ----------------------------- */
/* ==print */ /* ==print */
/* ----------------------------- */ /* ----------------------------- */
/* quick print reset */ /* quick print reset */