mirror_css/nes.css
1
0
Fork 0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-08-25 15:10:48 +02:00
Code Issues Releases Wiki Activity

fix(buttons.scss): fix focus color of buttons

Browse Source 
fix #74
This commit is contained in:
BcRikko
2019-07-07 14:30:09 +09:00
parent 883befca3e
commit 99b7296b44
2 changed files with 6 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/script.js
View File

@@ -11,7 +11,7 @@ const sampleCollection = [
{ {
title: 'buttons', title: 'buttons',
showCode: false, showCode: false,
code: `<a class="nes-btn">Normal</a> code: `<a class="nes-btn" href="#">Normal</a>
<button type="button" class="nes-btn is-primary">Primary</button> <button type="button" class="nes-btn is-primary">Primary</button>
<button type="button" class="nes-btn is-success">Success</button> <button type="button" class="nes-btn is-success">Success</button>

7
scss/elements/buttons.scss
View File

@@ -12,8 +12,7 @@
box-shadow: inset -4px -4px $shadow; box-shadow: inset -4px -4px $shadow;
} }
&:hover, &:hover {
&:focus {
color: inherit; color: inherit;
text-decoration: none; text-decoration: none;
background-color: $hover-background; background-color: $hover-background;
@@ -23,6 +22,10 @@
} }
} }
&:focus {
box-shadow: 0 0 0 6px rgba($shadow, 0.3);
}
&:active:not(.is-disabled)::after { &:active:not(.is-disabled)::after {
box-shadow: inset 4px 4px $shadow; box-shadow: inset 4px 4px $shadow;
} }