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

build

Browse source
This commit is contained in:
Raphael Goetter 2017-08-09 16:04:09 +02:00
parent 0771287438
commit 89514c4a58
2 changed files with 75 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

111
css/knacss-unminified.css
View file

@ -102,7 +102,8 @@ figure {
* 2. Show the overflow in Edge and IE. * 2. Show the overflow in Edge and IE.
*/ */
hr { hr {
box-sizing: content-box; -webkit-box-sizing: content-box;
box-sizing: content-box;
/* 1 */ /* 1 */
height: 0; height: 0;
/* 1 */ /* 1 */
@ -143,7 +144,8 @@ abbr[title] {
/* 1 */ /* 1 */
text-decoration: underline; text-decoration: underline;
/* 2 */ /* 2 */
text-decoration: underline dotted; -webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
/* 2 */ /* 2 */
} }
@ -339,7 +341,8 @@ fieldset {
* `fieldset` elements in all browsers. * `fieldset` elements in all browsers.
*/ */
legend { legend {
box-sizing: border-box; -webkit-box-sizing: border-box;
box-sizing: border-box;
/* 1 */ /* 1 */
color: inherit; color: inherit;
/* 2 */ /* 2 */
@ -377,7 +380,8 @@ textarea {
*/ */
[type="checkbox"], [type="checkbox"],
[type="radio"] { [type="radio"] {
box-sizing: border-box; -webkit-box-sizing: border-box;
box-sizing: border-box;
/* 1 */ /* 1 */
padding: 0; padding: 0;
/* 2 */ /* 2 */
@ -469,11 +473,13 @@ template {
/* ----------------------------- */ /* ----------------------------- */
/* switching to border-box model for all elements */ /* switching to border-box model for all elements */
html { html {
box-sizing: border-box; -webkit-box-sizing: border-box;
box-sizing: border-box;
} }
* { * {
box-sizing: inherit; -webkit-box-sizing: inherit;
box-sizing: inherit;
/* avoid min-width: auto on flex and grid children */ /* avoid min-width: auto on flex and grid children */
min-width: 0; min-width: 0;
} }
@ -809,7 +815,8 @@ kbd {
@media print { @media print {
* { * {
background: transparent !important; background: transparent !important;
box-shadow: none !important; -webkit-box-shadow: none !important;
box-shadow: none !important;
text-shadow: none !important; text-shadow: none !important;
} }
body { body {
@ -1753,6 +1760,7 @@ ul.is-unstyled, ul.unstyled {
} }
.media-figure--center { .media-figure--center {
-ms-flex-item-align: center; -ms-flex-item-align: center;
-ms-grid-row-align: center;
align-self: center; align-self: center;
} }
.media--reverse { .media--reverse {
@ -1903,15 +1911,18 @@ textarea {
font-family: inherit; font-family: inherit;
font-size: inherit; font-size: inherit;
border: 0; border: 0;
box-shadow: 0 0 0 1px #727e96 inset; -webkit-box-shadow: 0 0 0 1px #727e96 inset;
box-shadow: 0 0 0 1px #727e96 inset;
color: #000; color: #000;
vertical-align: middle; vertical-align: middle;
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
margin: 0; margin: 0;
-webkit-transition: 0.25s; -webkit-transition: 0.25s;
transition: 0.25s; transition: 0.25s;
-webkit-transition-property: box-shadow, background-color, color, border; -webkit-transition-property: background-color, color, border, -webkit-box-shadow;
transition-property: background-color, color, border, -webkit-box-shadow;
transition-property: box-shadow, background-color, color, border; transition-property: box-shadow, background-color, color, border;
transition-property: box-shadow, background-color, color, border, -webkit-box-shadow;
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
@ -1987,8 +1998,10 @@ button, .btn--primary,
user-select: none; user-select: none;
-webkit-transition: 0.25s; -webkit-transition: 0.25s;
transition: 0.25s; transition: 0.25s;
-webkit-transition-property: box-shadow, background-color, color, border; -webkit-transition-property: background-color, color, border, -webkit-box-shadow;
transition-property: background-color, color, border, -webkit-box-shadow;
transition-property: box-shadow, background-color, color, border; transition-property: box-shadow, background-color, color, border;
transition-property: box-shadow, background-color, color, border, -webkit-box-shadow;
text-align: center; text-align: center;
vertical-align: middle; vertical-align: middle;
white-space: nowrap; white-space: nowrap;
@ -2013,7 +2026,8 @@ button:focus {
.button--primary { .button--primary {
background-color: #0275D8; background-color: #0275D8;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.btn--primary:active, .btn--primary:focus, .btn--primary:hover, .btn--primary:active, .btn--primary:focus, .btn--primary:hover,
@ -2027,7 +2041,8 @@ button:focus {
.button--success { .button--success {
background-color: #5CB85C; background-color: #5CB85C;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.btn--success:active, .btn--success:focus, .btn--success:hover, .btn--success:active, .btn--success:focus, .btn--success:hover,
@ -2041,7 +2056,8 @@ button:focus {
.button--info { .button--info {
background-color: #5BC0DE; background-color: #5BC0DE;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.btn--info:active, .btn--info:focus, .btn--info:hover, .btn--info:active, .btn--info:focus, .btn--info:hover,
@ -2055,7 +2071,8 @@ button:focus {
.button--warning { .button--warning {
background-color: #F0AD4E; background-color: #F0AD4E;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.btn--warning:active, .btn--warning:focus, .btn--warning:hover, .btn--warning:active, .btn--warning:focus, .btn--warning:hover,
@ -2069,7 +2086,8 @@ button:focus {
.button--danger { .button--danger {
background-color: #D9534F; background-color: #D9534F;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.btn--danger:active, .btn--danger:focus, .btn--danger:hover, .btn--danger:active, .btn--danger:focus, .btn--danger:hover,
@ -2083,7 +2101,8 @@ button:focus {
.button--inverse { .button--inverse {
background-color: #292B2C; background-color: #292B2C;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.btn--inverse:active, .btn--inverse:focus, .btn--inverse:hover, .btn--inverse:active, .btn--inverse:focus, .btn--inverse:hover,
@ -2097,7 +2116,8 @@ button:focus {
.button--ghost { .button--ghost {
background-color: transparent; background-color: transparent;
color: #fff; color: #fff;
box-shadow: 0 0 0 1px #fff inset; -webkit-box-shadow: 0 0 0 1px #fff inset;
box-shadow: 0 0 0 1px #fff inset;
} }
.btn--ghost:active, .btn--ghost:focus, .btn--ghost:hover, .btn--ghost:active, .btn--ghost:focus, .btn--ghost:hover,
@ -2132,7 +2152,8 @@ button:focus {
text-align: left; text-align: left;
background: none; background: none;
border-radius: 0; border-radius: 0;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
-webkit-appearance: none; -webkit-appearance: none;
-moz-appearance: none; -moz-appearance: none;
appearance: none; appearance: none;
@ -2140,7 +2161,8 @@ button:focus {
.btn--unstyled:focus, .btn--unstyled:focus,
.button--unstyled:focus { .button--unstyled:focus {
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
outline: none; outline: none;
} }
@ -2149,7 +2171,7 @@ button:focus {
height: 2.4rem; height: 2.4rem;
width: 2.8rem; width: 2.8rem;
background-color: transparent; background-color: transparent;
background-image: -webkit-linear-gradient(#000, #000); background-image: -webkit-gradient(linear, left top, left bottom, from(#000), to(#000));
background-image: linear-gradient(#000, #000); background-image: linear-gradient(#000, #000);
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
@ -2233,7 +2255,8 @@ button:focus {
border: 0; border: 0;
background: #fff; background: #fff;
border-radius: 0; border-radius: 0;
box-shadow: 0 0 0 2px #727e96 inset; -webkit-box-shadow: 0 0 0 2px #727e96 inset;
box-shadow: 0 0 0 2px #727e96 inset;
-webkit-transition: .25s background-color; -webkit-transition: .25s background-color;
transition: .25s background-color; transition: .25s background-color;
} }
@ -2268,13 +2291,13 @@ button:focus {
border: 0; border: 0;
background: #fff; background: #fff;
border-radius: 50%; border-radius: 50%;
box-shadow: 0 0 0 2px #727e96 inset; -webkit-box-shadow: 0 0 0 2px #727e96 inset;
box-shadow: 0 0 0 2px #727e96 inset;
-webkit-transition: .25s background; -webkit-transition: .25s background;
transition: .25s background; transition: .25s background;
} }
.radio:checked ~ label:before { .radio:checked ~ label:before {
background-image: -webkit-radial-gradient(center circle, #fff 30%, transparent 38%);
background-image: radial-gradient(circle at center, #fff 30%, transparent 38%); background-image: radial-gradient(circle at center, #fff 30%, transparent 38%);
background-color: #727e96; background-color: #727e96;
background-position: center; background-position: center;
@ -2382,43 +2405,50 @@ button:focus {
.badge--primary { .badge--primary {
background-color: #0275D8; background-color: #0275D8;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.badge--success { .badge--success {
background-color: #5CB85C; background-color: #5CB85C;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.badge--info { .badge--info {
background-color: #5BC0DE; background-color: #5BC0DE;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.badge--warning { .badge--warning {
background-color: #F0AD4E; background-color: #F0AD4E;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.badge--danger { .badge--danger {
background-color: #D9534F; background-color: #D9534F;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.badge--inverse { .badge--inverse {
background-color: #292B2C; background-color: #292B2C;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.badge--ghost { .badge--ghost {
background-color: transparent; background-color: transparent;
color: #fff; color: #fff;
box-shadow: 0 0 0 1px #fff inset; -webkit-box-shadow: 0 0 0 1px #fff inset;
box-shadow: 0 0 0 1px #fff inset;
} }
.badge--small { .badge--small {
@ -2464,43 +2494,50 @@ button:focus {
.alert--primary { .alert--primary {
background-color: #0275D8; background-color: #0275D8;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.alert--success { .alert--success {
background-color: #5CB85C; background-color: #5CB85C;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.alert--info { .alert--info {
background-color: #5BC0DE; background-color: #5BC0DE;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.alert--warning { .alert--warning {
background-color: #F0AD4E; background-color: #F0AD4E;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.alert--danger { .alert--danger {
background-color: #D9534F; background-color: #D9534F;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.alert--inverse { .alert--inverse {
background-color: #292B2C; background-color: #292B2C;
color: #fff; color: #fff;
box-shadow: none; -webkit-box-shadow: none;
box-shadow: none;
} }
.alert--ghost { .alert--ghost {
background-color: transparent; background-color: transparent;
color: #fff; color: #fff;
box-shadow: 0 0 0 1px #fff inset; -webkit-box-shadow: 0 0 0 1px #fff inset;
box-shadow: 0 0 0 1px #fff inset;
} }
.alert--small { .alert--small {

2
css/knacss.css
View file

File diff suppressed because one or more lines are too long