Skip to content

Instantly share code, notes, and snippets.

@califa

califa/dabblet.css

Created March 8, 2012 15:20
Show Gist options
  • Save califa/2001472 to your computer and use it in GitHub Desktop.
Save califa/2001472 to your computer and use it in GitHub Desktop.
Download ZIP
The first commented line is your dabblet’s title
Raw
dabblet.css
/**
* The first commented line is your dabblet’s title
*/
* { padding: 0; margin: 0 }
html, body { height: 100%; background: #171717; }
.map {
width: 100%;
position: relative;
}
.background { width: 100%; }
.background img { width: 100%; }
.mappointer {
font-size: 35px;
color: #7c7c7c;
/*text-shadow: 2px 2px 0 #000, -2px 2px 0 #000, 2px -2px 0 #000, -2px -2px 0 #000, 0 -3px 0 #000, -3px 0 0 #000, 0 3px 0 #000, 3px 0 0 #000 ;
*/position: absolute;
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: rgba(0,0,0,0.5);
}
.mappointer.star {
font-size: 15px;
color: #c49600;
}
.pointer1 {
top: 40%;
left: 40%;
}
.pointer2 {
top: 70%;
left: 20%;
}
.pointer4 {
top: 10%;
left: 10%;
}
.pointer3 {
top: 10%;
left: 80%;
}
Raw
dabblet.html
<div class="map">
<div class="background"><img src="http://webspace.newschool.edu/~calij942/play/crypt/img/mapbg.png" />
<div class="mappointer pointer1">&#x2022;</div>
<div class="mappointer star pointer2">&#x2605;</div>
<div class="mappointer star pointer3">&#x2605;</div>
<div class="mappointer pointer4">&#x2022;</div>
</div>
</div>
<!-- content to be placed inside <body>…</body> -->
Raw
settings.json
{"view":"split-vertical","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment