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

burger rename

Browse source
This commit is contained in:
Raphael Goetter 2017-09-07 18:52:29 +02:00
parent 5e1c4bced1
commit 57b057a5f5
4 changed files with 12 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
css/knacss-unminified.css
View file

@ -2182,7 +2182,7 @@ button:focus {
outline: none;
}
.button-burger {
.nav-button {
padding: 0;
background-color: transparent;
outline: 0;
@ -2191,7 +2191,7 @@ button:focus {
-webkit-tap-highlight-color: transparent;
}
.button-burger > * {
.nav-button > * {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
@ -2224,7 +2224,7 @@ button:focus {
will-change: transform, background;
}
.button-burger > *::before, .button-burger > *::after {
.nav-button > *::before, .nav-button > *::after {
content: "";
height: 5px;
background: #333;
@ -2237,23 +2237,23 @@ button:focus {
will-change: transform, top;
}
.button-burger:hover > * {
.nav-button:hover > * {
background-color: transparent;
}
.button-burger.is-active > * {
.nav-button.is-active > * {
background-image: none;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.button-burger.is-active > *::before {
.nav-button.is-active > *::before {
-webkit-transform: translateY(50%) rotate3d(0, 0, 1, 45deg);
transform: translateY(50%) rotate3d(0, 0, 1, 45deg);
}
.button-burger.is-active > *::after {
.nav-button.is-active > *::after {
-webkit-transform: translateY(-50%) rotate3d(0, 0, 1, -45deg);
transform: translateY(-50%) rotate3d(0, 0, 1, -45deg);
}

2
css/knacss.css
View file

File diff suppressed because one or more lines are too long

2
sass/_config/_variables.scss
View file

@ -74,7 +74,7 @@ $background-tabs : transparent;
$background-tabs-active : transparent;
$border-radius-tabs : 0;
// burger button
// nav burger button
$color-burger : $color-gray1;
$background-burger : transparent;
$background-burger-hover : transparent;

6
sass/components/_buttons.scss
View file

@ -92,11 +92,11 @@ button {
}
}
// burger button
// nav "burger" button
// active it with a JS toggle-class to .is-active
// recommanded HTML : <button class="button-burger" type="button" role="button" aria-label="open/close navigation"><i></i></button>
// recommanded 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
.button-burger {
.nav-button {
padding: 0;
background-color: transparent;
outline: 0;