CR Chart Get~

[usuck]

Ahoy mateys! If anyone wants to do this, here's a Character Relationship Chart I modified! (Sample here)

Things to change:
> Replace the Xs in img src="XXXXXXXXX" with the icon URL
> NAME
> COMMENTS
> div style="width: 0% -> set percentage up to 100% for the bar to fill up
> if you want to change the colors, the ones I used are:
#1CA138 - CR Percent
#EA4335 - Affinity Percent
#2E2031 - Trust Percent
#FFDF00 - Loyalty Percent
#FF69FF - Respect / Affection Percent

<raw-code><center><div style="width:100%;"> <!--------CHARACTER START-------> <div style="width:350px;margin:15px;display:inline-block;vertical-align:top;"> <div style="width:100%;text-align:justify;margin-bottom:-10px;"><img src="XXXXXXXXX" style="border: #2e2031 5px solid; border-radius: 10px; float: left; margin-right:15px;"><span style="font-size:18px;">NAME</span> <br> <br>COMMENTS</div> <!--CR PERCENT--> <table><tr><td><img src="http://ow.ly/SBz76" height="25px" title="CR STRENGTH METER"></td><td><div style="float:right;display:inline;width:300px;height:15px;border-radius:20px;border: #e0e0e0 3px solid;"><div style="width: 0%; height: 100%; background: #1CA138; position:relative;border-radius:20px;"></div></div></td></tr> <!--AFFINITY PERCENT--> <tr><td><img src="http://ow.ly/SBzgC" height="25px" title="AFFINITY METER"></td><td><div style="float:right;display:inline;width:300px;height:15px;border-radius:20px;border: #e0e0e0 3px solid;"><div style="width: 0%; height: 100%; background: #EA4335; position:relative;border-radius:20px;"></div></div></td></tr> <!--TRUST PERCENT--> <tr><td><img src="http://ow.ly/SBzkR" height="25px" title="TRUST METER"></td><td><div style="float:right;display:inline;width:300px;height:15px;border-radius:20px;border: #e0e0e0 3px solid;"><div style="width: 0%; height: 100%; background: #2e2031; position:relative;border-radius:20px;"></div></div></td></tr> <!--LOYALTY PERCENT--> <tr><td><img src="http://ow.ly/SBzmF" height="25px" title="LOYALTY METER"></td><td><div style="float:right;display:inline;width:300px;height:15px;border-radius:20px;border: #e0e0e0 3px solid;"><div style="width: 0%; height: 100%; background: #FFDF00; position:relative;border-radius:20px;"></div></div></td></tr> <!--RESPECT PERCENT--> <tr><td><img src="http://ow.ly/SBzr1" height="25px" title="RESPECT / AFFECTION METER"></td><td><div style="float:right;display:inline;width:300px;height:15px;border-radius:20px;border: #e0e0e0 3px solid;"><div style="width: 0%; height: 100%; background: #FF69FF; position:relative;border-radius:20px;"></div></div></td></tr></table></div> <!--------CHARACTER END-------> <!--PASTE NEW CHARACTERS ABOVE THIS LINE--> </div></center> <div style="width:100%;text-align:right;"><small>Modified <a href="http://bannertech.dreamwidth.org/2620.html" target="_blank">code</a> by <user name="bannertech">.</small></div></raw-code>