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

Merge pull request #281 from PhilippeVay/typos-1805

Browse source 
Typos + ligne vide entre règles
This commit is contained in:
Raphael Goetter 2018-05-16 13:23:13 +02:00 committed by GitHub
commit acbfc58573
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 27 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
sass/_config/_variables.scss
View file

@ -5,7 +5,7 @@
// ----------------
// Warning: you should use your own values, regardless of the devices
// Best practise is Mobile First: (min-width: $breakpoint)
// Best practice is Mobile First: (min-width: $breakpoint)
$tiny : 480px !default; // or 'em' if you prefer, of course
$small : 576px !default;
$medium : 768px !default;

2
sass/_library/_layout.scss
View file

@ -8,7 +8,7 @@
overflow: hidden;
}
/* blocks that needs to be placed under floats */
/* blocks that need to be placed under floats */
.clear {
clear: both;
}

2
sass/_library/grillade-flex.scss
View file

@ -7,7 +7,7 @@
// Responsive breakpoints variables
// Warning : you should use your own values, regardless of the devices
// Best practise : (max-width: ($BP - 1)) and (min-width: $BP)
// Best practice : (max-width: ($BP - 1)) and (min-width: $BP)
$tiny: 480px !default; // or 'em' if you prefer, of course
$small: 576px !default;

1
sass/_library/grillade-grid.scss
View file

@ -87,6 +87,7 @@ $medium: 768px !default;
grid-column: auto / span #{$i};
}
}
[class*="-small-all"] {
grid-column: 1 / -1;
}

2
sass/components/_alerts.scss
View file

@ -42,11 +42,13 @@
width: 100% !important;
display: block;
}
&.disabled,
&--disabled {
opacity: 0.5;
cursor: not-allowed;
}
&:empty {
display: none;
}

1
sass/components/_badges.scss
View file

@ -44,6 +44,7 @@
opacity: 0.5;
cursor: not-allowed;
}
&:empty {
display: none;
}

6
sass/components/_buttons.scss
View file

@ -90,8 +90,8 @@ button {
}
// nav "burger" button
// active it with a JS toggle-class to .is-active
// recommanded HTML : <button class="nav-button" type="button" role="button" aria-label="open/close navigation"><i></i></button>
// activate it with a JS toggle-class to .is-active
// recommended HTML : <button class="nav-button" type="button" role="button" aria-label="open/close navigation"><i></i></button>
// see doc : https://knacss.com/styleguide.html#buttons
.nav-button {
padding: 0;
@ -141,7 +141,6 @@ button {
}
&.is-active {
& > * {
background-image: none;
justify-content: center;
@ -149,6 +148,7 @@ button {
&::before {
transform: translateY(50%) rotate3d(0,0,1,45deg);
}
&::after {
transform: translateY(-50%) rotate3d(0,0,1,-45deg);
}

12
sass/components/_checkbox.scss
View file

@ -2,9 +2,9 @@
/* ==Checkbox, radio, switch */
/* ----------------------------- */
/* use .checkbox class on input type=checkbox */
/* recommanded HTML : <input type="checkbox" class="checkbox" id="c1"><label for="c1">click here</label> */
/* recommended HTML : <input type="checkbox" class="checkbox" id="c1"><label for="c1">click here</label> */
/* use .radio class on input type=radio */
/* recommanded HTML : <input type="radio" class="radio" name="radio" id="r1"><label for="r1">Click here</label> */
/* recommended HTML : <input type="radio" class="radio" name="radio" id="r1"><label for="r1">Click here</label> */
/* use .switch class on input type=checkbox */
// <input type="checkbox" class="switch" id="switch"><label for="switch" class="label">slide to unlock</label>
@ -31,7 +31,7 @@
box-shadow: inset 0 0 0 1px $checkbox-color;
background: #fff;
~ label {
& ~ label {
cursor: pointer;
}
@ -48,17 +48,21 @@
font-size: 60%;
box-shadow: inset -#{$switch-size} 0 0 $switch-color, inset 0 0 0 1px $switch-color;
transition: box-shadow .15s;
&::before, &::after {
font-weight: bold;
color: #fff;
}
&::before {
content: "✕";
float: right;
margin-right: $switch-size /3;
}
&:checked {
box-shadow: inset #{$switch-size} 0 0 $color-success, inset 0 0 0 1px $color-success;
&::before {
content: "✓";
float: left;
@ -73,6 +77,7 @@
width: $checkbox-size;
height: $checkbox-size;
transition: background-color .15s;
&:checked {
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgOCA4IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA4IDgiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTYuNCwxTDUuNywxLjdMMi45LDQuNUwyLjEsMy43TDEuNCwzTDAsNC40bDAuNywwLjdsMS41LDEuNWwwLjcsMC43bDAuNy0wLjdsMy41LTMuNWwwLjctMC43TDYuNCwxTDYuNCwxeiINCgkvPg0KPC9zdmc+DQo=");
background-size: 60% 60%;
@ -87,6 +92,7 @@
width: $checkbox-size;
height: $checkbox-size;
transition: background-color .15s;
&:checked {
background-image: url("data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20standalone%3D%22no%22%3F%3E%3Csvg%20version%3D%221.1%22%20width%3D%2240%22%20height%3D%2240%22%0AviewBox%3D%220%200%2080%2080%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Ccircle%20cx%3D%2240%22%20cy%3D%2240%22%20r%3D%2224%22%20style%3D%22fill%3A%23ffffff%22/%3E%3C/svg%3E");
background-size: 80% 80%;

3
sass/components/_media.scss
View file

@ -1,7 +1,7 @@
/* ----------------------------- */
/* ==Media object */
/* ----------------------------- */
/* recommanded HTML : <div class="media"><img class="media-figure"><div class="media-content"></div></div> */
/* recommended HTML : <div class="media"><img class="media-figure"><div class="media-content"></div></div> */
/* see http://codepen.io/raphaelgoetter/pen/KMWWwj */
@media (min-width: $tiny) {
@ -17,6 +17,7 @@
&-figure--center {
align-self: center;
}
// reverse variant
&--reverse {
flex-direction: row-reverse;

1
sass/components/_tables.scss
View file

@ -40,6 +40,7 @@ table,
text-align: left;
cursor: default;
}
& thead {
color: $table-head-color;
background: $table-head-background;

1
sass/components/_tabs.scss
View file

@ -4,7 +4,6 @@
/* see example on https://knacss.com/styleguide.html#tabs */
/* NOTE : tabs need JavaScript to be activated */
.tabs-menu {
border-bottom: 2px solid $tabs-border;

2
sass/components/_tags.scss
View file

@ -39,11 +39,13 @@
width: 100% !important;
display: block;
}
&.disabled,
&--disabled {
opacity: 0.5;
cursor: not-allowed;
}
&:empty {
display: none;
}

4
sass/knacss.scss
View file

@ -42,12 +42,12 @@
@import "_library/base"; // basic styles
@import "_library/print"; // print quick reset
@import "_library/layout"; // alignment, modules, positionning
@import "_library/utilities"; // width and spacers helpers
@import "_library/utilities"; // width and spacer helpers
@import "_library/responsive"; // Responsive Web Design helpers
// @import "_library/wordpress"; // WordPress reset and basic styles
// New Grid System by default (Grid Layout). If you prefer old "Flexbox" Grid System, replace file with "_library/grillade-flex"
// Note that none of these file is prefixed by an underscore, in order to compile them.
// Note that none of these files are prefixed by an underscore, in order to compile them.
@import "_library/grillade-grid"; // grid system with Grid Layout
// Components