lowkeywicked

Freebie - Comm 01

Apr 24th, 2020 (edited)
4,983
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.25 KB | None | 0 0
  1. <div class="container p-0" style="letter-spacing: .25px;">
  2.  
  3. <!--------- INTRO CARD ---------------------------------------------->
  4. <div class="card d-block p-3 mb-4" style="border-style:dashed; border-radius: 1em;">
  5. <h1 class="bg-primary text-white p-2 text-uppercase display-4 rounded mb-3" style="letter-spacing: 2px;">
  6. <i class="fal fa-star fa-fw" /> Title Here</h1>
  7.  
  8. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at tellus sodales, sodales libero quis, maximus tellus. Ut sed pulvinar nisi. Phasellus eu massa leo. Praesent metus erat, hendrerit accumsan sagittis et, auctor id enim. Cras eget magna vestibulum, varius tellus euismod, semper metus. Suspendisse potenti. Praesent eu enim ut risus rutrum pharetra. Quisque tempus tortor vel nunc malesuada pretium. Praesent eu mollis augue.</p>
  9. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec at tellus sodales, sodales libero quis, maximus tellus. Ut sed pulvinar nisi. Phasellus eu massa leo. Praesent metus erat, hendrerit accumsan sagittis et, auctor id enim. Cras eget magna vestibulum, varius tellus euismod, semper metus. Suspendisse potenti. Praesent eu enim ut risus rutrum pharetra. Quisque tempus tortor vel nunc malesuada pretium. Praesent eu mollis augue.</p>
  10.  
  11. <div class="row justify-content-center mt-4">
  12.  
  13. <div class="col">
  14. <a href="LINK_HERE" target="_BLANK" class="btn btn-default btn-block mb-2">
  15. <i class="far fa-info-circle fa-fw mr-1" />ToS</a>
  16. </div>
  17.  
  18. <div class="col">
  19. <a href="LINK_HERE" target="_BLANK" class="btn btn-default btn-block mb-2">
  20. <i class="fas fa-image fa-fw mr-1" />Gallery</a>
  21. </div>
  22.  
  23. <div class="col">
  24. <a href="LINK_HERE" target="_BLANK" class="btn btn-default btn-block mb-2">
  25. <i class="far fa-list-alt fa-fw mr-1" />Work List</a>
  26. </div>
  27.  
  28. <div class="col">
  29. <a href="LINK_HERE" target="_BLANK" class="btn btn-default btn-block mb-2">
  30. <i class="fas fa-stars fa-fw mr-1" />Misc Link</a>
  31. </div>
  32. </div>
  33. </div>
  34.  
  35. <!------- STYLE OPTIONS -- IMAGES WILL CROP & SCALE WITH SCREEN --
  36. --------- use thumbnails that are AT LEAST 300 x 300 ------------->
  37. <div class="row justify-content-center">
  38.  
  39. <!-------- STYLE OPTION ---------------------------->
  40. <div class="col-md-6 mb-4">
  41. <div class="card d-block p-3 h-100" style="border-style:dashed; border-radius: 1em;">
  42. <h1 class="bg-primary text-white p-2 text-uppercase display-4 rounded mb-3" style="letter-spacing: 2px;">
  43. <i class="fal fa-star fa-fw" /> Style Name</h1>
  44. <div style="background-image: url("IMG_URL");
  45. max-width: 250px; height: 250px; background-size: cover; background-position: top center; border-radius: 1em;" class="d-block mx-auto mb-2"></div>
  46.  
  47. <p class="text-center"><b>Samples</b><br>
  48. <a href="SAMPLE_1" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  49. <a href="SAMPLE_2" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  50. <a href="SAMPLE_3" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  51. </p>
  52.  
  53. <p class="mb-3">Write a short description here.
  54.  
  55. <ul class="mb-0">
  56. <li class="mb-2"><b>Headshot</b> - $xx </li>
  57. <li class="mb-2"><b>Half Body</b> - $xx </li>
  58. <li class="mb-2"><b>Full body</b> - $xx </li>
  59. <li class="mb-2"><b>Chibi</b> - $xx </li>
  60. </ul>
  61. </div>
  62. </div>
  63.  
  64. <!-------- STYLE OPTION ---------------------------->
  65. <div class="col-md-6 mb-4">
  66. <div class="card d-block p-3 h-100" style="border-style:dashed; border-radius: 1em;">
  67. <h1 class="bg-primary text-white p-2 text-uppercase display-4 rounded mb-3" style="letter-spacing: 2px;">
  68. <i class="fal fa-star fa-fw" /> Style Name</h1>
  69.  
  70. <div style="background-image: url("IMG_URL");
  71. max-width: 250px; height: 250px; background-size: cover; background-position: top center; border-radius: 1em;" class="d-block mx-auto mb-2"></div>
  72.  
  73. <p class="text-center"><b>Samples</b><br>
  74. <a href="SAMPLE_1" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  75. <a href="SAMPLE_2" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  76. <a href="SAMPLE_3" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  77. </p>
  78.  
  79. <p class="mb-3">Write a short description here.
  80.  
  81. <ul class="mb-0">
  82. <li class="mb-2"><b>Sketch</b> - $xx </li>
  83. <li class="mb-2"><b>Flats</b> - $xx </li>
  84. <li class="mb-2"><b>Cel Shade</b> - $xx </li>
  85. <li class="mb-2"><b>Painted</b> - $xx </li>
  86. </ul>
  87. </div>
  88. </div>
  89.  
  90. <!-------- STYLE OPTION ---------------------------->
  91. <div class="col-md-6 mb-4">
  92. <div class="card d-block p-3 h-100" style="border-style:dashed; border-radius: 1em;">
  93. <h1 class="bg-primary text-white p-2 text-uppercase display-4 rounded mb-3" style="letter-spacing: 2px;">
  94. <i class="fal fa-star fa-fw" /> Style Name</h1>
  95.  
  96. <div style="background-image: url("IMG_URL");
  97. max-width: 250px; height: 250px; background-size: cover; background-position: top center; border-radius: 1em;" class="d-block mx-auto mb-2"></div>
  98.  
  99. <p class="text-center"><b>Samples</b><br>
  100. <a href="SAMPLE_1" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  101. <a href="SAMPLE_2" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  102. <a href="SAMPLE_3" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  103. </p>
  104.  
  105. <p class="mb-3">Write a short description here.
  106.  
  107. <ul class="mb-0">
  108. <li class="mb-2"><b>Headshot</b> - $xx </li>
  109. <li class="mb-2"><b>Half Body</b> - $xx </li>
  110. <li class="mb-2"><b>Full body</b> - $xx </li>
  111. <li class="mb-2"><b>Chibi</b> - $xx </li>
  112. </ul>
  113. </div>
  114. </div>
  115.  
  116. <!-------- STYLE OPTION ---------------------------->
  117. <div class="col-md-6 mb-4">
  118. <div class="card d-block p-3 h-100" style="border-style:dashed; border-radius: 1em;">
  119. <h1 class="bg-primary text-white p-2 text-uppercase display-4 rounded mb-3" style="letter-spacing: 2px;">
  120. <i class="fal fa-star fa-fw" /> Style Name</h1>
  121.  
  122. <div style="background-image: url("IMG_URL");
  123. max-width: 250px; height: 250px; background-size: cover; background-position: top center; border-radius: 1em;" class="d-block mx-auto mb-2"></div>
  124.  
  125. <p class="text-center"><b>Samples</b><br>
  126. <a href="SAMPLE_1" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  127. <a href="SAMPLE_2" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  128. <a href="SAMPLE_3" target="_blank"><i class="fas fa-circle fa-fw" /></a>
  129. </p>
  130.  
  131. <p class="mb-3">Write a short description here.
  132.  
  133. <ul class="mb-0">
  134. <li class="mb-2"><b>Sketch</b> - $xx </li>
  135. <li class="mb-2"><b>Flats</b> - $xx </li>
  136. <li class="mb-2"><b>Cel Shade</b> - $xx </li>
  137. <li class="mb-2"><b>Painted</b> - $xx </li>
  138. </ul>
  139. </div>
  140. </div>
  141.  
  142. </div>
  143.  
  144. <!--------- DOs & DONTs -------------------------->
  145. <div class="card d-block p-3 mb-4" style="border-style:dashed; border-radius: 1em;">
  146. <h1 class="bg-primary text-white p-2 text-uppercase display-4 rounded mb-3" style="letter-spacing: 2px;">
  147. <i class="fal fa-list fa-fw" /> Details</h1>
  148.  
  149. <div class="row mt-3 px-2">
  150. <div class="col-md-6 mb-2">
  151. <!---------- STRENGTHS ------------------------>
  152. <h2 class="text-uppercase" style="letter-spacing:1px; font-weight: 300; border-bottom-width: 1px; border-bottom-style:solid;"><i class="fas fa-check fa-fw" /> Strengths</h2>
  153.  
  154. <ul class="mb-0">
  155. <li class="mb-2">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
  156. <li class="mb-2">Donec at tellus sodales, sodales libero quis, maximus tellus.</li>
  157. <li class="mb-2">Ut sed pulvinar nisi.</li>
  158. <li class="mb-2">Phasellus eu massa leo.</li>
  159. <li class="mb-2">Praesent metus erat, hendrerit accumsan sagittis et, auctor id enim.</li>
  160. </ul>
  161. </div>
  162.  
  163. <div class="col-md-6 mb-2">
  164. <!---------- WONT DRAW ------------------------>
  165. <h2 class="text-uppercase" style="letter-spacing:1px; font-weight: 300; border-bottom-width: 1px; border-bottom-style:solid;"><i class="fas fa-times fa-fw" /> Won't Draw</h2>
  166.  
  167. <ul class="mb-0">
  168. <li class="mb-2">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</li>
  169. <li class="mb-2">Donec at tellus sodales, sodales libero quis, maximus tellus.</li>
  170. <li class="mb-2">Ut sed pulvinar nisi.</li>
  171. <li class="mb-2">Phasellus eu massa leo.</li>
  172. <li class="mb-2">Praesent metus erat, hendrerit accumsan sagittis et, auctor id enim.</li>
  173. </ul>
  174. </div>
  175. </div>
  176. </div>
  177.  
  178. <div class="row">
  179. <!------------- ORDERING ------------------------------------>
  180. <div class="col-md-6 mb-4">
  181. <div class="card d-block p-3 h-100" style="border-style:dashed; border-radius: 1em;">
  182. <h1 class="bg-primary text-white p-2 text-uppercase display-4 rounded mb-3" style="letter-spacing: 2px;">
  183. <i class="fal fa-envelope fa-fw" /> Ordering</h1>
  184.  
  185. <p>If you are interested in ordering, please fill in the order form & PM/post/email/whatever you want ppl to do</p>
  186. <hr>
  187.  
  188. <h2 class="text-uppercase text-muted" style="letter-spacing:1px; font-weight: 300;">
  189. Current Queue</h2>
  190. <div class="row">
  191. <div class="col-sm-6">
  192. <ul class="mb-0">
  193. <li>name</li>
  194. <li>name</li>
  195. </ul>
  196. </div>
  197. <div class="col-sm-6">
  198. <ul class="mb-0">
  199. <li>name</li>
  200. <li>name</li>
  201. </ul>
  202. </div>
  203. </div>
  204. </div>
  205. </div>
  206.  
  207. <!------------- ORDER FORM ------------------------------------>
  208. <div class="col-md-6 mb-4">
  209. <div class="card d-block p-3 h-100" style="border-style:dashed; border-radius: 1em;">
  210. <h1 class="bg-primary text-white p-2 text-uppercase display-4 rounded mb-3" style="letter-spacing: 2px;">
  211. <i class="fal fa-file fa-fw" /> Order Form</h1>
  212.  
  213. <p><b>Name:</b> ---</p>
  214. <p><b>Style:</b> ---</p>
  215. <p><b>Refs:</b> ---</p>
  216. <p><b>Notes:</b> ---</p>
  217. <p><b>Etc:</b> (put whatever your form is here)</p>
  218. </div>
  219. </div>
  220. </div>
  221.  
  222. <hr>
  223. <!------------ LEAVE CREDIT ---->
  224. <p class="text-right small">HTML by @Pinky</p>
  225. </div>
Add Comment
Please, Sign In to add comment