1
0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-04-21 22:52:42 +02:00
nes.css/scss/pixel-arts/pokeball.scss
2019-10-17 16:56:49 +09:00

38 lines
957 B
SCSS

.nes-pokeball {
$pokeball-colors: (#060606, #ff001d, #fff, #9fa1a1);
// prettier-ignore
$pokeball: (
(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,3,3,2,2,2,2,2,2,1,0,0),
(0,1,3,3,2,2,2,2,2,2,2,1,1,0),
(0,1,3,2,2,2,2,2,2,2,2,2,1,0),
(1,3,2,2,2,2,2,2,2,2,2,2,2,1),
(1,1,1,2,2,2,2,1,1,1,2,2,2,1),
(1,1,1,1,2,2,1,3,3,3,1,2,2,1),
(1,4,3,1,1,1,1,3,3,3,1,1,1,1),
(0,1,3,3,3,1,1,3,3,3,1,3,1,0),
(0,1,3,3,3,3,3,1,1,1,3,3,1,0),
(0,0,1,4,4,3,3,3,3,3,3,1,0,0),
(0,0,0,1,1,4,4,4,4,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($pokeball, 1));
height: $size * length($pokeball);
&::before {
position: absolute;
top: -$size;
left: -$size;
content: "";
background: transparent;
@include pixelize($size, $pokeball, $pokeball-colors);
@include fill-gaps();
}
}