JeanifyCodes

Family Tree Toyhou.se

May 14th, 2019
32
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!--------------------------
  2. Add/Remove Generations
  3. as you need them.
  4.  
  5. Feel free to edit the
  6. code, this is just
  7. a basic idea!
  8.  
  9. When adding pictures
  10. it's recommended
  11. to use a small
  12. headshot or icon
  13. (maybe 100 x 100 pixels)
  14.  
  15. This is my first
  16. code so I'm sorry
  17. it's sloppy;;;;
  18. ------------------------------->
  19.  
  20. <!------------------------------
  21. Generation 1
  22. ------------------------------->
  23.  
  24. <table style="width: 100%;"><tbody><tr><td style="width: 10%; border-width: 1px;"><div style="text-align: center;">
  25. <img src="[URL HERE]" class="fr-fic fr-dib" width="76" height="61">[Name]<br>(status)</div></td>
  26.  
  27. <td style="width: 10%; border-width: 1px;"><div style="text-align: center;">-------?-------</div></td>
  28.  
  29. <td style="width: 10.0079%; border-width: 1px;"><div style="text-align: center;">[name]<br>(status)</div></td>
  30.  
  31. <td style="width: 10.0079%; border-width: 1px;"><br></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;"><strong>Generation 1</strong><br><strong>(Great-Great-Great Grandparents)</strong></div></td>
  32.  
  33. <td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">
  34. [name]<br>(status)</div></td>
  35.  
  36. <td style="width: 10.0000%;"><div style="text-align: center;">-------?-------</div></td>
  37.  
  38. <td style="width: 10.0000%;"><div style="text-align: center;">[name]<br>(status)</div></td></tr>
  39.  
  40. <!-------------------------
  41. Divider 1
  42. ------------------------->
  43.  
  44. <tr><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">-------------------</div></td><td style="width: 10.0079%;"><div data-empty="true" style="text-align: center;">-------------------</div></td><td style="width: 10.0079%;"><div data-empty="true" style="text-align: center;">-------------------</div></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">-------------------</div></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">-------------------</div></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">-------------------</div></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">-------------------</div></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">------------------</div></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">------------------</div></td></tr>
  45.  
  46. <!------------------------>
  47. Generation 2
  48. ----------------------->
  49.  
  50. <tr><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">
  51. [name]<br>(status)</div></td>
  52.  
  53. <td style="width: 10.0000%;"><div style="text-align: center;">-------?-------</div></td><td style="width: 10.0079%;"><div data-empty="true" style="text-align: center;">
  54. [name]<br>(status)</div></td><td style="width: 10.0079%;"><br></td>
  55.  
  56. <td style="width: 10.0000%;"><div style="text-align: center;"><strong>Generation 2<br>(Great-Great Grandparents)</strong></div></td>
  57.  
  58. <td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">
  59. [name]<br>(status)</div></td>
  60.  
  61. <td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">-------?-------</div></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">[name]<br>(status)</div></td></tr>
  62.  
  63. <!------------------------>
  64. Divider 2
  65. ------------------------>
  66.  
  67. <tr><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0079%;">-------------------</td><td style="width: 10.0079%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">------------------</td><td style="width: 10.0000%;">------------------</td></tr>
  68.  
  69. <!------------------------>
  70. Generation 3
  71. ------------------------>
  72.  
  73. <tr><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">
  74. [name]<br>(status)</div></td>
  75.  
  76. <td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">-------?-------</div></td><td style="width: 10.0079%;"><div data-empty="true" style="text-align: center;">
  77. [name]<br>(status)</div></td><td style="width: 10.0079%;"><br></td>
  78.  
  79. <td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;"><strong>Generation 3</strong><br><strong>(Great Grandparents)</strong></div></td>
  80.  
  81. <td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">
  82. [name]<br>(status)</div></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">-------?-------</div></td>
  83.  
  84. <td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">[name]<br>(status)</div></td></tr>
  85.  
  86. <!------------------------>
  87. Divider 3
  88. ------------------------>
  89.  
  90. <tr><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0079%;">-------------------</td><td style="width: 10.0079%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">------------------</td><td style="width: 10.0000%;">------------------</td></tr>
  91.  
  92. <!----------------------->
  93. Generation 4 (Grandparents)
  94. ----------------------->
  95.  
  96. <tr><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">
  97. <img src="URL HERE" class="fr-fic fr-dib" width="70" height="60"></div><p style="text-align: center;">[name]</p></td>
  98.  
  99. <td style="width: 10%; border-color: rgb(252, 208, 99); border-style: double; border-width: 1px;"><div style="text-align: center;"><strong><span style="color: #fcd063;">-------&hearts;-------</span></strong><br><strong><span style="color: #fcd063;">Married</span></strong></div></td>
  100.  
  101. <td style="width: 10.0079%;"><div data-empty="true" style="text-align: center;">
  102. <img src="URL HERE" class="fr-fic fr-dib" width="72" height="52"></div><p style="text-align: center;">[name]</p></td>
  103.  
  104. <td style="width: 10.0079%;"><br></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;"><strong>Generation 4</strong><br><strong>(Grandparents)</strong></div></td>
  105.  
  106. <td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">
  107. <img src="URL HERE" class="fr-fic fr-dib" width="60" height="57"></div><p style="text-align: center;">[name]</p></td><td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">-------?-------</div></td>
  108.  
  109. <td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">
  110. [name]<br>(status)</div>
  111.  
  112. <!----------------------
  113. Divider 4
  114. ---------------------->
  115.  
  116. </td></tr><tr><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0079%;">-------------------</td><td style="width: 10.0079%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">-------------------</td><td style="width: 10.0000%;">------------------</td><td style="width: 10.0000%;">------------------</td></tr><tr><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td>
  117.  
  118. <!--------------------->
  119. Generation 5 (Parents)
  120. --------------------->
  121.  
  122. <td style="width: 10.0079%;"><br></td><td style="width: 10.0079%;"><br></td><td style="width: 10.0000%;"><div style="text-align: center;"><strong>Generation 5</strong><br><strong>(Parents)</strong></div></td>
  123.  
  124. <td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td></tr>
  125.  
  126. <tr><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0079%;"><br></td><td style="width: 10.0079%;"><div style="text-align: center;">
  127. <img src="URL HERE" class="fr-fic fr-dib" width="77" height="57">[name]</div></td>
  128.  
  129. <td style="width: 10%; border-color: rgb(191, 21, 21); border-style: double; border-width: 1px;"><div data-empty="true" style="text-align: center;"><span style="color: #bf1515;"><strong>-------X-------</strong></span><br><span style="color: #bf1515;"><strong>Divorced</strong></span></div></td>
  130.  
  131. <td style="width: 10.0000%;"><div style="text-align: center;">
  132. <img src="URL HERE" class="fr-fic fr-dib" width="60" height="82">[name]</div></td><td style="width: 10.0000%;"><br></td>
  133.  
  134. <td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td></tr></tbody></table><table style="width: 100%;"><tbody><tr><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td>
  135.  
  136. <!-------------------->
  137. Present Generation
  138. -------------------->
  139.  
  140. <td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;"><strong>Generation 6</strong><br><strong>(Present)</strong></div></td>
  141.  
  142. <td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td></tr>
  143.  
  144. <tr><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><div style="text-align: center;">
  145. <img src="URL HERE" class="fr-fic fr-dib" width="81" height="63">[name]</div></td>
  146.  
  147. <td style="width: 10.0000%;"><div style="text-align: center;"><strong><span style="color: #1a6732;">-------&diams;-------</span></strong><br><strong><span style="color: #1a6732;">Siblings</span></strong></div></td>
  148.  
  149. <td style="width: 10.0000%;"><div data-empty="true" style="text-align: center;">
  150. <img src="URL HERE" class="fr-fic fr-dib" width="79" height="55"></div><p style="text-align: center;">[name]</p></td>
  151.  
  152. <td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td><td style="width: 10.0000%;"><br></td></tr></tbody></table>
  153. Code by @Jeanify
RAW Paste Data