Skip to content

Instantly share code, notes, and snippets.

@hshoff
Created October 14, 2011 13:53
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save hshoff/1287174 to your computer and use it in GitHub Desktop.
Save hshoff/1287174 to your computer and use it in GitHub Desktop.
Airbnb - Star Rating SASS
// stars.scss
// compiles to stars.css
$starWidth: 44px;
$starOffset: 0 -43px;
$numStars: 5;
$steps: 2;
$total: $numStars * $steps;
@mixin filled($n: 0) {
width: ($starWidth / $steps) * $n;
}
.stars {
background: url(/images/sprite.png) repeat-x top left;
height: 43px;
&.empty {
background-position: $starOffset;
width: $numStars * $starWidth;
}
@for $i from 0 through ($total) {
&.filled_#{$i} { @include filled($i) }
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment