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

Merge branch 'master' into sass-grid-gutter

Browse source
This commit is contained in:
dsoriano 2016-04-13 22:13:56 +02:00
commit 139833e5aa
14 changed files with 519 additions and 578 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", "name": "KNACSS",
"version": "4.4.4", "version": "4.4.5",
"homepage": "http://www.knacss.com/", "homepage": "http://www.knacss.com/",
"authors": [ "authors": [
"Raphaël GOETTER, Alsacreations" "Raphaël GOETTER, Alsacreations"

6
changelog.md
View file

@ -1,3 +1,9 @@
# changelog v4.4.5 (1er avril 2016)
- mise à jour vers Normalize 4 : https://github.com/necolas/normalize.css/blob/4.0.0/CHANGELOG.md
- application de min-width: 0 sur les flex-item-fluid pour éviter les minimum automatiques des flex-items
- suppression des styles spécifiques à Gmap (sélecteurs trop lourds pour un cas très particuliers)
# changelog v4.4.4 (23 janvier 2016) # changelog v4.4.4 (23 janvier 2016)
- mise à jour vers Normalize 3.0.3 : https://github.com/necolas/normalize.css/ - mise à jour vers Normalize 3.0.3 : https://github.com/necolas/normalize.css/

339
css/knacss-unminified.css
View file

@ -1,12 +1,11 @@
/*! /*!
* www.KNACSS.com V4.4.4 (23 janvier 2016) @author: Raphael Goetter, Alsacreations * www.KNACSS.com V4.4.5 (1er avril 2016) @author: Raphael Goetter, Alsacreations
* Licence WTFPL http://www.wtfpl.net/ * Licence WTFPL http://www.wtfpl.net/
*/ */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ /*! normalize.css v4.0.0 | MIT License | github.com/necolas/normalize.css */
/** /**
* 1. Set default font family to sans-serif. * 1. Change the default font family in all browsers (opinionated).
* 2. Prevent iOS and IE text size adjust after device orientation change, * 2. Prevent adjustments of font size after orientation changes in IE and iOS.
* without disabling user zoom.
*/ */
html { html {
font-family: sans-serif; font-family: sans-serif;
@ -17,7 +16,7 @@ html {
/* 2 */ /* 2 */
} }
/** /**
* Remove default margin. * Remove the margin in all browsers (opinionated).
*/ */
body { body {
margin: 0; margin: 0;
@ -25,10 +24,9 @@ body {
/* HTML5 display definitions /* HTML5 display definitions
========================================================================== */ ========================================================================== */
/** /**
* Correct `block` display not defined for any HTML5 element in IE 8/9. * Add the correct display in IE 9-.
* Correct `block` display not defined for `details` or `summary` in IE 10/11 * 1. Add the correct display in Edge, IE, and Firefox.
* and Firefox. * 2. Add the correct display in IE.
* Correct `block` display not defined for `main` in IE 11.
*/ */
article, article,
aside, aside,
@ -42,59 +40,60 @@ menu,
nav, nav,
section, section,
summary { summary {
/* 1 */
display: block; display: block;
} }
/** /**
* 1. Correct `inline-block` display not defined in IE 8/9. * Add the correct display in IE 9-.
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
*/ */
audio, audio,
canvas, canvas,
progress, progress,
video { video {
display: inline-block; display: inline-block;
/* 1 */
vertical-align: baseline;
/* 2 */
} }
/** /**
* Prevent modern browsers from displaying `audio` without controls. * Add the correct display in iOS 4-7.
* Remove excess height in iOS 5 devices.
*/ */
audio:not([controls]) { audio:not([controls]) {
display: none; display: none;
height: 0; height: 0;
} }
/** /**
* Address `[hidden]` styling not present in IE 8/9/10. * Add the correct vertical alignment in Chrome, Firefox, and Opera.
* Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
*/ */
[hidden], progress {
template { vertical-align: baseline;
}
/**
* Add the correct display in IE 10-.
* 1. Add the correct display in IE.
*/
template,
[hidden] {
display: none; display: none;
} }
/* Links /* Links
========================================================================== */ ========================================================================== */
/** /**
* Remove the gray background color from active links in IE 10. * Remove the gray background on active links in IE 10.
*/ */
a { a {
background-color: transparent; background-color: transparent;
} }
/** /**
* Improve readability of focused elements when they are also in an * Remove the outline on focused links when they are also active or hovered
* active/hover state. * in all browsers (opinionated).
*/ */
a:active, a:active,
a:hover { a:hover {
outline: 0; outline-width: 0;
} }
/* Text-level semantics /* Text-level semantics
========================================================================== */ ========================================================================== */
/** /**
* Address inconsistent styling of `abbr[title]`. * 1. Remove the bottom border in Firefox 39-.
* 1. Correct styling in Firefox 39 and Opera 12. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
* 2. Correct missing styling in Chrome, Edge, IE, Opera, and Safari.
*/ */
abbr[title] { abbr[title] {
border-bottom: none; border-bottom: none;
@ -105,49 +104,49 @@ abbr[title] {
/* 2 */ /* 2 */
} }
/** /**
* Address inconsistent styling of b and strong. * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
* 1. Correct duplicate application of `bolder` in Safari 6.0.2.
* 2. Correct style set to `bold` in Edge 12+, Safari 6.2+, and Chrome 18+.
*/ */
b, b,
strong { strong {
font-weight: inherit; font-weight: inherit;
/* 1 */
} }
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b, b,
strong { strong {
font-weight: bolder; font-weight: bolder;
/* 2 */
} }
/** /**
* Address styling not present in Safari and Chrome. * Add the correct font style in Android 4.3-.
*/ */
dfn { dfn {
font-style: italic; font-style: italic;
} }
/** /**
* Address variable `h1` font-size and margin within `section` and `article` * Correct the font size and margin on `h1` elements within `section` and
* contexts in Firefox 4+, Safari, and Chrome. * `article` contexts in Chrome, Firefox, and Safari.
*/ */
h1 { h1 {
font-size: 2em; font-size: 2em;
margin: 0.67em 0; margin: 0.67em 0;
} }
/** /**
* Address styling not present in IE 8/9. * Add the correct background and color in IE 9-.
*/ */
mark { mark {
background-color: #ff0; background-color: #ff0;
color: #000; color: #000;
} }
/** /**
* Address inconsistent and variable font size in all browsers. * Add the correct font size in all browsers.
*/ */
small { small {
font-size: 80%; font-size: 80%;
} }
/** /**
* Prevent `sub` and `sup` affecting `line-height` in all browsers. * Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/ */
sub, sub,
sup { sup {
@ -156,22 +155,22 @@ sup {
position: relative; position: relative;
vertical-align: baseline; vertical-align: baseline;
} }
sup {
top: -0.5em;
}
sub { sub {
bottom: -0.25em; bottom: -0.25em;
} }
sup {
top: -0.5em;
}
/* Embedded content /* Embedded content
========================================================================== */ ========================================================================== */
/** /**
* Remove border when inside `a` element in IE 8/9/10. * Remove the border on images inside links in IE 10-.
*/ */
img { img {
border: 0; border-style: none;
} }
/** /**
* Correct overflow not hidden in IE 9/10/11. * Hide the overflow in IE.
*/ */
svg:not(:root) { svg:not(:root) {
overflow: hidden; overflow: hidden;
@ -179,33 +178,8 @@ svg:not(:root) {
/* Grouping content /* Grouping content
========================================================================== */ ========================================================================== */
/** /**
* Address margin not present in IE 8/9 and Safari. * 1. Correct the inheritance and scaling of font size in all browsers.
*/ * 2. Correct the odd `em` font sizing in all browsers.
figure {
margin: 1em 40px;
}
/**
* Address inconsistent styling of `hr`.
* 1. Correct `box-sizing` set to `border-box` in Firefox.
* 2. Correct `overflow` set to `hidden` in IE 8/9/10/11 and Edge 12.
*/
hr {
box-sizing: content-box;
/* 1 */
height: 0;
/* 1 */
overflow: visible;
/* 2 */
}
/**
* Contain overflow in all browsers.
*/
pre {
overflow: auto;
}
/**
* 1. Correct inheritance and scaling of font-size for preformatted text.
* 2. Address odd `em`-unit font size rendering in all browsers.
*/ */
code, code,
kbd, kbd,
@ -216,67 +190,101 @@ samp {
font-size: 1em; font-size: 1em;
/* 2 */ /* 2 */
} }
/**
* Add the correct margin in IE 8.
*/
figure {
margin: 1em 40px;
}
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box;
/* 1 */
height: 0;
/* 1 */
overflow: visible;
/* 2 */
}
/* Forms /* Forms
========================================================================== */ ========================================================================== */
/** /**
* Known limitation: by default, Chrome and Safari on OS X allow very limited * Change font properties to `inherit` in all browsers (opinionated).
* styling of `select`, unless a `border` property is set.
*/
/**
* 1. Correct font properties not being inherited.
* 2. Address margins set differently in Firefox 4+, Safari, and Chrome.
*/ */
button, button,
input, input,
optgroup,
select, select,
textarea { textarea {
font: inherit; font: inherit;
/* 1 */
margin: 0;
/* 2 */
} }
/** /**
* Address `overflow` set to `hidden` in IE 8/9/10/11. * Restore the font weight unset by the previous rule.
*/ */
button { optgroup {
font-weight: bold;
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
* 2. Show the overflow in Edge, Firefox, and IE.
*/
button,
input,
select {
/* 2 */
overflow: visible; overflow: visible;
} }
/** /**
* Address inconsistent `text-transform` inheritance for `button` and `select`. * Remove the margin in Safari.
* All other form control elements do not inherit `text-transform` values. * 1. Remove the margin in Firefox and Safari.
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. */
* Correct `select` style inheritance in Firefox. button,
input,
select,
textarea {
/* 1 */
margin: 0;
}
/**
* Remove the inheritence of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritence of text transform in Firefox.
*/ */
button, button,
select { select {
/* 1 */
text-transform: none; text-transform: none;
} }
/** /**
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * Change the cursor in all browsers (opinionated).
* and `video` controls.
* 2. Correct inability to style clickable `input` types in iOS.
* 3. Improve usability and consistency of cursor style between image-type
* `input` and others.
*/ */
button, button,
html input[type="button"], [type="button"],
input[type="reset"], [type="reset"],
input[type="submit"] { [type="submit"] {
-webkit-appearance: button;
/* 2 */
cursor: pointer; cursor: pointer;
/* 3 */
} }
/** /**
* Re-set default cursor for disabled elements. * Restore the default cursor to disabled elements unset by the previous rule.
*/ */
button[disabled], [disabled] {
html input[disabled] {
cursor: default; cursor: default;
} }
/** /**
* Remove inner padding and border in Firefox 4+. * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
* controls in Android 4.
* 2. Correct the inability to style clickable types in iOS.
*/
button,
html [type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
/* 2 */
}
/**
* Remove the inner border and padding in Firefox.
*/ */
button::-moz-focus-inner, button::-moz-focus-inner,
input::-moz-focus-inner { input::-moz-focus-inner {
@ -284,52 +292,14 @@ input::-moz-focus-inner {
padding: 0; padding: 0;
} }
/** /**
* Address Firefox 4+ setting `line-height` on `input` using `!important` in * Restore the focus styles unset by the previous rule.
* the UA stylesheet.
*/ */
input { button:-moz-focusring,
line-height: normal; input:-moz-focusring {
outline: 1px dotted ButtonText;
} }
/** /**
* It's recommended that you don't attempt to style these elements. * Change the border, margin, and padding in all browsers (opinionated).
* Firefox's implementation doesn't respect box-sizing, padding, or width.
*
* 1. Address box sizing set to `content-box` in IE 8/9/10.
* 2. Remove excess padding in IE 8/9/10.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box;
/* 1 */
padding: 0;
/* 2 */
}
/**
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
* `font-size` values of the `input`, it causes the cursor style of the
* decrement button to change from `default` to `text`.
*/
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* Address `appearance` set to `searchfield` in Safari and Chrome.
*/
input[type="search"] {
-webkit-appearance: textfield;
}
/**
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
* Safari (but not Chrome) clips the cancel button when the search input has
* padding (and `textfield` appearance).
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Define consistent border, margin, and padding.
*/ */
fieldset { fieldset {
border: 1px solid #c0c0c0; border: 1px solid #c0c0c0;
@ -337,40 +307,62 @@ fieldset {
padding: 0.35em 0.625em 0.75em; padding: 0.35em 0.625em 0.75em;
} }
/** /**
* 1. Correct `color` not being inherited in IE 8/9/10/11. * 1. Correct the text wrapping in Edge and IE.
* 2. Remove padding so people aren't caught out if they zero out fieldsets. * 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/ */
legend { legend {
border: 0; box-sizing: border-box;
/* 1 */
color: inherit;
/* 2 */
display: table;
/* 1 */
max-width: 100%;
/* 1 */ /* 1 */
padding: 0; padding: 0;
/* 2 */ /* 3 */
white-space: normal;
/* 1 */
} }
/** /**
* Remove default vertical scrollbar in IE 8/9/10/11. * Remove the default vertical scrollbar in IE.
*/ */
textarea { textarea {
overflow: auto; overflow: auto;
} }
/** /**
* Don't inherit the `font-weight` (applied by a rule above). * 1. Add the correct box sizing in IE 10-.
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X. * 2. Remove the padding in IE 10-.
*/ */
optgroup { [type="checkbox"],
font-weight: bold; [type="radio"] {
} box-sizing: border-box;
/* Tables /* 1 */
========================================================================== */
/**
* Remove most spacing between table cells.
*/
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0; padding: 0;
/* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* Correct the odd appearance of search inputs in Chrome and Safari.
*/
[type="search"] {
-webkit-appearance: textfield;
}
/**
* Remove the inner padding and cancel buttons in Chrome on OS X and
* Safari on OS X.
*/
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
} }
/* ----------------------------- */ /* ----------------------------- */
/* == soft reset */ /* == soft reset */
@ -664,6 +656,7 @@ http://www.alsacreations.com/tuto/lire/1493-css3-flexbox-layout-module.html
-webkit-flex: 1; -webkit-flex: 1;
-ms-flex: 1; -ms-flex: 1;
flex: 1; flex: 1;
min-width: 0;
} }
.flex-item-first { .flex-item-first {
-webkit-box-ordinal-group: 0; -webkit-box-ordinal-group: 0;
@ -1735,18 +1728,6 @@ s,m,l,n = small, medium, large, none
hyphens: manual; hyphens: manual;
} }
} }
/* Google Gmap3 bug fix on images */
.gm-style img {
height: 100%;
}
:not(.gm-style) img {
height: auto;
}
.gm-style img,
.gmnoscreen img,
.gmnoprint img {
max-width: none !important;
}
/* ----------------------------- */ /* ----------------------------- */
/* ==minor stylings */ /* ==minor stylings */
/* ----------------------------- */ /* ----------------------------- */

4
css/knacss.css
View file

File diff suppressed because one or more lines are too long

2
doc/06-helpers.md
View file

@ -70,7 +70,7 @@ Largeurs spéciales :
## les Helpers d'espacement ## les Helpers d'espacement
Les herpers d'espacement comportent des classes dédiées aux marges externes (margin) et aux marges internes (padding). Les helpers d'espacement comportent des classes dédiées aux marges externes (margin) et aux marges internes (padding).
Leur nommage est assez intuitif : Leur nommage est assez intuitif :

2
less/_00-config.less
View file

@ -1,5 +1,5 @@
/*! /*!
* www.KNACSS.com V4.4.4 (23 janvier 2016) @author: Raphael Goetter, Alsacreations * www.KNACSS.com V4.4.5 (1er avril 2016) @author: Raphael Goetter, Alsacreations
* Licence WTFPL http://www.wtfpl.net/ * Licence WTFPL http://www.wtfpl.net/
*/ */

351
less/_01a-normalize.less
View file

@ -1,9 +1,8 @@
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ /*! normalize.css v4.0.0 | MIT License | github.com/necolas/normalize.css */
/** /**
* 1. Set default font family to sans-serif. * 1. Change the default font family in all browsers (opinionated).
* 2. Prevent iOS and IE text size adjust after device orientation change, * 2. Prevent adjustments of font size after orientation changes in IE and iOS.
* without disabling user zoom.
*/ */
html { html {
@ -13,7 +12,7 @@ html {
} }
/** /**
* Remove default margin. * Remove the margin in all browsers (opinionated).
*/ */
body { body {
@ -24,43 +23,39 @@ body {
========================================================================== */ ========================================================================== */
/** /**
* Correct `block` display not defined for any HTML5 element in IE 8/9. * Add the correct display in IE 9-.
* Correct `block` display not defined for `details` or `summary` in IE 10/11 * 1. Add the correct display in Edge, IE, and Firefox.
* and Firefox. * 2. Add the correct display in IE.
* Correct `block` display not defined for `main` in IE 11.
*/ */
article, article,
aside, aside,
details, details, /* 1 */
figcaption, figcaption,
figure, figure,
footer, footer,
header, header,
main, main, /* 2 */
menu, menu,
nav, nav,
section, section,
summary { summary { /* 1 */
display: block; display: block;
} }
/** /**
* 1. Correct `inline-block` display not defined in IE 8/9. * Add the correct display in IE 9-.
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
*/ */
audio, audio,
canvas, canvas,
progress, progress,
video { video {
display: inline-block; /* 1 */ display: inline-block;
vertical-align: baseline; /* 2 */
} }
/** /**
* Prevent modern browsers from displaying `audio` without controls. * Add the correct display in iOS 4-7.
* Remove excess height in iOS 5 devices.
*/ */
audio:not([controls]) { audio:not([controls]) {
@ -69,12 +64,20 @@ audio:not([controls]) {
} }
/** /**
* Address `[hidden]` styling not present in IE 8/9/10. * Add the correct vertical alignment in Chrome, Firefox, and Opera.
* Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
*/ */
[hidden], progress {
template { vertical-align: baseline;
}
/**
* Add the correct display in IE 10-.
* 1. Add the correct display in IE.
*/
template, /* 1 */
[hidden] {
display: none; display: none;
} }
@ -82,7 +85,7 @@ template {
========================================================================== */ ========================================================================== */
/** /**
* Remove the gray background color from active links in IE 10. * Remove the gray background on active links in IE 10.
*/ */
a { a {
@ -90,22 +93,21 @@ a {
} }
/** /**
* Improve readability of focused elements when they are also in an * Remove the outline on focused links when they are also active or hovered
* active/hover state. * in all browsers (opinionated).
*/ */
a:active, a:active,
a:hover { a:hover {
outline: 0; outline-width: 0;
} }
/* Text-level semantics /* Text-level semantics
========================================================================== */ ========================================================================== */
/** /**
* Address inconsistent styling of `abbr[title]`. * 1. Remove the bottom border in Firefox 39-.
* 1. Correct styling in Firefox 39 and Opera 12. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
* 2. Correct missing styling in Chrome, Edge, IE, Opera, and Safari.
*/ */
abbr[title] { abbr[title] {
@ -115,23 +117,25 @@ abbr[title] {
} }
/** /**
* Address inconsistent styling of b and strong. * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
* 1. Correct duplicate application of `bolder` in Safari 6.0.2.
* 2. Correct style set to `bold` in Edge 12+, Safari 6.2+, and Chrome 18+.
*/ */
b, b,
strong { strong {
font-weight: inherit; /* 1 */ font-weight: inherit;
}
b,
strong {
font-weight: bolder; /* 2 */
} }
/** /**
* Address styling not present in Safari and Chrome. * Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* Add the correct font style in Android 4.3-.
*/ */
dfn { dfn {
@ -139,8 +143,8 @@ dfn {
} }
/** /**
* Address variable `h1` font-size and margin within `section` and `article` * Correct the font size and margin on `h1` elements within `section` and
* contexts in Firefox 4+, Safari, and Chrome. * `article` contexts in Chrome, Firefox, and Safari.
*/ */
h1 { h1 {
@ -149,7 +153,7 @@ h1 {
} }
/** /**
* Address styling not present in IE 8/9. * Add the correct background and color in IE 9-.
*/ */
mark { mark {
@ -158,7 +162,7 @@ mark {
} }
/** /**
* Address inconsistent and variable font size in all browsers. * Add the correct font size in all browsers.
*/ */
small { small {
@ -166,7 +170,8 @@ small {
} }
/** /**
* Prevent `sub` and `sup` affecting `line-height` in all browsers. * Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/ */
sub, sub,
@ -177,27 +182,27 @@ sup {
vertical-align: baseline; vertical-align: baseline;
} }
sup {
top: -0.5em;
}
sub { sub {
bottom: -0.25em; bottom: -0.25em;
} }
sup {
top: -0.5em;
}
/* Embedded content /* Embedded content
========================================================================== */ ========================================================================== */
/** /**
* Remove border when inside `a` element in IE 8/9/10. * Remove the border on images inside links in IE 10-.
*/ */
img { img {
border: 0; border-style: none;
} }
/** /**
* Correct overflow not hidden in IE 9/10/11. * Hide the overflow in IE.
*/ */
svg:not(:root) { svg:not(:root) {
@ -208,36 +213,8 @@ svg:not(:root) {
========================================================================== */ ========================================================================== */
/** /**
* Address margin not present in IE 8/9 and Safari. * 1. Correct the inheritance and scaling of font size in all browsers.
*/ * 2. Correct the odd `em` font sizing in all browsers.
figure {
margin: 1em 40px;
}
/**
* Address inconsistent styling of `hr`.
* 1. Correct `box-sizing` set to `border-box` in Firefox.
* 2. Correct `overflow` set to `hidden` in IE 8/9/10/11 and Edge 12.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* Contain overflow in all browsers.
*/
pre {
overflow: auto;
}
/**
* 1. Correct inheritance and scaling of font-size for preformatted text.
* 2. Address odd `em`-unit font size rendering in all browsers.
*/ */
code, code,
@ -248,75 +225,115 @@ samp {
font-size: 1em; /* 2 */ font-size: 1em; /* 2 */
} }
/**
* Add the correct margin in IE 8.
*/
figure {
margin: 1em 40px;
}
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/* Forms /* Forms
========================================================================== */ ========================================================================== */
/** /**
* Known limitation: by default, Chrome and Safari on OS X allow very limited * Change font properties to `inherit` in all browsers (opinionated).
* styling of `select`, unless a `border` property is set.
*/
/**
* 1. Correct font properties not being inherited.
* 2. Address margins set differently in Firefox 4+, Safari, and Chrome.
*/ */
button, button,
input, input,
optgroup,
select, select,
textarea { textarea {
font: inherit; /* 1 */ font: inherit;
margin: 0; /* 2 */
} }
/** /**
* Address `overflow` set to `hidden` in IE 8/9/10/11. * Restore the font weight unset by the previous rule.
*/ */
button { optgroup {
font-weight: bold;
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
* 2. Show the overflow in Edge, Firefox, and IE.
*/
button,
input, /* 1 */
select { /* 2 */
overflow: visible; overflow: visible;
} }
/** /**
* Address inconsistent `text-transform` inheritance for `button` and `select`. * Remove the margin in Safari.
* All other form control elements do not inherit `text-transform` values. * 1. Remove the margin in Firefox and Safari.
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
* Correct `select` style inheritance in Firefox.
*/ */
button, button,
select { input,
select,
textarea { /* 1 */
margin: 0;
}
/**
* Remove the inheritence of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritence of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none; text-transform: none;
} }
/** /**
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * Change the cursor in all browsers (opinionated).
* and `video` controls.
* 2. Correct inability to style clickable `input` types in iOS.
* 3. Improve usability and consistency of cursor style between image-type
* `input` and others.
*/ */
button, button,
html input[type="button"], /* 1 */ [type="button"],
input[type="reset"], [type="reset"],
input[type="submit"] { [type="submit"] {
-webkit-appearance: button; /* 2 */ cursor: pointer;
cursor: pointer; /* 3 */
} }
/** /**
* Re-set default cursor for disabled elements. * Restore the default cursor to disabled elements unset by the previous rule.
*/ */
button[disabled], [disabled] {
html input[disabled] {
cursor: default; cursor: default;
} }
/** /**
* Remove inner padding and border in Firefox 4+. * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
* controls in Android 4.
* 2. Correct the inability to style clickable types in iOS.
*/
button,
html [type="button"], /* 1 */
[type="reset"],
[type="submit"] {
-webkit-appearance: button; /* 2 */
}
/**
* Remove the inner border and padding in Firefox.
*/ */
button::-moz-focus-inner, button::-moz-focus-inner,
@ -326,60 +343,16 @@ input::-moz-focus-inner {
} }
/** /**
* Address Firefox 4+ setting `line-height` on `input` using `!important` in * Restore the focus styles unset by the previous rule.
* the UA stylesheet.
*/ */
input { button:-moz-focusring,
line-height: normal; input:-moz-focusring {
outline: 1px dotted ButtonText;
} }
/** /**
* It's recommended that you don't attempt to style these elements. * Change the border, margin, and padding in all browsers (opinionated).
* Firefox's implementation doesn't respect box-sizing, padding, or width.
*
* 1. Address box sizing set to `content-box` in IE 8/9/10.
* 2. Remove excess padding in IE 8/9/10.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
* `font-size` values of the `input`, it causes the cursor style of the
* decrement button to change from `default` to `text`.
*/
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* Address `appearance` set to `searchfield` in Safari and Chrome.
*/
input[type="search"] {
-webkit-appearance: textfield;
}
/**
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
* Safari (but not Chrome) clips the cancel button when the search input has
* padding (and `textfield` appearance).
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Define consistent border, margin, and padding.
*/ */
fieldset { fieldset {
@ -389,17 +362,23 @@ fieldset {
} }
/** /**
* 1. Correct `color` not being inherited in IE 8/9/10/11. * 1. Correct the text wrapping in Edge and IE.
* 2. Remove padding so people aren't caught out if they zero out fieldsets. * 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/ */
legend { legend {
border: 0; /* 1 */ box-sizing: border-box; /* 1 */
padding: 0; /* 2 */ color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
} }
/** /**
* Remove default vertical scrollbar in IE 8/9/10/11. * Remove the default vertical scrollbar in IE.
*/ */
textarea { textarea {
@ -407,27 +386,39 @@ textarea {
} }
/** /**
* Don't inherit the `font-weight` (applied by a rule above). * 1. Add the correct box sizing in IE 10-.
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X. * 2. Remove the padding in IE 10-.
*/ */
optgroup { [type="checkbox"],
font-weight: bold; [type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
} }
/* Tables
========================================================================== */
/** /**
* Remove most spacing between table cells. * Correct the cursor style of increment and decrement buttons in Chrome.
*/ */
table { [type="number"]::-webkit-inner-spin-button,
border-collapse: collapse; [type="number"]::-webkit-outer-spin-button {
border-spacing: 0; height: auto;
} }
td, /**
th { * Correct the odd appearance of search inputs in Chrome and Safari.
padding: 0; */
[type="search"] {
-webkit-appearance: textfield;
}
/**
* Remove the inner padding and cancel buttons in Chrome on OS X and
* Safari on OS X.
*/
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
} }

1
less/_02-layout.less
View file

@ -119,6 +119,7 @@ http://www.alsacreations.com/tuto/lire/1493-css3-flexbox-layout-module.html
.@{kna-namespace}flex-item-fluid { .@{kna-namespace}flex-item-fluid {
flex: 1; flex: 1;
min-width: 0;
} }
.@{kna-namespace}flex-item-first { .@{kna-namespace}flex-item-first {

15
less/_09-misc.less
View file

@ -46,18 +46,3 @@
hyphens: manual; hyphens: manual;
} }
} }
/* Google Gmap3 bug fix on images */
.gm-style img {
height: 100%;
}
:not(.gm-style) img {
height: auto;
}
.gm-style img,
.gmnoscreen img,
.gmnoprint img {
max-width: none !important;
}

6
package.json
View file

@ -1,8 +1,8 @@
{ {
"name": "knacss", "name": "knacss",
"version": "4.4.4", "version": "4.4.5",
"homepage": "http://www.knacss.com/", "homepage": "http://www.knacss.com/",
"bugs": "https://github.com/raphaelgoetter/KNACSS/issues", "bugs": "https://github.com/alsacreations/KNACSS/issues",
"author": [ "author": [
"Raphaël GOETTER, Alsacreations (http://www.alsacreations.fr)" "Raphaël GOETTER, Alsacreations (http://www.alsacreations.fr)"
], ],
@ -24,7 +24,7 @@
], ],
"repository": { "repository": {
"type": "git", "type": "git",
"url": "https://github.com/raphaelgoetter/KNACSS" "url": "https://github.com/alsacreations/KNACSS"
}, },
"license": "WTFPL", "license": "WTFPL",
"dependencies": {}, "dependencies": {},

2
sass/_00-config.scss
View file

@ -1,5 +1,5 @@
/*! /*!
* www.KNACSS.com V4.4.4 (23 janvier 2016) @author: Raphael Goetter, Alsacreations * www.KNACSS.com V4.4.5 (1er avril 2016) @author: Raphael Goetter, Alsacreations
* Licence WTFPL http://www.wtfpl.net/ * Licence WTFPL http://www.wtfpl.net/
*/ */

351
sass/_01a-normalize.scss
View file

@ -1,9 +1,8 @@
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ /*! normalize.css v4.0.0 | MIT License | github.com/necolas/normalize.css */
/** /**
* 1. Set default font family to sans-serif. * 1. Change the default font family in all browsers (opinionated).
* 2. Prevent iOS and IE text size adjust after device orientation change, * 2. Prevent adjustments of font size after orientation changes in IE and iOS.
* without disabling user zoom.
*/ */
html { html {
@ -13,7 +12,7 @@ html {
} }
/** /**
* Remove default margin. * Remove the margin in all browsers (opinionated).
*/ */
body { body {
@ -24,43 +23,39 @@ body {
========================================================================== */ ========================================================================== */
/** /**
* Correct `block` display not defined for any HTML5 element in IE 8/9. * Add the correct display in IE 9-.
* Correct `block` display not defined for `details` or `summary` in IE 10/11 * 1. Add the correct display in Edge, IE, and Firefox.
* and Firefox. * 2. Add the correct display in IE.
* Correct `block` display not defined for `main` in IE 11.
*/ */
article, article,
aside, aside,
details, details, /* 1 */
figcaption, figcaption,
figure, figure,
footer, footer,
header, header,
main, main, /* 2 */
menu, menu,
nav, nav,
section, section,
summary { summary { /* 1 */
display: block; display: block;
} }
/** /**
* 1. Correct `inline-block` display not defined in IE 8/9. * Add the correct display in IE 9-.
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
*/ */
audio, audio,
canvas, canvas,
progress, progress,
video { video {
display: inline-block; /* 1 */ display: inline-block;
vertical-align: baseline; /* 2 */
} }
/** /**
* Prevent modern browsers from displaying `audio` without controls. * Add the correct display in iOS 4-7.
* Remove excess height in iOS 5 devices.
*/ */
audio:not([controls]) { audio:not([controls]) {
@ -69,12 +64,20 @@ audio:not([controls]) {
} }
/** /**
* Address `[hidden]` styling not present in IE 8/9/10. * Add the correct vertical alignment in Chrome, Firefox, and Opera.
* Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
*/ */
[hidden], progress {
template { vertical-align: baseline;
}
/**
* Add the correct display in IE 10-.
* 1. Add the correct display in IE.
*/
template, /* 1 */
[hidden] {
display: none; display: none;
} }
@ -82,7 +85,7 @@ template {
========================================================================== */ ========================================================================== */
/** /**
* Remove the gray background color from active links in IE 10. * Remove the gray background on active links in IE 10.
*/ */
a { a {
@ -90,22 +93,21 @@ a {
} }
/** /**
* Improve readability of focused elements when they are also in an * Remove the outline on focused links when they are also active or hovered
* active/hover state. * in all browsers (opinionated).
*/ */
a:active, a:active,
a:hover { a:hover {
outline: 0; outline-width: 0;
} }
/* Text-level semantics /* Text-level semantics
========================================================================== */ ========================================================================== */
/** /**
* Address inconsistent styling of `abbr[title]`. * 1. Remove the bottom border in Firefox 39-.
* 1. Correct styling in Firefox 39 and Opera 12. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
* 2. Correct missing styling in Chrome, Edge, IE, Opera, and Safari.
*/ */
abbr[title] { abbr[title] {
@ -115,23 +117,25 @@ abbr[title] {
} }
/** /**
* Address inconsistent styling of b and strong. * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
* 1. Correct duplicate application of `bolder` in Safari 6.0.2.
* 2. Correct style set to `bold` in Edge 12+, Safari 6.2+, and Chrome 18+.
*/ */
b, b,
strong { strong {
font-weight: inherit; /* 1 */ font-weight: inherit;
}
b,
strong {
font-weight: bolder; /* 2 */
} }
/** /**
* Address styling not present in Safari and Chrome. * Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* Add the correct font style in Android 4.3-.
*/ */
dfn { dfn {
@ -139,8 +143,8 @@ dfn {
} }
/** /**
* Address variable `h1` font-size and margin within `section` and `article` * Correct the font size and margin on `h1` elements within `section` and
* contexts in Firefox 4+, Safari, and Chrome. * `article` contexts in Chrome, Firefox, and Safari.
*/ */
h1 { h1 {
@ -149,7 +153,7 @@ h1 {
} }
/** /**
* Address styling not present in IE 8/9. * Add the correct background and color in IE 9-.
*/ */
mark { mark {
@ -158,7 +162,7 @@ mark {
} }
/** /**
* Address inconsistent and variable font size in all browsers. * Add the correct font size in all browsers.
*/ */
small { small {
@ -166,7 +170,8 @@ small {
} }
/** /**
* Prevent `sub` and `sup` affecting `line-height` in all browsers. * Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/ */
sub, sub,
@ -177,27 +182,27 @@ sup {
vertical-align: baseline; vertical-align: baseline;
} }
sup {
top: -0.5em;
}
sub { sub {
bottom: -0.25em; bottom: -0.25em;
} }
sup {
top: -0.5em;
}
/* Embedded content /* Embedded content
========================================================================== */ ========================================================================== */
/** /**
* Remove border when inside `a` element in IE 8/9/10. * Remove the border on images inside links in IE 10-.
*/ */
img { img {
border: 0; border-style: none;
} }
/** /**
* Correct overflow not hidden in IE 9/10/11. * Hide the overflow in IE.
*/ */
svg:not(:root) { svg:not(:root) {
@ -208,36 +213,8 @@ svg:not(:root) {
========================================================================== */ ========================================================================== */
/** /**
* Address margin not present in IE 8/9 and Safari. * 1. Correct the inheritance and scaling of font size in all browsers.
*/ * 2. Correct the odd `em` font sizing in all browsers.
figure {
margin: 1em 40px;
}
/**
* Address inconsistent styling of `hr`.
* 1. Correct `box-sizing` set to `border-box` in Firefox.
* 2. Correct `overflow` set to `hidden` in IE 8/9/10/11 and Edge 12.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* Contain overflow in all browsers.
*/
pre {
overflow: auto;
}
/**
* 1. Correct inheritance and scaling of font-size for preformatted text.
* 2. Address odd `em`-unit font size rendering in all browsers.
*/ */
code, code,
@ -248,75 +225,115 @@ samp {
font-size: 1em; /* 2 */ font-size: 1em; /* 2 */
} }
/**
* Add the correct margin in IE 8.
*/
figure {
margin: 1em 40px;
}
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/* Forms /* Forms
========================================================================== */ ========================================================================== */
/** /**
* Known limitation: by default, Chrome and Safari on OS X allow very limited * Change font properties to `inherit` in all browsers (opinionated).
* styling of `select`, unless a `border` property is set.
*/
/**
* 1. Correct font properties not being inherited.
* 2. Address margins set differently in Firefox 4+, Safari, and Chrome.
*/ */
button, button,
input, input,
optgroup,
select, select,
textarea { textarea {
font: inherit; /* 1 */ font: inherit;
margin: 0; /* 2 */
} }
/** /**
* Address `overflow` set to `hidden` in IE 8/9/10/11. * Restore the font weight unset by the previous rule.
*/ */
button { optgroup {
font-weight: bold;
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
* 2. Show the overflow in Edge, Firefox, and IE.
*/
button,
input, /* 1 */
select { /* 2 */
overflow: visible; overflow: visible;
} }
/** /**
* Address inconsistent `text-transform` inheritance for `button` and `select`. * Remove the margin in Safari.
* All other form control elements do not inherit `text-transform` values. * 1. Remove the margin in Firefox and Safari.
* Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
* Correct `select` style inheritance in Firefox.
*/ */
button, button,
select { input,
select,
textarea { /* 1 */
margin: 0;
}
/**
* Remove the inheritence of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritence of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none; text-transform: none;
} }
/** /**
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * Change the cursor in all browsers (opinionated).
* and `video` controls.
* 2. Correct inability to style clickable `input` types in iOS.
* 3. Improve usability and consistency of cursor style between image-type
* `input` and others.
*/ */
button, button,
html input[type="button"], /* 1 */ [type="button"],
input[type="reset"], [type="reset"],
input[type="submit"] { [type="submit"] {
-webkit-appearance: button; /* 2 */ cursor: pointer;
cursor: pointer; /* 3 */
} }
/** /**
* Re-set default cursor for disabled elements. * Restore the default cursor to disabled elements unset by the previous rule.
*/ */
button[disabled], [disabled] {
html input[disabled] {
cursor: default; cursor: default;
} }
/** /**
* Remove inner padding and border in Firefox 4+. * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
* controls in Android 4.
* 2. Correct the inability to style clickable types in iOS.
*/
button,
html [type="button"], /* 1 */
[type="reset"],
[type="submit"] {
-webkit-appearance: button; /* 2 */
}
/**
* Remove the inner border and padding in Firefox.
*/ */
button::-moz-focus-inner, button::-moz-focus-inner,
@ -326,60 +343,16 @@ input::-moz-focus-inner {
} }
/** /**
* Address Firefox 4+ setting `line-height` on `input` using `!important` in * Restore the focus styles unset by the previous rule.
* the UA stylesheet.
*/ */
input { button:-moz-focusring,
line-height: normal; input:-moz-focusring {
outline: 1px dotted ButtonText;
} }
/** /**
* It's recommended that you don't attempt to style these elements. * Change the border, margin, and padding in all browsers (opinionated).
* Firefox's implementation doesn't respect box-sizing, padding, or width.
*
* 1. Address box sizing set to `content-box` in IE 8/9/10.
* 2. Remove excess padding in IE 8/9/10.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
* `font-size` values of the `input`, it causes the cursor style of the
* decrement button to change from `default` to `text`.
*/
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* Address `appearance` set to `searchfield` in Safari and Chrome.
*/
input[type="search"] {
-webkit-appearance: textfield;
}
/**
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
* Safari (but not Chrome) clips the cancel button when the search input has
* padding (and `textfield` appearance).
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Define consistent border, margin, and padding.
*/ */
fieldset { fieldset {
@ -389,17 +362,23 @@ fieldset {
} }
/** /**
* 1. Correct `color` not being inherited in IE 8/9/10/11. * 1. Correct the text wrapping in Edge and IE.
* 2. Remove padding so people aren't caught out if they zero out fieldsets. * 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/ */
legend { legend {
border: 0; /* 1 */ box-sizing: border-box; /* 1 */
padding: 0; /* 2 */ color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
} }
/** /**
* Remove default vertical scrollbar in IE 8/9/10/11. * Remove the default vertical scrollbar in IE.
*/ */
textarea { textarea {
@ -407,27 +386,39 @@ textarea {
} }
/** /**
* Don't inherit the `font-weight` (applied by a rule above). * 1. Add the correct box sizing in IE 10-.
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X. * 2. Remove the padding in IE 10-.
*/ */
optgroup { [type="checkbox"],
font-weight: bold; [type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
} }
/* Tables
========================================================================== */
/** /**
* Remove most spacing between table cells. * Correct the cursor style of increment and decrement buttons in Chrome.
*/ */
table { [type="number"]::-webkit-inner-spin-button,
border-collapse: collapse; [type="number"]::-webkit-outer-spin-button {
border-spacing: 0; height: auto;
} }
td, /**
th { * Correct the odd appearance of search inputs in Chrome and Safari.
padding: 0; */
[type="search"] {
-webkit-appearance: textfield;
}
/**
* Remove the inner padding and cancel buttons in Chrome on OS X and
* Safari on OS X.
*/
[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
} }

1
sass/_02-layout.scss
View file

@ -118,6 +118,7 @@ http://www.alsacreations.com/tuto/lire/1493-css3-flexbox-layout-module.html
.#{$kna-namespace}flex-item-fluid { .#{$kna-namespace}flex-item-fluid {
flex: 1; flex: 1;
min-width: 0;
} }
.#{$kna-namespace}flex-item-first { .#{$kna-namespace}flex-item-first {

15
sass/_09-misc.scss
View file

@ -46,18 +46,3 @@
hyphens: manual; hyphens: manual;
} }
} }
/* Google Gmap3 bug fix on images */
.gm-style img {
height: 100%;
}
:not(.gm-style) img {
height: auto;
}
.gm-style img,
.gmnoscreen img,
.gmnoprint img {
max-width: none !important;
}