API tools faq
paste
Necramancy

Sweet Treat: Portfolio - HTML

Necramancy
Mar 13th, 2021 (edited)
439
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.11 KB | None | 0 0
raw download clone embed print report
  1. <div class="body">
  2. <div class="header">
  3. <h1>SWEET TREAT</h1>
  4. <div class="nav">
  5. <a href="/profile/<PROFILE-ID>" class="profile"><img src="https://i.imgur.com/rF1AQhL.png"></a>
  6. <a href="/" class="exit"><img src="https://i.imgur.com/6l5r13d.png"></a>
  7. </div>
  8. </div>
  9.  
  10. <div class="section">
  11. <div class="intro">
  12. <img src="https://dappervolk.com/img/items/0/203-bNelJxT66q-golden-seajelly.png" class="icon">
  13. <h2>Hi! I'm Name ♥</h2>
  14. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. Praesent rhoncus vitae erat id vulputate. Ut maximus rutrum felis. Nullam ac convallis ante. Morbi ornare tellus at lectus tincidunt ultrices. Nunc ex justo, semper et pharetra eget, porttitor in nunc.</p>
  15. </div>
  16. <div class="avatar">
  17. <div class="bubble">
  18. <img src="https://i.imgur.com/fycBAjT.png">
  19. </div>
  20. </div>
  21.  
  22. <div class="wishlist clear">
  23. <h3>Wishlist</h3>
  24.  
  25. <div class="bar">
  26. <img title="Item Name" src="https://dappervolk.com/img/items/0/145-lNPqwlLjfs-barclays-flower-mantle.png">
  27. <img title="Item Name" src="https://dappervolk.com/img/items/0/145-lNPqwlLjfs-barclays-flower-mantle.png">
  28. <img title="Item Name" src="https://dappervolk.com/img/items/0/145-lNPqwlLjfs-barclays-flower-mantle.png">
  29. <img title="Item Name" src="https://dappervolk.com/img/items/0/145-lNPqwlLjfs-barclays-flower-mantle.png">
  30. <img title="Item Name" src="https://dappervolk.com/img/items/0/145-lNPqwlLjfs-barclays-flower-mantle.png">
  31. <img title="Item Name" src="https://dappervolk.com/img/items/0/145-lNPqwlLjfs-barclays-flower-mantle.png">
  32. <img title="Item Name" src="https://dappervolk.com/img/items/0/145-lNPqwlLjfs-barclays-flower-mantle.png">
  33. </div>
  34. </div>
  35.  
  36. <div class="bookmarks clear">
  37. <h3>Bookmarks</h3>
  38. <div class="btn-bar">
  39. <a href="/link" class="btn">Database</a>
  40. <a href="/link" class="btn">Database</a>
  41. <a href="/link" class="btn">Database</a>
  42. <a href="/link" class="btn">Database</a>
  43. </div>
  44. </div>
  45. </div>
  46.  
  47. <div class="section">
  48. <div class="heading float-heading">
  49. <img src="https://dappervolk.com/img/items/1/1369-kwjUOC1MeZ-marvels-strawberry-shortcake.png" class="icon">
  50. <h2>Photo Booth</h2>
  51. <p>Sweet and light, a true delight.</p>
  52. </div>
  53. <div class="look-block">
  54. <span><img src="https://i.imgur.com/fycBAjT.png"></span>
  55. <span><img src="https://i.imgur.com/ISvsmmL.png"></span>
  56. <span><img src="https://i.imgur.com/fycBAjT.png"></span>
  57. <span><img src="https://i.imgur.com/ISvsmmL.png"></span>
  58. <span><img src="https://i.imgur.com/fycBAjT.png"></span>
  59.  
  60. <div class="clear"></div>
  61. </div>
  62. </div>
  63.  
  64. <div class="section">
  65. <div class="wishlist clear">
  66. <h3>Affection Reminder</h3>
  67.  
  68. <div class="bar">
  69. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/84-DjLMEbQEht-spring-raptor-thumb.png"></a>
  70. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/70-wkcgiXqIVy-dark-crystal-skulling-thumb.png"></a>
  71. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/78-JuLaT1xPiq-celestial-sea-serpent-thumb.png"></a>
  72. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/84-DjLMEbQEht-spring-raptor-thumb.png"></a>
  73. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/70-wkcgiXqIVy-dark-crystal-skulling-thumb.png"></a>
  74. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/78-JuLaT1xPiq-celestial-sea-serpent-thumb.png"></a>
  75. </div>
  76. </div>
  77. </div>
  78.  
  79. <div class="section">
  80. <div class="width-50">
  81. <img src="https://dappervolk.com/img/items/1/1377-MZHvkJ6eyj-liefs-mystery-beverage.png">
  82. <h2>Chill Out</h2>
  83. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. Praesent rhoncus vitae erat id vulputate. Ut maximus rutrum felis. Nullam ac convallis ante. Morbi ornare tellus at lectus tincidunt ultrices. Nunc ex justo, semper et pharetra eget, porttitor in nunc.</p>
  84. </div>
  85.  
  86. <div class="goals width-50">
  87. <h3>Goals</h3>
  88. <ul>
  89. <li><b>+</b> List Item</li>
  90. <li><b>+</b> List Item</li>
  91. <li><b>+</b> List Item</li>
  92. <li><b>+</b> List Item</li>
  93. </ul>
  94. </div>
  95.  
  96. <div class="clear"></div>
  97. </div>
  98.  
  99. <div class="section right">
  100. <div class="heading float-heading">
  101. <img src="https://dappervolk.com/img/items/0/801-FF3MqYHDxd-bearnards-turnip-pannacotta.png" class="icon">
  102. <h2>Endless Treats</h2>
  103. <p>Jelly beans from the menagerie.</p>
  104. </div>
  105. <div class="pet-block">
  106. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/84-DjLMEbQEht-spring-raptor.png"></a>
  107. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/23-5yQ20O3mjD-luminous-seashark.png"></a>
  108. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/70-ysY3CXkN8W-dark-crystal-skulling.png"></a>
  109. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/25-U9koQIBsyM-swamp-hound.png"></a>
  110. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/15-tZOp9cWMaE-emerald-dragonlet.png"></a>
  111. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/25-U9koQIBsyM-swamp-hound.png"></a>
  112. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/23-5yQ20O3mjD-luminous-seashark.png"></a>
  113. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/84-DjLMEbQEht-spring-raptor.png"></a>
  114. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/15-tZOp9cWMaE-emerald-dragonlet.png"></a>
  115. <a href="https://dappervolk.com/pet/<PET-ID>"><img src="https://dappervolk.com/img/pets/0/70-ysY3CXkN8W-dark-crystal-skulling.png"></a>
  116. <div class="clear"></div>
  117. </div>
  118. </div>
  119.  
  120.  
  121. <div class="section">
  122. <div class="width-50">
  123. <img src="https://dappervolk.com/img/items/1/1378-xHaV5vpLfO-pelliers-honey-lemon-tea.png">
  124. <h2>Sweet Tea</h2>
  125. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. </p>
  126. </div>
  127.  
  128. <div class="width-50">
  129. <img src="https://i.imgur.com/MHfdko0.png">
  130. <h2>Candy, please!</h2>
  131. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. </p>
  132. </div>
  133.  
  134. <div class="clear"></div>
  135. </div>
  136.  
  137. <div class="section">
  138. <div class="width-30">
  139. <img src="https://dappervolk.com/img/items/1/1392-cLQR7DNKPD-blueberry-wrapped-candies.png">
  140. <h3>one</h3>
  141. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. </p>
  142. </div>
  143.  
  144. <div class="width-30">
  145. <img src="https://dappervolk.com/img/items/1/1389-kzdthmU7xg-lemon-wrapped-candies.png">
  146. <h3>two</h3>
  147. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. </p>
  148. </div>
  149.  
  150. <div class="width-30">
  151. <img src="https://dappervolk.com/img/items/1/1390-suIq5AR2WJ-strawberry-wrapped-candies.png">
  152. <h3>three</h3>
  153. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. </p>
  154. </div>
  155.  
  156. <div class="clear"></div>
  157. </div>
  158.  
  159. <div class="section">
  160. <div class="heading">
  161. <img src="https://dappervolk.com/img/items/1/1391-dDI7DY8VLv-mint-wrapped-candies.png" class="icon">
  162. <h2>Sourpatch Kids</h2>
  163. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. </p>
  164. </div>
  165.  
  166. <div class="spacer"></div>
  167.  
  168. <div class="goals clear">
  169. <h3>Achievements</h3>
  170. <ul>
  171. <li><a href="/TheseCanAlsoBeLinks"><b>+</b> List Item</a></li>
  172. <li><b>+</b> List Item</li>
  173. <li><b>+</b> List Item</li>
  174. <li><b>+</b> List Item</li>
  175. <li><b>+</b> List Item</li>
  176. <li><b>+</b> List Item</li>
  177. </ul>
  178. </div>
  179. </div>
  180.  
  181. <div class="section right">
  182. <div class="heading">
  183. <img src="https://dappervolk.com/img/items/1/1381-Omdp67xIwp-poes-coral-candy.png" class="icon">
  184. <h2>Fuzzy Peach</h2>
  185. <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer iaculis nunc lorem, congue auctor dui pellentesque non. </p>
  186. </div>
  187. </div>
  188.  
  189.  
  190. <div class="footer">
  191. <img src="https://dappervolk.com/img/items/1/1368-9J0qSIDIQ2-idras-crystal-cake.png">
  192.  
  193. <div class="spacer"></div>
  194.  
  195. Creatively crafted by <a href="/profile/<PROFILE-ID>">name</a>  ♥  Coding by <a href="https://dappervolk.com/forum/topic/13689">blankspace</a>
  196. </div>
  197. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!