Skip to content

Instantly share code, notes, and snippets.

@lucasmazza

lucasmazza/dabblet.css

Forked from chriscoyier/dabblet.css
Created September 24, 2012 13:16
Show Gist options
  • Save lucasmazza/3775903 to your computer and use it in GitHub Desktop.
Save lucasmazza/3775903 to your computer and use it in GitHub Desktop.
Download ZIP
Ratings Stars
Raw
dabblet.css
/*
Ratings Stars
(with as little code as possible)
*/
.rating {
unicode-bidi: bidi-override;
direction: rtl;
text-align: center;
}
.rating > span {
display: inline-block;
position: relative;
width: 1.1em;
}
.rating > span:hover,
.rating > span:hover ~ span {
color: transparent;
}
.rating > span:hover,
.rating > span:hover ~ span,
.rating > span.selected,
.rating > span.selected ~ span {
background-color: gold;
color: white;
}
body { padding: 100px; }
Raw
dabblet.html
<div class="rating">
<span>5</span><span>4</span><span>3</span><span>2</span><span>1</span>
</div>
<div class="rating">
<span>5</span><span>4</span><span class='selected'>3</span><span>2</span><span>1</span>
</div>
Raw
settings.json
{"view":"split","fontsize":"80","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment