mirror_css/nes.css
1
0
Fork 0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-09-01 18:13:32 +02:00
Code Issues Releases Wiki Activity

feat(icons): add psone controller icon

Browse Source
This commit is contained in:
Igor Guastalla de Lima
2019-01-20 12:02:11 -02:00
parent 1f062e222d
commit d905c1b4d6
4 changed files with 36 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
docs/icons.stories.js
View File

@@ -32,6 +32,7 @@ stories.add('icon', () => {
'nes-jp-logo': 'nes-jp-logo',
'snes-logo': 'snes-logo',
'snes-jp-logo': 'snes-jp-logo',
'nes-psone': 'nes-psone',
}, 'nes-icon twitter');
const selectedSize = radios('size', {
default: '',

1
index.html
View File

@@ -440,6 +440,7 @@
<i class="nes-jp-logo"></i>
<i class="snes-logo"></i>
<i class="snes-jp-logo"></i>
<i class="nes-psone"></i>
</div>
</section>
</section>

1
scss/pixel-arts/_index.scss
View File

@@ -14,4 +14,5 @@
@import "smartphone.scss";
@import "mario.scss";
@import "kirby.scss";
@import "psone.scss";
@import "octocat.scss";

33
scss/pixel-arts/psone.scss Normal file
View File

@@ -0,0 +1,33 @@
.nes-psone {
$psone-colors: (#cbcbcb, #b1b1b2, #2a2a2a);
// prettier-ignore
$psone: (
(0,0,0,0,0,0,0,3,0,0,0,0,0,0,0,0),
(0,0,1,1,1,0,0,3,0,0,0,1,1,1,0,0),
(0,1,1,1,1,1,0,0,3,0,1,1,1,1,1,0),
(1,1,1,3,1,1,1,1,1,1,1,1,3,1,1,1),
(1,1,3,1,3,1,1,1,1,1,1,3,1,3,1,1),
(1,1,1,3,1,1,1,1,1,1,1,1,3,1,1,1),
(2,1,1,1,1,1,3,1,1,3,1,1,1,1,1,2),
(2,2,1,1,1,0,0,0,0,0,0,1,1,1,2,2),
(2,2,2,2,0,0,0,0,0,0,0,0,2,2,2,2),
(0,2,2,0,0,0,0,0,0,0,0,0,0,2,2,0)
);
position: relative;
display: inline-block;
width: calc(1em * 16);
height: calc(1em * 11);
font-size: 3px;
&::before {
position: absolute;
top: -1em;
left: -1em;
content: "";
background: transparent;
@include pixelize($psone, $psone-colors);
}
}