yuff | Recolle Simple CR Code

Hey guys it's been a bit! So I joined

recolle recently, and it's been a lot of fun! As such, I felt inspired to make a simple CR code that kinda matches the Retrospect layout.

Live Preview

CODE:

<raw-code><div id="container" style="display: block; width: 100%;">

<center>
    

<div style="display: inline-block; background-color: #FFF; width: 325px; height: 110px; margin: 5px; border-radius: 5px; border: 1px solid rgba(0, 153, 255, 0.6); box-shadow: 1px 1px 0px #47738E;">

<div style="display: inline-block; margin: 5px;">
<img src="ICON-URL HERE" style="border-radius: 50px; border: 1px solid #0055ee;"></div>

  

<div style="display: inline-block; width: 203px; height: 100px; float: right; margin: 5px;"><div style="border-bottom: 1px solid #0099ff;"><div style="height: 35px; text-align: left; padding-left: 5px">
<span style="font-size: 15px; font-family:helvetica; color:#0055ee; line-height:35px; letter-spacing:1px; text-transform: uppercase; text-shadow: #47738E 0px 1px 1px;">AU Name</span></div>

<div style="height: 20px; text-align: left; padding-left: 5px;"><span style="font-family: helvetica, arial, sans-serif; font-size:10px; color:#888; letter-spacing:1px; text-align:justify; line-height: 10px; text-transform: uppercase;">
<a href="URL" style="text-decoration: none; color: #888;">Journal</a> <img src="http://i.imgur.com/grmg3D7.png" style="width:10px;"> Canon Name </span></div></div>

<div style="height: 45px; text-align: left; padding-left: 5px; padding-top: 5px; font-family: helvetica, arial, sans-serif; color:#888; font-size: 10px; letter-spacing: 0.5px; text-transform: uppercase;">Short Blurb.</div></div>

</div>

</center>

</div></raw-code>
<div style="text-align: center; font-family: verdana; font-size: 90%; font-variant: small-caps;">Code by <a href="http://yuff.dreamwidth.org">Yuff</a></div>

NOTES:

The text area allows for about 2-3 small lines of text. Someday I might make a version that'll allow for more text, but I wanted to keep this simple.

Downside is superlong names can sometimes mess up the code. You can lower the font size or just shorten the name somehow.

I do request/recommend uploading your own version of the Retrospec flower just to save on bandwidth.

This is compatible with Slip's CR chart automation algorithm, so take advantage of that if you wish.

Modifications are totally fine. I'd love to see what you do with it though!

Comments are nice but not necessary. However, please leave the credit line on!