mirror_css/nes.css
1
0
Fork 0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-04-22 15:12:19 +02:00
Code Issues Releases Wiki Activity

fix: move icon-coin to the icons folder

Browse Source
This commit is contained in:
Mati 2019-02-09 21:10:27 +01:00
parent 39bf7f2969
commit eaf396eb94
5 changed files with 24 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/icons.stories.js
View File

@ -17,6 +17,7 @@ stories.add('icon', () => {
'nes-icon gmail': 'nes-icon gmail',
'nes-icon linkedin': 'nes-icon linkedin',
'nes-icon close': 'nes-icon close',
'nes-icon coin': 'nes-icon coin',
'nes-pokeball': 'nes-pokeball',
'nes-bulbasaur': 'nes-bulbasaur',
'nes-charmander': 'nes-charmander',
@ -32,7 +33,6 @@ stories.add('icon', () => {
'nes-jp-logo': 'nes-jp-logo',
'snes-logo': 'snes-logo',
'snes-jp-logo': 'snes-jp-logo',
'nes-coin': 'nes-coin',
}, 'nes-icon twitter');
const selectedSize = radios('size', {
default: '',

18
scss/icons/coin.scss Normal file
View File

@ -0,0 +1,18 @@
$icon-coin-colors: (#060606,#ffd700, #daa520);
// prettier-ignore
$icon-coin: (
(0,0,0,0,0,1,1,1,1,0,0,0,0,0),
(0,0,0,1,1,2,2,2,2,1,1,0,0,0),
(0,0,1,2,2,1,1,1,1,2,2,1,0,0),
(0,1,2,1,1,3,3,3,3,1,2,1,1,0),
(0,1,2,1,3,3,3,3,3,3,1,2,1,0),
(1,2,1,3,3,3,3,3,3,3,3,1,2,1),
(1,2,1,3,3,3,3,3,3,3,3,1,2,1),
(1,2,1,3,3,3,3,3,3,3,3,1,2,1),
(1,2,1,3,3,3,3,3,3,3,3,1,2,1),
(0,1,2,1,3,3,3,3,3,3,1,2,1,0),
(0,1,2,1,1,3,3,3,3,1,2,2,1,0),
(0,0,1,2,2,1,1,1,1,2,2,1,0,0),
(0,0,0,1,1,2,2,2,2,1,1,0,0,0),
(0,0,0,0,0,1,1,1,1,0,0,0,0,0),
);

5
scss/icons/icons.scss
View File

@ -19,6 +19,7 @@
// others
@import "close.scss";
@import "trophy.scss";
@import "coin.scss";
.nes-icon {
$default-size: 1px;
@ -146,4 +147,8 @@
&.linkedin::before {
@include pixelize($default-size, $icon-linkedin, $icon-linkedin-colors);
}
&.coin::before {
@include pixelize($default-size, $icon-coin, $icon-coin-colors);
}
}

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

@ -15,4 +15,3 @@
@import "mario.scss";
@import "kirby.scss";
@import "octocat.scss";
@import "coin.scss";

36
scss/pixel-arts/coin.scss
View File

@ -1,36 +0,0 @@
.nes-coin {
$coin-colors: (#060606,#ffd700, #daa520);
// prettier-ignore
$coin: (
(0,0,0,0,0,1,1,1,1,0,0,0,0,0),
(0,0,0,1,1,2,2,2,2,1,1,0,0,0),
(0,0,1,2,2,1,1,1,1,2,2,1,0,0),
(0,1,2,1,1,3,3,3,3,1,2,1,1,0),
(0,1,2,1,3,3,3,3,3,3,1,2,1,0),
(1,2,1,3,3,3,3,3,3,3,3,1,2,1),
(1,2,1,3,3,3,3,3,3,3,3,1,2,1),
(1,2,1,3,3,3,3,3,3,3,3,1,2,1),
(1,2,1,3,3,3,3,3,3,3,3,1,2,1),
(0,1,2,1,3,3,3,3,3,3,1,2,1,0),
(0,1,2,1,1,3,3,3,3,1,2,2,1,0),
(0,0,1,2,2,1,1,1,1,2,2,1,0,0),
(0,0,0,1,1,2,2,2,2,1,1,0,0,0),
(0,0,0,0,0,1,1,1,1,0,0,0,0,0),
);
$size: 6px;
position: relative;
display: inline-block;
width: $size * length(nth($coin, 1));
height: $size * length($coin);
&::before {
position: absolute;
top: -$size;
left: -$size;
content: "";
background: transparent;
@include pixelize($size, $coin, $coin-colors);
}
}