-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
a2a9ade
commit 8d09220
Showing
1 changed file
with
6 additions
and
7 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,10 +1,9 @@ | ||
# Fancy Sprites | ||
Fancy sprites is a very minimalistic spriting solution for your web projects based on spritesmith. | ||
Fancy sprites is a very minimalistic spriting solution for your web projects based on [spritesmith](https://github.com/Ensighten/spritesmith). | ||
|
||
It gives you the flexibility to provide sprite sheets in multiple resolutions. | ||
|
||
Sample configuration | ||
|
||
Sample configuration with '1x', '2x' sprite sheets: | ||
``` JavaScript | ||
{ | ||
create: { | ||
|
@@ -28,7 +27,7 @@ Sample configuration | |
} | ||
``` | ||
|
||
The task then automatically gathers multiple versions of the same sprite based on the return value of `spriteName`. Here is what the generated SCSS file then looks like: | ||
The task then automatically gathers multiple versions of the same sprite based on the return value of the `spriteName` function. Here is what the generated SCSS file then looks like: | ||
|
||
``` SCSS | ||
$sprite-first: "1x" 416px 0px 200px 200px 1100px 925px, "2x" 816px 0px 400px 400px 2160px 1810px; | ||
|
@@ -38,8 +37,8 @@ $sprites: "first" $sprite-first, "second" $sprite-second; | |
``` | ||
|
||
Files: | ||
- first.png | ||
- [email protected] | ||
- second.png | ||
- `first.png` | ||
- `[email protected]` | ||
- `second.png` | ||
|
||
See fancy-sprites-styles for a SCSS Mixin that consumes this output. |