thread tracker: minty fresh

[mistojen]

lydia martin's threads

August 2016

name of thread with Allison Argent

name of thread with Isaac Lahey

name of thread with Stiles Stilinski

name of thread with Kira Yukimura

name of thread with Scott McCall

'minty fresh' design by mistojen

instructions:

1. Replace the following:
   • CHARACTERNAME (your character; if your character's name is long, you can change the 700px settings to something larger or reduce the font size of that div.)
   • ICONURL (url for icon of your character 100x100)
   • MONTH/YEAR
   • CRPARTNERJOURNAL (url to your cr partner's journal)
   • CRICONURL (url for icon of the character you're threading with; image will resize itself, so any square image will do.)
   • URLGOESHERE (url to the thread)
   • THREADNAME (title of meme, for example)
   • CRCHARACTERNAME (the name of the character you're threading with)
2. Please do not remove credit.
3. If you have any questions or run into hiccups, please feel free to comment below and I'll try to get back to you ASAP to help.
4. Enjoy!

to change the colors:

#009E4C rgba(0,158,76,.4) #000

code:
<center><lj-raw><table style="width: 700px;"> <tr style="margin-bottom: -20px;"> <td colspan="2" style="width: 700px;font-family: georgia, serif; font-size: 40px; font-style: italic; font-weight: bold;"><div style="display: inline-block; float: left; vertical-align: middle; margin-top: 25px; margin-right: 10px; color: #000;text-shadow: -2px 2px 2px rgba(0,158,76, 1);">CHARACTERNAME's threads</div><div style="display: inline-block; float: left;"><img src="ICONURL" style="-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; padding: 3px; border: 2px solid #009E4C;"></div></td></tr> <tr> <td colspan="2" style="font-family: georgia, serif; font-size: 30px; padding-bottom: 20px; color: #000;text-decoration: underline;margin-top: -10px;">MONTH/YEAR<br></td> </tr> <tr style="height: 20px;"><td></td></tr> <!-----THREAD-------> <tr><td> <div style="margin-left: 50px;"><div style="display: inline-block; float: left;"><a href="CRPARTNERJOURNAL"><img src="CRICONURL" style="-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; width: 70px; height: 70px; border: 2px solid #009E4C; margin-right: -15px; margin-top: -25px;"></a></div> <div style="display: inline-block; float: left; -moz-border-radius: 15px 55px 0 15px;-webkit-border-radius: 15px 55px 0 15px; border-radius: 15px 55px 0 15px; padding: 2px 40px; background-color: rgba(0,158,76,.4); font-family: 'century gothic'; font-size: 10px; letter-spacing: 1px; margin-top: -1px;width: 353px;"><a href="URLGOESHERE" style="text-decoration:none; color: #000;">THREADNAME</a></div><br> <div style="float: left; -moz-border-radius-topright: 0 0 55px 55px; -webkit-border-radius: 0 0 55px 55px; border-radius: 0 0 55px 55px; padding: 2px 20px 2px 45px; background-color: rgba(0,158,76,.4); font-family: 'century gothic'; font-size: 10px; letter-spacing: 1px;width: 343px; margin-left: 25px; margin-top: 0;">with CRCHARACTERNAME</div> </div> </td></tr> <!-------END THREAD-------> <!------NEXT THREAD START-----> <!------END SECOND THREAD-------> </table> <div style="display: block;width: 412px; text-align: center; font-family: 'century gothic'; font-size: 11px;">'minty fresh' design by <a style="color: #000; text-decoration: none;" href="http://mistojen.dreamwidth.org/">mistojen</a></div>

Comments

[camalyng]

Hello! I'm using this as a CR chart and the title bubbles aren't going slightly transparent over the icons like here. What do?

[mistojen]

I had to use Firefox to look at this (I totally forgot that that was a thing; I use Chrome Canary now and don't see it lol), but! I figured it out.

For your blue bubbles, you've got:

background-color: rgba(117, 195, 238, 1)

That 1 sets the opacity. In my code, I've set it to .4 which is why it's more transparent, so if you tweak that last number then that should do it!

[camalyng]

Aha! Thank you so much, fixed now. I used a hex to RGBA converter to get that blue and was afraid to touch the 1 :'D

[mistojen]

Ahhh yeah, for future reference with hex converting, the first number is red value, then green value, then blue value, then alpha (opacity) value, so you can always tweak that last number in the series and not mess up your color selection. :) Glad I could help!