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

feat(heart): added new heart reaction state

Browse Source 
added the `is-half` and `is-transparent` to the `heart` reaction

feat #246
This commit is contained in:
Kaylum Lally
2019-12-16 21:52:26 +00:00
parent 2dcec7b40a
commit fbe2e5c4d3
6 changed files with 90 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
scss/icons/heart.scss
View File

@@ -19,6 +19,46 @@ $icon-heart: (
(0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0)
);
// prettier-ignore
$icon-heart-half: (
(0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0),
(0,0,2,2,2,0,0,0,0,0,2,2,2,0,0,0),
(0,2,3,3,3,2,0,0,0,2,0,0,0,2,0,0),
(2,3,1,1,3,3,2,0,2,0,0,0,0,0,2,0),
(2,3,1,3,3,3,3,2,0,0,0,0,0,0,2,0),
(2,3,3,3,3,3,3,3,0,0,0,0,0,0,2,0),
(2,3,3,3,3,3,3,3,0,0,0,0,0,0,2,0),
(2,3,3,3,3,3,3,3,0,0,0,0,0,0,2,0),
(0,2,3,3,3,3,3,3,0,0,0,0,0,2,0,0),
(0,0,2,3,3,3,3,3,0,0,0,0,2,0,0,0),
(0,0,0,2,3,3,3,3,0,0,0,2,0,0,0,0),
(0,0,0,0,2,3,3,3,0,0,2,0,0,0,0,0),
(0,0,0,0,0,2,3,3,0,2,0,0,0,0,0,0),
(0,0,0,0,0,0,2,4,2,0,0,0,0,0,0,0),
(0,0,0,0,0,0,0,2,0,0,0,0,0,0,0,0),
(0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0)
);
// prettier-ignore
$icon-heart-transparent: (
(0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0),
(0,0,2,2,2,0,0,0,0,0,2,2,2,0,0,0),
(0,2,0,0,0,2,0,0,0,2,0,0,0,2,0,0),
(2,0,0,0,0,0,2,0,2,0,0,0,0,0,2,0),
(2,0,0,0,0,0,0,2,0,0,0,0,0,0,2,0),
(2,0,0,0,0,0,0,0,0,0,0,0,0,0,2,0),
(2,0,0,0,0,0,0,0,0,0,0,0,0,0,2,0),
(2,0,0,0,0,0,0,0,0,0,0,0,0,0,2,0),
(0,2,0,0,0,0,0,0,0,0,0,0,0,2,0,0),
(0,0,2,0,0,0,0,0,0,0,0,0,2,0,0,0),
(0,0,0,2,0,0,0,0,0,0,0,2,0,0,0,0),
(0,0,0,0,2,0,0,0,0,0,2,0,0,0,0,0),
(0,0,0,0,0,2,0,0,0,2,0,0,0,0,0,0),
(0,0,0,0,0,0,2,0,2,0,0,0,0,0,0,0),
(0,0,0,0,0,0,0,2,0,0,0,0,0,0,0,0),
(0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0)
);
$icon-heart-empty-colors: (#adafbb);
// prettier-ignore
$icon-heart-empty: (

6
scss/icons/icons.scss
View File

@@ -70,6 +70,12 @@
&.heart::before {
@include pixelize($default-size, $icon-heart, $icon-heart-colors);
}
&.heart.is-half::before {
@include pixelize($default-size, $icon-heart-half, $icon-heart-colors);
}
&.heart.is-transparent::before {
@include pixelize($default-size, $icon-heart-transparent, $icon-heart-colors);
}
&.heart.is-empty::before {
@include pixelize($default-size, $icon-heart-empty, $icon-heart-empty-colors);
}