Skip to content

Instantly share code, notes, and snippets.

@apougher
Forked from anonymous/dabblet.css
Last active August 29, 2015 14:06
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save apougher/f753dea8a182bf56fd25 to your computer and use it in GitHub Desktop.
Andrew Pougher Quotes Thingy
<blockquote class="quotebox">
<p>I am going to integrate this into JSON, Mustache and JQuery so that it auto generates and such. NO JS yet. Hmm, Never used dabblet before but this seems rather nice.</p>
</blockquote>
<div class="arrow-down"></div>
<p class="quotebox-author">Andrew Pougher | <span>World Weary Wabbit</span></p>
/*
Andrew Pougher Quotes Thingy
*/body { margin: 50px; width: 600px; }
.quotebox {
margin: 0;
background: #48340c;
padding: 10px 50px;
position: relative;
font-family: Georgia, serif;
color: #fff;
border-radius: 5px;
font-style: italic;
text-shadow: 0 1px 0 #22340c;
background-image: linear-gradient(#48340c, #5b4310);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#48340c), to(#5b4310));
background-image: -webkit-linear-gradient(top, #48340c, #5b4310);
background-image: -moz-linear-gradient(top, #48340c, #5b4310);
background-image: -ms-linear-gradient(top, #48340c, #5b4310);
background-image: -o-linear-gradient(top, #48340c, #5b4310);
}
.quotebox:before, .quotebox:after {
content: "\201C";
position: absolute;
font-size: 80px;
line-height: 1;
color: #c8340c;
font-style: normal;
}
.quotebox:before {
top: 0;
left: 10px;
}
.quotebox:after {
content: "\201D";
right: 10px;
bottom: -0.5em;
}
.arrow-down {
width: 0;
height: 0;
border-left: 15px solid transparent;
border-right: 15px solid transparent;
border-top: 15px solid #5b4310;
margin: 0 0 0 25px;
}
.quotebox-author {
margin: 0 0 0 25px;
font-family: Arial, Helvetica, sans-serif;
color: #999;
text-align:left;
}
.quotebox-author span {
font-size: 12px;
color: #666;
}​
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment