Andrew Pougher Quotes Thingy
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<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> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
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; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{"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