1
0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-08-29 08:50:06 +02:00

feat(icons): add charmander icon (#129)

* feat(icons): add charmander icon

* docs(icons): add charmander to storybook
This commit is contained in:
Igor Guastalla
2018-12-09 18:46:29 -02:00
committed by Abdullah Samman
parent 694299a133
commit a0f2a91675
4 changed files with 46 additions and 1 deletions

View File

@@ -16,6 +16,7 @@ stories.add('icon', () => {
'icon whatsapp': 'icon whatsapp', 'icon whatsapp': 'icon whatsapp',
'icon close': 'icon close', 'icon close': 'icon close',
pokeball: 'pokeball', pokeball: 'pokeball',
charmander: 'charmander',
squirtle: 'squirtle', squirtle: 'squirtle',
smartphone: 'smartphone', smartphone: 'smartphone',
phone: 'phone', phone: 'phone',

View File

@@ -240,7 +240,6 @@
<i class="icon twitch is-medium"></i> <i class="icon twitch is-medium"></i>
<i class="icon twitch is-large"></i> <i class="icon twitch is-large"></i>
<i class="icon reddit is-small"></i>
<i class="icon reddit"></i> <i class="icon reddit"></i>
<i class="icon reddit is-medium"></i> <i class="icon reddit is-medium"></i>
<i class="icon reddit is-large"></i> <i class="icon reddit is-large"></i>
@@ -269,6 +268,8 @@
<i class="mario"></i> <i class="mario"></i>
<i class="ash"></i> <i class="ash"></i>
<i class="pokeball"></i> <i class="pokeball"></i>
<i class="charmander"></i>
<i class="squirtle"></i> <i class="squirtle"></i>
<i class="smartphone"></i> <i class="smartphone"></i>

View File

@@ -9,6 +9,7 @@
@import "octocat.scss"; @import "octocat.scss";
@import "mario.scss"; @import "mario.scss";
@import "pokeball.scss"; @import "pokeball.scss";
@import "charmander.scss";
@import "squirtle.scss"; @import "squirtle.scss";
@import "phone.scss"; @import "phone.scss";
@import "smartphone.scss"; @import "smartphone.scss";

View File

@@ -0,0 +1,42 @@
.charmander {
$px: 6px;
// prettier-ignore
$charmander-colors: (#000202, #f77702, #eb2010,
#fdfcff, #e5d70a, #e7d70e);
// prettier-ignore
$charmander: (
(0,0,0,0,1,1,1,1,0,0,0,0,0,0,0,0,0,1),
(0,0,0,1,2,2,2,2,1,0,0,0,0,0,0,0,1,3,1),
(0,0,1,2,2,2,2,2,2,1,0,0,0,0,0,0,1,3,3,1),
(0,0,1,2,2,2,2,2,2,1,0,0,0,0,0,0,1,3,3,1),
(0,1,2,2,2,2,2,2,2,2,1,0,0,0,0,1,3,3,2,3,1),
(1,2,2,2,2,4,1,2,2,2,1,0,0,0,0,1,3,2,6,3,1),
(1,2,2,2,2,1,1,2,2,2,2,1,0,0,0,1,3,5,5,3,1),
(1,2,2,2,2,1,1,2,2,2,2,1,0,0,0,0,1,5,1,1),
(0,1,2,2,2,2,2,2,2,2,2,2,1,0,0,0,1,2,1),
(0,0,1,1,2,2,2,2,2,2,2,2,2,1,0,1,2,2,1),
(0,0,0,0,1,1,1,2,2,1,2,2,2,1,1,2,2,1),
(0,0,0,0,0,1,6,5,1,2,2,2,2,2,1,2,2,1),
(0,0,0,0,0,1,5,5,5,1,1,2,2,2,1,2,1),
(0,0,0,0,1,4,1,6,5,5,2,2,2,2,1,1),
(0,0,0,0,0,1,1,1,5,5,2,2,2,1,1),
(0,0,0,0,0,0,0,0,1,1,1,0,1,1),
(0,0,0,0,0,0,0,0,0,1,4,0,4,1),
(0,0,0,0,0,0,0,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($charmander, $charmander-colors, $px);
}
}