Tessisamess

Information

Hey guys! I mentioned wanting this yesterday to a friend and immediately had to make it as soon as it left my mouth LOL. Today we've got a CR chart that describes each relationship with a song, and a collapsable area for the lyrics you like most from the song for the relationship (or the whole song!) Enjoy! 💖

The Coding

<lj-raw><div style="width:300px;margin:0 auto;font-family:calibri,sans-serif;font-size:10px;line-height:1;color:#111;"> <!--HEADER--> <center style="text-transform:uppercase;letter-spacing:2px;"> <!--HEADER ICON--> <img src="https://i.imgur.com/EK0CruY.png" style="height:65px;opacity:0.2;"> <!--TITLES--> <div style="margin:-21px 0 20px 0;"> <b style="color:#000;">Title</b><br> Subtitle </div> </center> <!--RELATIONSHIPS LIST--> <div style="background:#fff;border:1px solid rgba(0,0,0,0.1);border-top:0;"> <!--CHARACTER--> <details> <!--RELATIONSHIP--> <summary style="display:flex;align-items:center;font-size:0;cursor:pointer;outline:none;border-top:1px solid rgba(0,0,0,0.1);"> <!--ICON--> <img src="CHARACTER_ICON" style="padding:5px;height:40px;border-right:1px solid rgba(0,0,0,0.1);margin:0 10px 0 0;"> <!--SONG INFO--> <span style="font-size:10px;"> <b style="font-size:11px;color:#000;">Character</b><br> <b>Song</b> <i>by</i> <b>Artist</b> </span> </summary> <!--LYRICS--> <center style="border-top:1px solid rgba(0,0,0,0.1);padding:20px;font-style:italic;line-height:2;"> Lyrics </center> </details> </div> <div style="text-align:right;margin:5px 0 0 0;font-size:7px;letter-spacing:3px;font-weight:bold;"><a href="https://tessisamess.insanejournal.com/140003.html" style="color:#aaa;text-decoration:none;">CODE BY</a></div></div></lj-raw>

Editing Guide

Paste the coding into Notepad or similar and bring up Replace All (usually Ctrl+H) to replace values quickly and easily!

DIMENSIONS

300px - Container width
65px - Header icon
40px - Character icon
20px - Header spacing; lyrics padding

FONTS

calibri,sans-serif - All text

IMAGES

https://i.imgur.com/EK0CruY.png - Header icon

COLORS

#fff

Container background

#111

Body text

#000

Header title; character names

rgba(0,0,0,0.1)

Borders

Terms of Use

♡ Do not remove credit.
♡ Do not redistribute my codes in part or in whole (posting a copy for players to use in your game is fine with a link to original post.)
♡ If you break something during editing, please feel free to drop me a comment and I'll help as best I can!
♡ I love seeing edits! This isn't a rule, but if you have a cool edit of one of my codes I'd love to see it!