API tools faq
paste
Advertisement
Guest User

Char Profile

a guest
Oct 17th, 2017
1,169
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.42 KB | None | 0 0
raw download clone embed print report
  1. <!-- Sections marked !FILL! show a field you can change -->
  2.  
  3. <div class="container">
  4.  
  5. <!-- !FILL! --> <h1 class="display-2 text-center text-primary">Name</h1>
  6. <!-- !FILL! --> <h6 class="text-center">short description/keywords (e.g. Race, Job)</h6>
  7.  
  8. <!-- Image & Stats BEGIN -->
  9.  
  10. <div class="row mt-2 mb-3" >
  11. <div class="col-lg-6 pr-0" ><div class="card-block text-right p-0 pr-1 modal-open" style="height:400px;" ><div>
  12.  
  13. <!-- !FILL! --> <img src="https://orig00.deviantart.net/897a/f/2017/287/0/0/scan_2_c_ss_by_milay-dbql5r1.png"><!-- recommended images max. 400x400, but all images are made to fit automatically. Images that are wider get resized, and images that are higher get cut off --> <!-- to have higher images being resized automatically, use <img src="url" style="height:400px;"> -->
  14.  
  15. </div></div></div>
  16. <div class="col-lg-6 pl-1"><div class="pl-0 card-block table-responsive" style="height:auto;">
  17. <table style="margin-left:0px;margin-right:auto;border:0px;"><tbody>
  18. <tr>
  19. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Name</strong></span></td>
  20. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  21. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  22.  
  23. <!-- !FILL! - Name --> Name</span></td>
  24.  
  25. </tr><tr>
  26. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Titles/Nicknames</strong></span></td>
  27. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  28. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  29.  
  30. <!-- !FILL! - Nicknames titles--> Nicknames</span></td>
  31.  
  32. </tr><tr>
  33. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Gender/Pronouns</strong></span></td>
  34. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  35. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  36.  
  37. <!-- !FILL! -Gender/Pronouns-->male/female/nonbinary (he/she/they)</span></td>
  38.  
  39. </tr><tr>
  40. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Age/Birthday</strong></span></td>
  41. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  42. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  43.  
  44. <!-- !FILL! - Age/Birthday-->¯\_(ツ)_/¯</span></td>
  45.  
  46. </tr><tr>
  47. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Species</strong></span></td>
  48. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  49. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  50.  
  51. <!-- !FILL! - Species - you can even link the species info! <a href="url">text</a> -->¯\_(ツ)_/¯</span></td></span></td>
  52.  
  53. </tr><tr>
  54. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Orientation/Status</strong></span></td>
  55. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  56. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  57.  
  58. <!-- !FILL! - Orientation/Status-->¯\_(ツ)_/¯</span></td>
  59.  
  60. </tr><tr>
  61. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Height</strong></span></td>
  62. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  63. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  64.  
  65. <!-- !FILL! - Height-->¯\_(ツ)_/¯</span></td>
  66.  
  67. </tr><tr>
  68. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Body Build</strong></span></td>
  69. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  70. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  71.  
  72. <!-- !FILL! - Body Build-->¯\_(ツ)_/¯</span></td>
  73.  
  74. </tr><tr>
  75. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Traits/Unique Features</strong></span></td>
  76. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  77. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  78.  
  79. <!-- !FILL! - Traits/Unique Features-->¯\_(ツ)_/¯</span></td>
  80.  
  81. </tr><tr>
  82. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Home</strong></span></td>
  83. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  84. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  85.  
  86. <!-- !FILL! - Origin/Home--> ¯\_(ツ)_/¯</span></td>
  87.  
  88. </tr><tr>
  89. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Voice Claim</strong></span></td>
  90. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  91. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  92.  
  93. <!-- !FILL! - Voice Claim --><a href="https://www.youtube.com/">who dis</a></span></td>
  94.  
  95. </tr><tr>
  96. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Theme Song/s</strong></span></td>
  97. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  98. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  99.  
  100. <!-- !FILL! - Theme Songs --><a href="https://www.youtube.com/">Artist - Song</a></span></td>
  101.  
  102. </tr><tr>
  103. <td class="text-right pb-1 pt-0"><span style="font-size:9pt;"><strong>Personality</strong></span></td>
  104. <td class="text-center pb-1 pt-0"><i class="fa fa-angle-double-right" aria-hidden="true"></i></td>
  105. <td class="text-left pb-1 pt-0"><span style="font-size:9pt;">
  106.  
  107. <!-- !FILL! - Personality-->it is a mystery</span></td>
  108.  
  109. </tr>
  110. </tbody></table>
  111. </div>
  112. </div>
  113. </div>
  114.  
  115. <!-- Image & Stats END-->
  116.  
  117.  
  118. <!-- Personality & Trivia START -->
  119.  
  120. <div class="row">
  121. <div class="col-lg-5 pr-2">
  122.  
  123. <div class="card bg-faded card-block d-block mb-4 table-responsive" style="height:400px;">
  124. <h1 class="text-muted display-4 mb-4" style="border-bottom:1px solid;"></i> Traits/Skills</h1>
  125. <table class="border-0 w-100 chart"><tbody>
  126. <tr>
  127.  
  128. <td class="text-uppercase text-center text-primary w-25 px-2 pt-0 pb-1">
  129. <!-- !FILL! - skill 1-->Strength</td><td class="w-25 p-0"">
  130. <!-- !FILL! - adjust width --><div class="progress bg-info"><div class="progress-bar" style="width:100%;"></div></div></td>
  131.  
  132. <!-- to add another skill, copypaste this part (left column)-->
  133. <td class="text-uppercase text-center text-primary w-25 px-2 pt-0 pb-1">
  134. <!-- !FILL! - skill 2-->Stamina</td><td class="w-25 p-0">
  135. <!-- !FILL! - adjust width --><div class="progress bg-info"><div class="progress-bar" style="width:50%;"></div></div></td>
  136. <!-- to add another skill, copypaste this part (left column)-->
  137.  
  138. </tr><tr>
  139.  
  140. <td class="text-uppercase text-center text-primary w-25 px-2 pt-0 pb-1">
  141. <!-- !FILL! - skill 3-->Health</td><td class="w-25 p-0">
  142. <!-- !FILL! - adjust width --><div class="progress bg-info"><div class="progress-bar" style="width:70%;"></div></div></td>
  143.  
  144. <!-- to add another skill, copypaste this part (right column)-->
  145. <td class="text-uppercase text-center text-primary w-25 px-2 pt-0 pb-1">
  146. <!-- !FILL! - skill 4-->Sleep</td><td class="w-25 p-0">
  147. <!-- !FILL! - adjust width --><div class="progress bg-info"><div class="progress-bar" style="width:10%;"></div></div></td>
  148. <!-- to add another skill, copypaste this part (right column)-->
  149.  
  150. </tr></tbody></table>
  151. <hr>
  152.  
  153. <table class="border-0 w-100 chart"><tbody><tr>
  154. <td class="text-uppercase text-left text-primary px-1 pt-0 pb-1">Flaws</td>
  155. <td class="text-uppercase text-left text-primary px-1 pt-0 pb-1">Qualities</td>
  156. <td class="text-uppercase text-left text-primary px-1 pt-0 pb-1">Motivation</td>
  157. </tr><tr>
  158. <td class="py-0 pl-0 align-top" style="font-size:9pt;"><ul class="list-unstyled mb-0">
  159.  
  160. <!-- !FILL! - Flaw - fill after the &nbsp; - copypaste this line to add more --><li>✗&nbsp;selfish</li>
  161.  
  162. </ul></td>
  163. <td class="py-0 pl-0 align-top" style="font-size:9pt;"><ul class="list-unstyled mb-0">
  164.  
  165. <!-- !FILL! - Qualities - fill after the &nbsp; - copypaste this line to add more --><li>✓&nbsp;patient</li>
  166.  
  167. </ul></td>
  168. <td class="py-0 pl-0 align-top" style="font-size:9pt;"><ul class="list-unstyled mb-0">
  169.  
  170. <!-- !FILL! - Motivation- fill after the &nbsp; - copypaste this line to add more --><li><i class="fa fa-angle-right" aria-hidden="true"></i>&nbsp;to find a family</li>
  171.  
  172. </ul></td>
  173. </tr></tbody></table>
  174.  
  175. <hr>
  176.  
  177. <!-- !FILL! - skill name --><p class="text-uppercase text-primary mb-1">LOW-LIGHT VISION</p>
  178. <!-- !FILL! - skill description --><p style="font-size:9pt;" class="pl-3">They have eyes that are so sensitive to light that they can see twice as far as normal in dim light. </p>
  179. </div>
  180.  
  181. </div>
  182. <div class="col-lg-7">
  183. <!-- About Box -->
  184. <div class="card mb-4 card-block bg-faded d-block rounded-bottom table-responsive" style="height:400px;">
  185. <!-- !FILL! image --> <img src="https://orig00.deviantart.net/897a/f/2017/287/0/0/scan_2_c_ss_by_milay-dbql5r1.png" class="float-right m1-1 ml-2" style="height:300px;"><!-- looks best with transparent images - optional - feel free to remove - images will be resized to fit automatically - for images wider than 300px, change 'height' to 'width' -->
  186.  
  187. <h1 class="display-4 text-right text-muted mb-4" style="border-bottom:1px solid;">About</h1>
  188.  
  189. <!-- About Text START -->
  190.  
  191. <p style="font-size:9pt;" >
  192. <!-- !FILL! -->
  193. This is where you can write about your character!
  194. <ul style="font-size:9pt;" >
  195. <li>You can also</li>
  196. <li>add a bullet list</li>
  197. </ul>
  198. </p>
  199.  
  200. <p style="font-size:9pt;" >Add a new paragraph like this.</p>
  201.  
  202. <!-- About Text END -->
  203. </div></div></div>
  204. <!-- Personality & Trivia END-->
  205. <!-- Backstory & Relationships START -->
  206. <div class="row"><div class="col-lg-6 pr-2">
  207. <div class="card mb-4 card-block bg-faded d-block rounded-bottom table-responsive" style="height:520px;">
  208. <!--<img src="http://file.toyhou.se/images/3542174_oWGupdNfG5znnQ7.png" style="height: 300px;" class="float-right m1-1">-->
  209. <h1 class="display-4 text-left text-muted mb-4" style="border-bottom:1px solid;">Backstory</h1>
  210.  
  211.  
  212. <!-- !FILL! - backstory --> <p class="" style="font-size:9pt;">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
  213. <!-- copypaste this part to add more paragraphs, like this: -->
  214.  
  215. <p class="" style="font-size:9pt;">Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of "de Finibus Bonorum et Malorum" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet..", comes from a line in section 1.10.32.</p>
  216.  
  217. <p class="" style="font-size:9pt;">The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections 1.10.32 and 1.10.33 from "de Finibus Bonorum et Malorum" by Cicero are also reproduced in their exact original form, accompanied by English versions from the 1914 translation by H. Rackham.</p>
  218.  
  219.  
  220.  
  221. </div>
  222. </div>
  223.  
  224. <div class="col-lg-6">
  225. <div class="card mb-4 card-block bg-faded d-block table-responsive" style="height:520px;">
  226. <h1 class="display-4 text-right text-muted mb-4" style="border-bottom:1px solid;">Relationships/Family</h1>
  227.  
  228. <!-- Family Box START - optional - feel free to remove -->
  229. <table style="margin-left:auto;margin-right:auto;border:0px;" class="mb-3">
  230. <tbody>
  231. <!-- Row Begin --> <tr>
  232.  
  233. <!-- !FILL! --><!-- Character Begin --> <td width="25%" class="pr-0 pt-0 pr-0 pb-1">
  234. <p style="font-size: 8pt;text-align:center;"><a href="http://toyhou.se/"><img src="http://orig07.deviantart.net/4694/f/2017/104/e/e/imgres_by_milay-db5t2x3.jpg" class="img-thumbnail" alt="" /><br />
  235. <strong>Name</strong><br /> age, job/desc </a></p>
  236. </td><!-- Character End -->
  237.  
  238. <!-- !FILL! --><!-- Character Begin --> <td width="25%" class="pr-0 pt-0 pr-0 pb-1">
  239. <p style="font-size: 8pt;text-align:center;"><a href="http://toyhou.se/"><img src="http://orig07.deviantart.net/4694/f/2017/104/e/e/imgres_by_milay-db5t2x3.jpg" class="img-thumbnail" alt="" /><br />
  240. <strong>Name</strong><br /> age, job/desc </a></p>
  241. </td><!-- Character End -->
  242.  
  243. <!-- !FILL! --><!-- Character Begin --> <td width="25%" class="pr-0 pt-0 pr-0 pb-1">
  244. <p style="font-size: 8pt;text-align:center;"><a href="http://toyhou.se/"><img src="http://orig07.deviantart.net/4694/f/2017/104/e/e/imgres_by_milay-db5t2x3.jpg" class="img-thumbnail" alt="" /><br />
  245. <strong>Name</strong><br /> age, job/desc </a></p>
  246. </td><!-- Character End -->
  247.  
  248. <!-- !FILL! --><!-- Character Begin --> <td width="25%" class="pr-0 pt-0 pr-0 pb-1">
  249. <p style="font-size: 8pt;text-align:center;"><a href="http://toyhou.se/"><img src="http://orig07.deviantart.net/4694/f/2017/104/e/e/imgres_by_milay-db5t2x3.jpg" class="img-thumbnail" alt="" /><br />
  250. <strong>Name</strong><br /> age, job/desc </a></p>
  251. </td><!-- Character End -->
  252.  
  253. </tr> <!-- Row End -->
  254.  
  255. <!-- Row Begin --><tr>
  256.  
  257. <!-- !FILL! --><!-- Character Begin --> <td width="25%" class="pr-0 pt-0 pr-0 pb-1">
  258. <p style="font-size: 8pt;text-align:center;"><a href="http://toyhou.se/"><img src="http://orig07.deviantart.net/4694/f/2017/104/e/e/imgres_by_milay-db5t2x3.jpg" class="img-thumbnail" alt="" /><br />
  259. <strong>Name</strong><br /> age, job/desc </a></p>
  260. </td><!-- Character End -->
  261.  
  262. <!-- !FILL! --><!-- Character Begin --> <td width="25%" class="pr-0 pt-0 pr-0 pb-1">
  263. <p style="font-size: 8pt;text-align:center;"><a href="http://toyhou.se/"><img src="http://orig07.deviantart.net/4694/f/2017/104/e/e/imgres_by_milay-db5t2x3.jpg" class="img-thumbnail" alt="" /><br />
  264. <strong>Name</strong><br /> age, job/desc </a></p>
  265. </td><!-- Character End -->
  266.  
  267. <!-- !FILL! --><!-- Character Begin --> <td width="25%" class="pr-0 pt-0 pr-0 pb-1">
  268. <p style="font-size: 8pt;text-align:center;"><a href="http://toyhou.se/"><img src="http://orig07.deviantart.net/4694/f/2017/104/e/e/imgres_by_milay-db5t2x3.jpg" class="img-thumbnail" alt="" /><br />
  269. <strong>Name</strong><br /> age, job/desc </a></p>
  270. </td><!-- Character End -->
  271.  
  272. <!-- !FILL! --><!-- Character Begin --> <td width="25%" class="pr-0 pt-0 pr-0 pb-1">
  273. <p style="font-size: 8pt;text-align:center;"><a href="http://toyhou.se/"><img src="http://orig07.deviantart.net/4694/f/2017/104/e/e/imgres_by_milay-db5t2x3.jpg" class="img-thumbnail" alt="" /><br />
  274. <strong>Name</strong><br /> age, job/desc </a></p>
  275. </td><!-- Character End -->
  276.  
  277. </tr> <!-- Row End -->
  278. </tbody>
  279. </table>
  280.  
  281. <!-- Family Box END - optional - feel free to remove -->
  282.  
  283. <!-- !FILL! - description --><p style="font-size:9pt;">Here you could write about how loving your character is to his family and friends. </p>
  284.  
  285. <!-- !FILL! -->
  286. <div class="mt-3 pt-2"><img src="https://orig07.deviantart.net/4694/f/2017/104/e/e/imgres_by_milay-db5t2x3.jpg" class="float-left mr-2" style="width:110px;" >
  287. <p class="text-left text-uppercase text-primary mb-1 pt-1"><i class="fa fa-angle-right"></i> Character Name</p>
  288. <p style="font-size:9pt;" class="text-left pl-3">This could be their best friend or adoptive dad.</p>
  289. <br clear="all"></div>
  290.  
  291. <!-- !FILL! -->
  292. <div class="mt-3 pt-2"><img src="https://orig07.deviantart.net/4694/f/2017/104/e/e/imgres_by_milay-db5t2x3.jpg" class="float-right ml-2" style="width:110px;" >
  293. <p class="text-right text-uppercase text-primary mb-1 pt-1">Character Name <i class="fa fa-angle-left"></i></p>
  294. <p style="font-size:9pt;" class="text-right pr-3">Maybe their sister or arch-nemesis.</p>
  295. <br clear="all"></div>
  296.  
  297. </div></div></div>
  298.  
  299. <!-- Backstory & Relationships END -->
  300.  
  301. <!-- Moodboard & Notes START -->
  302.  
  303. <div class="row">
  304. <div class="col-lg-7"><div class="card mb-4 card-block bg-faded d-block table-responsive" style="height:360px;">
  305. <h1 class="display-4 text-left text-muted mb-4" style="border-bottom:1px solid;">Mood Board</h1>
  306.  
  307. <!-- !FILL! --><p class="text-center"><img src="https://orig00.deviantart.net/b5a5/f/2017/286/d/1/4714971_ybaxv2ecwz9b9se_by_milay-dbqhbpq.jpg" class="img-thumbnail"><br><span style="font-size:7px;">[<a href="link">source</a>]</span><!-- optional image source link -->
  308. </p><!-- Copypaste this part to add more - images will be down-sized to fit automatically -->
  309.  
  310.  
  311. <p class="" style="font-size:9pt;"> </p></div></div>
  312.  
  313. <div class="col-lg-5 pl-2"><div class="card mb-4 card-block bg-faded d-block table-responsive" style="height:360px;">
  314. <h1 class="display-4 text-right text-muted mb-4" style="border-bottom:1px solid;">Notes</h1>
  315.  
  316. <!-- !FILL! --><p style="font-size:8pt;">This is your place for chat logs or other stuff that you want to save.</p>
  317.  
  318. </div>
  319. </div></div></div>
  320.  
  321.  
  322. <!-- Moodboard & Notes END-->
  323.  
  324.  
  325.  
  326. <p class="text-left">Layout by @rooty | <a href="http://toyhou.se/1390836">codes</a></p>
  327. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!