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:
committed by
Abdullah Samman
parent
694299a133
commit
a0f2a91675
@@ -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',
|
||||||
|
@@ -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>
|
||||||
|
@@ -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";
|
42
scss/pixel-arts/charmander.scss
Normal file
42
scss/pixel-arts/charmander.scss
Normal 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);
|
||||||
|
}
|
||||||
|
}
|
Reference in New Issue
Block a user