API tools faq
paste
Advertisement
GreaserDemon

Character Profile / Lightly Modified

GreaserDemon
Jan 4th, 2020
123
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.41 KB | None | 0 0
raw download clone embed print report
  1. <div class="container px-0">
  2. <div class="row">
  3. <div class="col-md-4 col-sm-5 mb-4">
  4. <!--------- SIDE STATS -------------------------------------------------------->
  5.  
  6. <ul class="list-group">
  7. <li class="list-group-item bg-faded d-block">
  8. <!-------------- CHARACTER NAME ----------------------------------------->
  9.  
  10. <h1 class="text-center mb-0" style="font-weight: 300;">NAME</h1>
  11. </li>
  12. <li class="list-group-item d-block" style="background-image:url(IMG URL);background-size:cover;background-position:center 0;background-repeat:no-repeat;min-height:300px;"><img src="https://orig00.deviantart.net/0dd7/f/2018/305/f/5/image_thumb_by_greaserdemon-dcqwulv.png" class="fr-fic fr-dib" width="300" height="300"></li>
  13. <li class="list-group-item d-block"><strong>Age</strong>
  14. <span class="pull-right">???</span></li>
  15. <li class="list-group-item d-block"><strong>Sex</strong><span class="pull-right">???</span></li>
  16. <li class="list-group-item d-block"><strong>Species</strong><span class="pull-right">???</span></li>
  17. <li class="list-group-item d-block"><strong>Nationality</strong><span class="pull-right">???</span></li>
  18. <li class="list-group-item d-block"><strong>Sexuality</strong><span class="pull-right"><span class="pull-right"><span style="color: rgb(0, 0, 0);">???</span></span>
  19. </span>
  20. </li>
  21. <li class="list-group-item d-block"><strong>Marital Status</strong><span class="pull-right">???</span></li>
  22. <li class="list-group-item d-block"><strong>Alignment</strong><span class="pull-right">???</span></li>
  23. </ul>
  24. </div>
  25. <div class="col-md-8 col-sm-7 mb-4">
  26. <div class="card">
  27. <div class="card-header bg-faded">
  28. <!--------------------------- NAVIGATION BUTTONS -------------------------------------->
  29.  
  30. <ul class="nav nav-tabs card-header-tabs nav-justified text-uppercase" style="letter-spacing:1px;">
  31. <li class="nav-item"><a class="nav-link show active" data-toggle="tab" href="#ONE">About</a></li>
  32. <li class="nav-item"><a class="nav-link show" data-toggle="tab" href="#TWO">Details</a></li>
  33. <li class="nav-item"><a class="nav-link show" data-toggle="tab" href="#THREE">Story</a></li>
  34. <li class="nav-item"><a class="nav-link show" data-toggle="tab" href="#FOUR">Links</a></li>
  35. </ul>
  36. </div>
  37. <div class="tab-content">
  38. <!--------------------------- SECTION ONE --- ABOUT ----------------------------------->
  39. <div class="tab-pane card-block pb-1 show active" id="ONE" style="height: 550px; overflow:auto;">
  40. <br>
  41.  
  42. <h2 style="text-align: center;">[IMAGE]</h2>
  43. <hr>
  44.  
  45. <p style="text-align: center;"><span style="font-size: 18px;"><strong>DRAWING INFO:</strong></span>
  46. <br><span style="font-size: 14px;"><strong>SFW ✓ | NSFW ✓ | Gore ✓</strong></span></p>
  47. </div>
  48. <!--------------------------- SECTION TWO -- DETAILS ------------------------------------>
  49. <div class="tab-pane card-block pb-0 show" id="TWO" style="height:550px; overflow:auto;">
  50.  
  51. <h1>Trivia</h1>
  52. <hr class="mt-0">
  53. <div class="row">
  54. <div class="col-sm-6 mb-2"><b class="mr-2">Weight:</b> --</div>
  55. <div class="col-sm-6 mb-2"><b class="mr-2">Origin:</b> --</div>
  56. <div class="col-sm-6 mb-2"><b class="mr-2">Height:</b> --</div>
  57. <div class="col-sm-6 mb-2"><b class="mr-2">Build:</b> --&nbsp;</div>
  58. <div class="col-sm-6 mb-2"><b class="mr-2">Personality:</b> wip</div>
  59. <div class="col-sm-6 mb-2"><b class="mr-2">Theme:</b>
  60. <strong>♫ ♫ ♫</strong></div>
  61. <div class="col-sm-6 mb-3"><strong>Likes&nbsp;</strong>
  62. <br>
  63.  
  64. <ul class="mb-0">
  65. <li class="mb-1">wip</li>
  66. <li class="mb-1">wip&nbsp;</li>
  67. <li class="mb-1">wip</li>
  68. </ul>
  69. </div>
  70. <div class="col-sm-6 mb-3"><strong>Dislikes&nbsp;</strong>
  71. <br>
  72.  
  73. <ul class="mb-0">
  74. <li class="mb-1">wip</li>
  75. <li class="mb-1">wip</li>
  76. <li class="mb-1">wip</li>
  77. </ul>
  78. </div>
  79. </div>
  80.  
  81. <h1>Character</h1>
  82. <hr class="mt-0 ">
  83.  
  84. <table style="width: 100%; margin-left: calc(0%); margin-right: calc(0%);">
  85. <tbody>
  86. <tr>
  87. <td style="width: 21.107%;"><strong>Occupation:</strong></td>
  88. <td style="width: 78.7518%;">WIP</td>
  89. </tr>
  90. <tr>
  91. <td style="width: 21.107%;"><strong>Alternate Forms:</strong></td>
  92. <td style="width: 78.7518%;">--</td>
  93. </tr>
  94. <tr>
  95. <td style="width: 21.107%;"><strong>Obtained:</strong></td>
  96. <td style="width: 78.7518%;">--</td>
  97. </tr>
  98. <tr>
  99. <td style="width: 21.107%;"><strong>Worth:</strong></td>
  100. <td style="width: 78.7518%;">--</td>
  101. </tr>
  102. </tbody>
  103. </table>
  104. <div class="row" style="margin-left: 5px;">
  105. <br>
  106. <br>
  107. </div>
  108. </div>
  109. <!--------------------------- SECTION THREE -- STORY ------------------------------------>
  110. <div class="tab-pane card-block pb-1 show" id="THREE" style="height:550px; overflow:auto;">
  111.  
  112. <h1>General</h1>
  113. <hr class="mt-0 ">
  114.  
  115. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas facilisis ex quis enim condimentum, vulputate elementum lacus viverra. Donec non dui id augue pellentesque aliquam et eget felis. Aliquam erat volutpat. Nulla nulla augue, vehicula id volutpat nec, auctor et ipsum. Phasellus pretium non libero eu ultricies. Proin et est vitae metus interdum ullamcorper vel sit amet augue. Integer et diam eu massa faucibus molestie non vitae metus. Donec cursus lectus eros, in vestibulum sapien porta et. Aliquam ac est lorem. Etiam pulvinar laoreet augue, et faucibus ligula ornare quis. Pellentesque sed leo tincidunt, consectetur dui in, tincidunt nunc.</p>
  116.  
  117. <h1>WIP</h1>
  118. <hr class="mt-0 ">
  119.  
  120. <p>TEX WIP
  121. <br>
  122. <br>
  123. </p>
  124.  
  125. <h1>Random Facts</h1>
  126. <hr class="mt-0 ">
  127.  
  128. <ul style="list-style-type: disc;">
  129. <li>wip</li>
  130. <li>wip</li>
  131. <li>wip</li>
  132. </ul>
  133. </div>
  134. <!--------------------------- SECTION FOUR -- LINKS ------------------------------------>
  135. <div class="tab-pane card-block pb-1 show" id="FOUR" style="height:550px; overflow:auto;">
  136. <div class="row">
  137. <!--------------------------- CHARACTER LINK -------------------------------------->
  138. <div class="col-12 mb-2"><img src="https://orig00.deviantart.net/0dd7/f/2018/305/f/5/image_thumb_by_greaserdemon-dcqwulv.png" class="rounded float-sm-right ml-sm-2 d-block mx-auto fr-fic fr-dib" height="200" width="200">
  139.  
  140. <h2>Character</h2>
  141.  
  142. <p><strong>[ relationship ]</strong> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse sit amet massa blandit, fermentum enim a, scelerisque velit. Integer interdum urna ac dui sollicitudin sollicitudin. In feugiat posuere nulla, eget lobortis ante.&nbsp;</p>
  143. </div>
  144. <!--------------------------- CHARACTER LINK -------------------------------------->
  145. <div class="col-12 mb-2"><img src="https://orig00.deviantart.net/0dd7/f/2018/305/f/5/image_thumb_by_greaserdemon-dcqwulv.png" class="rounded float-sm-right ml-sm-2 d-block mx-auto fr-fic fr-dib" height="200" width="200">
  146.  
  147. <h2>Character</h2>
  148.  
  149. <p><strong>[ relationship ]</strong> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse sit amet massa blandit, fermentum enim a, scelerisque velit. Integer interdum urna ac dui sollicitudin sollicitudin. In feugiat posuere nulla, eget lobortis ante.</p>
  150. </div>
  151. <!--------------------------- CHARACTER LINK -------------------------------------->
  152. <div class="col-12 mb-2"><img src="https://orig00.deviantart.net/0dd7/f/2018/305/f/5/image_thumb_by_greaserdemon-dcqwulv.png" class="rounded float-sm-right ml-sm-2 d-block mx-auto fr-fic fr-dib" height="200" width="200">
  153.  
  154. <h2>Character</h2>
  155.  
  156. <p><strong>[ relationship ]</strong> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse sit amet massa blandit, fermentum enim a, scelerisque velit. Integer interdum urna ac dui sollicitudin sollicitudin. In feugiat posuere nulla, eget lobortis ante.</p>
  157. </div>
  158. </div>
  159. </div>
  160. </div>
  161. </div>
  162. </div>
  163. </div>
  164.  
  165. <p class="text-right"><a class="btn btn-danger" href="/lowkeywicked"><i class="fas fa-code mr-1"></i> Credit</a></p></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!