Skip to content

Instantly share code, notes, and snippets.

@Holek

Holek/dabblet.css

Created February 25, 2013 11:33
Show Gist options
  • Save Holek/5029246 to your computer and use it in GitHub Desktop.
Save Holek/5029246 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
*/
.apple {
display:block;
height: 273px;
width: 1024px;
background-color: #EA294C;
background-image: -webkit-linear-gradient(left, #EA294C, #EA294C 16.6%, #EA6F3C 16.6%,
#EA6F3C 33%, #E8E7AE 33%, #E8E7AE 50%, #59C65E 50%, #59C65E 66%, #3597C9 66%, #3597C9 83.3%, #7A268A 83.3%, #7A268A); /* Chrome 10-25, iOS 5+, Safari 5.1+ */
background-image: -moz-linear-gradient(left, #EA294C, #EA294C 16.6%, #EA6F3C 16.6%,
#EA6F3C 33%, #E8E7AE 33%, #E8E7AE 50%, #59C65E 50%, #59C65E 66%, #3597C9 66%, #3597C9 83.3%, #7A268A 83.3%, #7A268A); /* Firefox 3.6-15 */
background-image: -o-linear-gradient(left, #EA294C, #EA294C 16.6%, #EA6F3C 16.6%,
#EA6F3C 33%, #E8E7AE 33%, #E8E7AE 50%, #59C65E 50%, #59C65E 66%, #3597C9 66%, #3597C9 83.3%, #7A268A 83.3%, #7A268A); /* Opera 11.10-12.00 */
background-image: linear-gradient(to right, #EA294C, #EA294C 16.6%, #EA6F3C 16.6%,
#EA6F3C 33%, #E8E7AE 33%, #E8E7AE 50%, #59C65E 50%, #59C65E 66%, #3597C9 66%, #3597C9 83.3%, #7A268A 83.3%, #7A268A); /* Chrome 26, Firefox 16+, IE 10+, Opera 12.50+ */
}
img[alt]{
background:red;
-webkit-blend-mode: multiply;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div class="apple"></div>
<img alt="Railslove" src="http://railslove.com/assets/railslove-logo-175x42-cf635eb5d4b207876fde9769a8db2773.png">
<img src="http://img.poltyn.com/rainbow-20130225-134333.png">
Raw
dabblet.js
// alert('Hello world!');
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