Skip to content

Instantly share code, notes, and snippets.

@hongymagic
Created April 12, 2012 01:57
Show Gist options
  • Save hongymagic/2364243 to your computer and use it in GitHub Desktop.
Save hongymagic/2364243 to your computer and use it in GitHub Desktop.
Game icon for ABC Brainfit
/**
* Game icon for ABC Brainfit
*/
.game,.game.locked::after,.game h4 {
display:block;
margin:0;
box-sizing:border-box
}
.game,.game.locked::after {
padding:0;
width:100px;
height:100px
}
.game {
position:relative;
background:transparent url(http://placehold.it/100x100) top left no-repeat;
border:3px solid white;
border-radius:10px;
cursor:pointer
}
.game.locked::after {
opacity:0.5;
content:'';
background:transparent url(http://brainfit-cedar.herokuapp.com/assets/locked.png) 27px 9px no-repeat
}
.game h4 {
padding:0.3em;
width:100%;
position:absolute;
bottom:0;
left:0;
font:normal normal 300 10pt/100% Arial;
text-align:center;
background:#2b2b2b;
border-radius:5px;
color:#fff
}
<a class="game">
<h4>Bridge</h4>
</a>
<a class="game locked">
<h4>Abstract</h4>
</a>
{"view":"separate","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment