API tools faq
paste
Advertisement
CanineKing

[F2U] DND Bestiary

CanineKing
Mar 14th, 2020
467
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 8.49 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2. F2U Code DND Bestiary
  3.  
  4. Free to use & free to edit
  5. Ripping and "Frankenstein-ing" code is allowed
  6. Credit not necessary but appreciated
  7. Feel free to message me for any help/ questions
  8.  
  9. Layout from DND 5th Edition's Monster Manual
  10. Coded by CanineKing
  11. -->
  12. <div class="container-fluid">
  13. <div class="row justify-content-center p-3">
  14. <!-- IMAGE -->
  15. <div class="col-lg-10 m-1">
  16. <div class="card bg-transparent border-0 p-2">
  17. <img class="m-auto" src="IMG URL" style="width:800px;">
  18. </div>
  19. </div>
  20. <!--left side-->
  21. <div class="col-lg-5 m-1">
  22. <div class="card bg-faded p-2">
  23. <!-- first discriptors -->
  24. <h2 class="text-danger text-uppercase" style="font-size:20px;">Monster Name</h2>
  25. <p class="font-italic m-0">Descriptor, Alignment</p>
  26. <!-- basic stats -->
  27. <div class="card bg-danger rounded-0 w-75 my-2"></div>
  28. <ul class="list-unstyled m-0 text-danger">
  29. <li><span class="font-weight-bold mr-2">Armor Class</span> 00 (natural armor)</li>
  30. <li><span class="font-weight-bold mr-2">Hit Points</span> 00 (00d00 + 00)</li>
  31. <li><span class="font-weight-bold mr-2">Speed</span> 00ft., climb 00ft., fly 00ft.</li>
  32. </ul>
  33. <!-- stat values -->
  34. <div class="card bg-danger rounded-0 w-75 my-2"></div>
  35. <div class="container-fluid">
  36. <div class="row align-items-center justify-content-center">
  37. <!-- STAT1 -->
  38. <div class="col-lg-2">
  39. <div class="card bg-transparent border-0">
  40. <h3 class="text-center text-danger font-weight-bold text-uppercase">str</h3>
  41. <p class="text-center text-danger">00 (+/-0)</p>
  42. </div>
  43. </div>
  44. <!-- STAT2 -->
  45. <div class="col-lg-2">
  46. <div class="card bg-transparent border-0">
  47. <h3 class="text-center text-danger font-weight-bold text-uppercase">dex</h3>
  48. <p class="text-center text-danger">00 (+/-0)</p>
  49. </div>
  50. </div>
  51. <!-- STAT3 -->
  52. <div class="col-lg-2">
  53. <div class="card bg-transparent border-0">
  54. <h3 class="text-center text-danger font-weight-bold text-uppercase">con</h3>
  55. <p class="text-center text-danger">00 (+/-0)</p>
  56. </div>
  57. </div>
  58. <!-- STAT4 -->
  59. <div class="col-lg-2">
  60. <div class="card bg-transparent border-0">
  61. <h3 class="text-center text-danger font-weight-bold text-uppercase">int</h3>
  62. <p class="text-center text-danger">00 (+/-0)</p>
  63. </div>
  64. </div>
  65. <!-- STAT5 -->
  66. <div class="col-lg-2">
  67. <div class="card bg-transparent border-0">
  68. <h3 class="text-center text-danger font-weight-bold text-uppercase">wis</h3>
  69. <p class="text-center text-danger">00 (+/-0)</p>
  70. </div>
  71. </div>
  72. <!-- STAT6 -->
  73. <div class="col-lg-2">
  74. <div class="card bg-transparent border-0">
  75. <h3 class="text-center text-danger font-weight-bold text-uppercase">cha</h3>
  76. <p class="text-center text-danger">00 (+/-0)</p>
  77. </div>
  78. </div>
  79. </div>
  80. </div>
  81. <!-- advantages/ saving throws -->
  82. <div class="card bg-danger rounded-0 w-75 my-2"></div>
  83. <ul class="list-unstyled m-0 text-danger">
  84. <li><span class="font-weight-bold mr-2">Saving Throws</span> Val +0, Val</li>
  85. <li><span class="font-weight-bold mr-2">Skills</span> Skill +0, Skill +0, Skill +0</li>
  86. <li><span class="font-weight-bold mr-2">Damage Immunities</span> Element, element</li>
  87. <li><span class="font-weight-bold mr-2">Senses</span> PerceptionType 00ft., PerceptionType 00ft.</li>
  88. <li><span class="font-weight-bold mr-2">Languages</span> LanguageOne, LanguageTwo, LanguageThree</li>
  89. <li><span class="font-weight-bold mr-2">Challenge</span> 00 (000 XP)</li>
  90. </ul>
  91. <!-- special attribute -->
  92. <div class="card bg-danger rounded-0 w-75 my-2"></div>
  93. <p class="my-3"><span class="font-italic font-weight-bold mr-2">Special attibute</span> Description of attribute. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
  94. <!-- actions -->
  95. <h1 class="font-weight-light text-uppercase mt-2">actions</h1>
  96. <div class="card bg-muted rounded-0 w-100"></div>
  97. <ul class="list-unstyled mt-2 m-0">
  98. <li class="mb-3"><span class="font-weight-bold font-italic mr-2">Action One</span> Description of the action. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
  99. <li class="my-3"><span class="font-weight-bold font-italic mr-2">Action Two</span><span class="font-italic mr-2">Weapon Type</span> +0 to hit, reach 0ft., number of targets. <span class="font-italic mx-1">Hit:</span> (00d00 +00), damage type </li>
  100. <li class="my-3"><span class="font-weight-bold font-italic mr-2">Action Two</span><span class="font-italic mr-2">Weapon Type</span> +0 to hit, reach 0ft., number of targets. <span class="font-italic mx-1">Hit:</span> (00d00 +00), damage type </li>
  101. <li class="mt-3"><span class="font-weight-bold font-italic mr-2">Action Two</span><span class="font-italic mr-2">Weapon Type</span> +0 to hit, reach 0ft., number of targets. <span class="font-italic mx-1">Hit:</span> (00d00 +00), damage type </li>
  102. </ul>
  103. </div>
  104. </div>
  105. <!-- RIGHT COL, summary and details about the monster here
  106. NOTE: this section will NOT scroll
  107. -->
  108. <div class="col-lg-5 m-1">
  109. <div class="card border-0 bg-transparent p-2">
  110. <!--header-->
  111. <h1 class="text-danger text-uppercase mt-0" style="font-size:30px;">Monster Name</h1>
  112. <!-- paragraph bulk start-->
  113. <p class="m-0">Write a summary about the monster here. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tincidunt accumsan dolor tristique placerat. Maecenas eu quam vitae leo consequat elementum. Donec mattis at nisi ut pretium. In hac habitasse platea dictumst. Cras mattis risus sem, a lobortis ante tempus id. Fusce blandit erat non volutpat lacinia. Morbi varius venenatis libero, quis bibendum magna rhoncus quis. Duis et felis at massa eleifend faucibus. </p>
  114. <p class="m-0" style="text-indent:20px;"><span class="font-weight-bold font-italic">Special attribute.</span> Write about the special attribute here. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tincidunt accumsan dolor tristique placerat. Maecenas eu quam vitae leo consequat elementum. Donec mattis at nisi ut pretium. In hac habitasse platea dictumst. Cras mattis risus sem, a lobortis ante tempus id. Fusce blandit erat non volutpat lacinia. Morbi varius venenatis libero, quis bibendum magna rhoncus quis. Duis et felis at massa eleifend faucibus. </p>
  115. <p class="m-0" style="text-indent:20px;">Continued paragraph of the above special attribute. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tincidunt accumsan dolor tristique placerat. Maecenas eu quam vitae leo consequat elementum. Donec mattis at nisi ut pretium. In hac habitasse platea dictumst. Cras mattis risus sem, a lobortis ante tempus id. </p>
  116. <p class="m-0" style="text-indent:20px;"><span class="font-weight-bold font-italic">Special attribute.</span> Write about the special attribute here. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tincidunt accumsan dolor tristique placerat. Maecenas eu quam vitae leo consequat elementum. Donec mattis at nisi ut pretium. In hac habitasse platea dictumst. Cras mattis risus sem, a lobortis ante tempus id. Fusce blandit erat non volutpat lacinia. Morbi varius venenatis libero, quis bibendum magna rhoncus quis. Duis et felis at massa eleifend faucibus. </p>
  117. <!-- add the following code to add another paragraph
  118.  
  119. <p class="m-0" style="text-indent:20px;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tincidunt accumsan dolor tristique placerat...</p>
  120.  
  121. -->
  122. </div>
  123. </div>
  124. </div>
  125. <!-- credit -->
  126. <p class="small text-right"><a href="https://toyhou.se/6287023.-f2u-code-dnd-bestiary" target="_BLANK" class="text-muted">Layout from DND 5th Edition's Monster Manual<i class="fa fa-paw mr-1 ml-2"></i><i class="fas fa-crown mr-1"></i></a></p>
  127. </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!