7th: you've got mail

[yanyan]

My friend wanted something like Devil Survivor 1's Laplace Mail system for an IC inbox thread tracker, and this was the result.

FROM: SUBJECT: Aladdin You need to get laid!! Izumo Kusanagi For the adorable Yozora Mikazuki... Minako Aino cOme tO tHe toWN SQuaRE Gareki In case you take your loneliness out on... There are 2 unfinished threads.

FROM: SUBJECT: DATE: Aladdin You need to get laid!! March 3, 2013 Izumo Kusanagi For the adorable Yozora Mikazuki... March 3, 2013 Minako Aino cOme tO tHe toWN SQuaRE September 3, 2013 Gareki In case you take your loneliness out on... February 3, 2013 There are 2 unfinished threads.

without dates <raw-code> <center> <table style="width: 480px; font-family: 'segoe ui', calibri, sans-serif;"> <tr><td> <div style="float: left; position: relative; width: 100%; font-size: 11px;"> <div style="float: left; width: 16px; color: #fff; background: #367cda; padding: 1px 4px;"> </div> <div style="float: left; width: 120px; color: #fff; background: #367cda; padding: 1px 4px;">FROM:</div> <div style="float: left; width: 320px; color: #fff; background: #367cda; padding: 1px 4px;">SUBJECT:</div> </div> <div style="float: left; position: relative; width: 480px; background: #367cda;"> <!--LIST OF THREADS BEGIN--> <div style="width: 100%; background: #eee; max-height: 92px; overflow: auto;"> <table style="width: 100%; background: #eee; color: #555; font-size: 12px;"> <tr style="background: #fff;(IF FINISHED, remove) font-weight: bold;(IF FINISHED, remove) border-bottom: 1px solid #ddd;"> <td style="width: 13px; border-right: 1px solid #ddd;"><img src="http://i.imgur.com/mjQ2YrQ.png (IF FINISHED: http://i.imgur.com/tJN3hvB.png)" title="un/finished"></td> <td style="width: 116px; border-right: 1px solid #ddd;">CHARACTER NAME</td> <td><a href="THREAD LINK HERE" style="text-decoration: none;"><span style="color: #555;">THREAD SUBJECT</span></a></td> </tr> <tr style="background: #fff;(IF FINISHED, remove) font-weight: bold;(IF FINISHED, remove) border-bottom: 1px solid #ddd;"> <td style="width: 13px; border-right: 1px solid #ddd;"><img src="http://i.imgur.com/mjQ2YrQ.png (IF FINISHED: http://i.imgur.com/tJN3hvB.png)" title="un/finished"></td> <td style="width: 116px; border-right: 1px solid #ddd;">CHARACTER NAME</td> <td><a href="THREAD LINK HERE" style="text-decoration: none;"><span style="color: #555;">THREAD SUBJECT</span></a></td> </tr> <tr style="background: #fff;(IF FINISHED, remove) font-weight: bold;(IF FINISHED, remove) border-bottom: 1px solid #ddd;"> <td style="width: 13px; border-right: 1px solid #ddd;"><img src="http://i.imgur.com/mjQ2YrQ.png (IF FINISHED: http://i.imgur.com/tJN3hvB.png)" title="un/finished"></td> <td style="width: 116px; border-right: 1px solid #ddd;">CHARACTER NAME</td> <td><a href="THREAD LINK HERE" style="text-decoration: none;"><span style="color: #555;">THREAD SUBJECT</span></a></td> </tr> <tr style="background: #fff;(IF FINISHED, remove) font-weight: bold;(IF FINISHED, remove) border-bottom: 1px solid #ddd;"> <td style="width: 13px; border-right: 1px solid #ddd;"><img src="http://i.imgur.com/mjQ2YrQ.png (IF FINISHED: http://i.imgur.com/tJN3hvB.png)" title="un/finished"></td> <td style="width: 116px; border-right: 1px solid #ddd;">CHARACTER NAME</td> <td><a href="THREAD LINK HERE" style="text-decoration: none;"><span style="color: #555;">THREAD SUBJECT</span></a></td> </tr> </table> </div> <!--LIST OF THREADS END--> <div style="text-align: center;"><span style="color: #fff;">There are # unfinished threads.</span></div> </div> </td></tr> </table> </center> </raw-code> <small>code by <user name=cawaii></small>

