mirror_css/nes.css
1
0
Fork 0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-08-31 09:41:47 +02:00
Code Issues Releases Wiki Activity

Merge branch 'develop' into responsive-demo-page

Browse Source
This commit is contained in:
ダーシノ
2018-12-10 21:03:44 +09:00
committed by GitHub
parent 93de62e5c8 e35336d846
commit ee856c8b59
6 changed files with 43 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
docs/icons.stories.js
View File

@@ -20,6 +20,7 @@ stories.add('icon', () => {
'nes-charmander': 'nes-charmander',
'nes-squirtle': 'nes-squirtle',
'nes-smartphone': 'nes-smartphone',
'nes-kirby': 'nes-kirby',
'nes-phone': 'nes-phone',
'nes-octocat animate': 'nes-octocat animate',
'nes-ash': 'nes-ash',

1
index.html
View File

@@ -308,6 +308,7 @@
<i class="nes-smartphone"></i>
<i class="nes-phone"></i>
<i class="nes-kirby"></i>
</div>
</section>

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

@@ -14,3 +14,4 @@
@import "squirtle.scss";
@import "phone.scss";
@import "smartphone.scss";
@import "kirby.scss";

2
scss/pixel-arts/ash.scss
View File

@@ -24,7 +24,7 @@
position: relative;
display: inline-block;
width: $px * 15;
width: $px * 14;
height: $px * 15;
&::before {

38
scss/pixel-arts/kirby.scss Normal file
View File

@@ -0,0 +1,38 @@
.nes-kirby {
$px: 6px;
$kirby-colors: (#000, #ffaccc, #ff5478);
// prettier-ignore
$kirby: (
(0,0,1,1,0,1,1,1,1,1,0,0,0,0),
(0,1,2,2,1,2,2,2,2,2,1,1,0,0),
(1,2,2,1,2,2,2,2,2,2,2,2,1,0),
(1,2,2,2,2,2,1,2,1,2,2,2,2,1),
(1,2,2,2,2,2,1,2,1,2,2,2,2,1,),
(1,2,2,2,2,2,1,2,1,2,2,2,2,2,1),
(1,2,2,2,3,3,2,2,2,3,3,2,2,2,2,1),
(1,2,2,2,2,2,2,1,2,2,2,2,2,2,2,1),
(0,1,2,2,2,2,2,1,2,2,2,2,2,2,2,1),
(0,1,2,2,2,2,2,2,2,2,2,2,1,1,1,0),
(0,1,2,2,2,2,2,2,2,2,2,1,3,3,3,1),
(0,0,1,2,2,2,2,2,2,2,1,3,3,3,3,1),
(0,0,1,1,2,2,2,2,2,2,1,3,3,3,3,1),
(0,1,3,3,1,1,2,2,2,1,3,3,3,3,1),
(1,3,3,3,3,3,1,1,1,1,1,3,3,1),
(0,1,1,1,1,1,1,0,0,0,1,1,1,0)
);
position: relative;
display: inline-block;
width: $px * 16;
height: $px * 16;
&::before {
position: absolute;
top: $px * -1;
left: $px * -1;
content: "";
background: transparent;
@include pixelize($kirby, $kirby-colors, $px);
}
}

2
scss/pixel-arts/mario.scss
View File

@@ -25,7 +25,7 @@
position: relative;
display: inline-block;
width: $px * 16;
width: $px * 14;
height: $px * 16;
&::before {