Another sprite example, this one uses the generated mixins.
@ -5,3 +5,4 @@ sass_dir = "src"
|
||||
images_dir = "images"
|
||||
output_style = :compact
|
||||
relative_assets = true
|
||||
line_comments = false
|
||||
|
1
examples/compass/images/.gitignore
vendored
@ -1 +1,2 @@
|
||||
flag-*.png
|
||||
emblem-*.png
|
||||
|
BIN
examples/compass/images/emblem/favorite.png
Normal file
After Width: | Height: | Size: 1.5 KiB |
BIN
examples/compass/images/emblem/important.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
BIN
examples/compass/images/emblem/photos.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
BIN
examples/compass/images/emblem/readonly.png
Normal file
After Width: | Height: | Size: 1.0 KiB |
BIN
examples/compass/images/emblem/symbolic-link.png
Normal file
After Width: | Height: | Size: 1.1 KiB |
BIN
examples/compass/images/emblem/system.png
Normal file
After Width: | Height: | Size: 1.7 KiB |
BIN
examples/compass/images/emblem/unreadable.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
@ -21,3 +21,17 @@
|
||||
%td.tw
|
||||
%td.rs
|
||||
%td.gb
|
||||
%h1 Emblems
|
||||
%table#emblems
|
||||
%tr
|
||||
%td.favorite
|
||||
%td.important
|
||||
%td.photos
|
||||
%tr
|
||||
%td.readonly
|
||||
%td.symbolic-link
|
||||
%td.system
|
||||
%tr
|
||||
%td.unreadable
|
||||
%td
|
||||
%td
|
||||
|
@ -1,5 +1,5 @@
|
||||
$flag-position: 2px;
|
||||
@import "flag/*.png";
|
||||
@import "emblem/*.png";
|
||||
|
||||
.flag-sprite {
|
||||
width: image-width("flag/us.png");
|
||||
@ -7,6 +7,19 @@ $flag-position: 2px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#flags {
|
||||
@include sprites($flag-sprites, us de ca au cn cz nz jp scotland tw rs gb, $flag-sprite-base-class, $prefix: false);
|
||||
.emblem-sprite {
|
||||
width: image-width("emblem/favorite.png");
|
||||
height: image-height("emblem/favorite.png");
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#flags {
|
||||
@include sprites($flag-sprites,
|
||||
us de ca au cn cz nz jp scotland tw rs gb,
|
||||
$flag-sprite-base-class,
|
||||
$prefix: false);
|
||||
}
|
||||
|
||||
#emblems {
|
||||
@include all-emblem-sprites($prefix: false);
|
||||
}
|