with dates <raw-code> <center> <table style="width: 600px; font-family: 'segoe ui', calibri, sans-serif;"> <tr><td> <div style="float: left; position: relative; width: 100%; font-size: 11px;"> <div style="float: left; width: 16px; color: #fff; background: #367cda; padding: 1px 4px;"> </div> <div style="float: left; width: 124px; color: #fff; background: #367cda; padding: 1px 4px;">FROM:</div> <div style="float: left; width: 296px; color: #fff; background: #367cda; padding: 1px 4px;">SUBJECT:</div> <div style="float: left; width: 132px; color: #fff; background: #367cda; padding: 1px 4px;">DATE:</div> </div> <div style="float: left; position: relative; width: 600px; background: #367cda;"> <div style="width: 100%; background: #eee; max-height: 92px; overflow: auto;"> <table style="width: 100%; background: #eee; color: #555; font-size: 12px;"> <tr style="background: #fff;(IF FINISHED, remove) font-weight: bold;(IF FINISHED, remove) border-bottom: 1px solid #ddd;"> <td style="border-right: 1px solid #ddd;"><img src="http://i.imgur.com/mjQ2YrQ.png (IF FINISHED: http://i.imgur.com/tJN3hvB.png)" title="un/finished"></td> <td style="border-right: 1px solid #ddd;">CHARACTER NAME</td> <td style="border-right: 1px solid #ddd;"><a href="LINK HERE" style="text-decoration: none;"><span style="color: #555;">SUBJECT</span></a></td> <td>DATE</td> </tr> <tr style="background: #fff;(IF FINISHED, remove) font-weight: bold;(IF FINISHED, remove) border-bottom: 1px solid #ddd;"> <td style="border-right: 1px solid #ddd;"><img src="http://i.imgur.com/mjQ2YrQ.png (IF FINISHED: http://i.imgur.com/tJN3hvB.png)" title="un/finished"></td> <td style="border-right: 1px solid #ddd;">CHARACTER NAME</td> <td style="border-right: 1px solid #ddd;"><a href="LINK HERE" style="text-decoration: none;"><span style="color: #555;">SUBJECT</span></a></td> <td>DATE</td> </tr> <tr style="background: #fff;(IF FINISHED, remove) font-weight: bold;(IF FINISHED, remove) border-bottom: 1px solid #ddd;"> <td style="border-right: 1px solid #ddd;"><img src="http://i.imgur.com/mjQ2YrQ.png (IF FINISHED: http://i.imgur.com/tJN3hvB.png)" title="un/finished"></td> <td style="border-right: 1px solid #ddd;">CHARACTER NAME</td> <td style="border-right: 1px solid #ddd;"><a href="LINK HERE" style="text-decoration: none;"><span style="color: #555;">SUBJECT</span></a></td> <td>DATE</td> </tr> <tr style="background: #fff;(IF FINISHED, remove) font-weight: bold;(IF FINISHED, remove) border-bottom: 1px solid #ddd;"> <td style="border-right: 1px solid #ddd;"><img src="http://i.imgur.com/mjQ2YrQ.png (IF FINISHED: http://i.imgur.com/tJN3hvB.png)" title="un/finished"></td> <td style="border-right: 1px solid #ddd;">CHARACTER NAME</td> <td style="border-right: 1px solid #ddd;"><a href="LINK HERE" style="text-decoration: none;"><span style="color: #555;">SUBJECT</span></a></td> <td>DATE</td> </tr> </table> </div> <div style="text-align: center;"><span style="color: #fff;">There are # unfinished threads.</span></div> </div> </td></tr> </table> </center> </raw-code> <small>code by <user name=cawaii></small>

additional rows <tr style="background: #fff;(IF FINISHED, remove) font-weight: bold;(IF FINISHED, remove) border-bottom: 1px solid #ddd;"> <td style="width: 13px; border-right: 1px solid #ddd;"><img src="http://i.imgur.com/mjQ2YrQ.png (IF FINISHED: http://i.imgur.com/tJN3hvB.png)" title="un/finished"></td> <td style="width: 116px; border-right: 1px solid #ddd;">CHARACTER NAME</td> <td><a href="THREAD LINK HERE" style="text-decoration: none;"><span style="color: #555;">THREAD SUBJECT</span></a></td> </tr>

additional rows <tr style="background: #fff;(IF FINISHED, remove) font-weight: bold;(IF FINISHED, remove) border-bottom: 1px solid #ddd;"> <td style="border-right: 1px solid #ddd;"><img src="http://i.imgur.com/mjQ2YrQ.png (IF FINISHED: http://i.imgur.com/tJN3hvB.png)" title="un/finished"></td> <td style="border-right: 1px solid #ddd;">CHARACTER NAME</td> <td style="border-right: 1px solid #ddd;"><a href="LINK HERE" style="text-decoration: none;"><span style="color: #555;">SUBJECT</span></a></td> <td>DATE</td> </tr>

NOTES
1. Must have four rows to look full. It doesn't look good if you put less than four, in my opinion.
2. You may change #367cda to whatever color you want.
3. You may change the envelope icons, but they must not go beyond 12px x 12px or it will look weird!

Comments

[stormy]

This is really cute. I think I'll add this to my memories for the next time I need something like this. Great job.

[yanyan]

Thank you!

[ninjawon]

WOW I really like this. I'm using it to organize homework for school actually.... it's too neat not to use it /sob

[yanyan]

haha wow! I'm glad it was useful. ;u;

[prefacing]

oh my godddd this is fabulous! I will be using this later. c:

[papatiger]

Oh these thread trackers are amazing. I hope you don't mind if I use them and credit you, thank you!

[ubinunc]

this thread tracker is great! and it looks really cute too *w*

fyi, when I used the code for the tracker with dates, the very top "From:", "Subject:", and "Date:" categories didn't line up with the rest of the chart. I messed around with it and found I needed to add width values to the code for one of the rows (one of the emails in the inbox?). I'm hoping I didn't break anything too badly??? and letting you know in case you didn't.

... I hope that made sense.