API tools faq
paste
MCDogWarrior

Windows 95 character

MCDogWarrior
Aug 20th, 2021 (edited)
546
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.81 KB | None | 0 0
raw download clone embed print report
  1. <div class="container-fluid my-1" style="color:#ffffff;width:1000px;">
  2. <div class="card bg-faded rounded-0 border-0 p-5" style="background-color:#008282;height:650px;">
  3.  
  4. <!--Tab 1 start-->
  5.  
  6. <div class="tab-content">
  7. <div class="tab-pane active show" id="tab1">
  8. <div class="card bg-faded rounded-0" style="background:#181818;border:2px solid #181818;height:550px;">
  9. <div class="card bg-faded rounded-0" style="background:#c3c3c3;border:2px outset #f4f4f4;height:550px;">
  10. <!--Top bar/header/thingamabob-->
  11. <div class="card bg-faded p-2 rounded-0" style="background:#000082;height:26px;">
  12. <p style="font-size: 15px; text-align: left; font-family: helvetica; margin-top:-7px;"><strong>Welcome</strong></p>
  13. </div>
  14. <!--X (not functional)-->
  15. <div class="card bg-faded rounded-0" style="background:#c3c3c3;border:2px outset #f4f4f4;height:18px;width:20px;position:absolute;top:4px;right:4px;">
  16. <a style="position:absolute; bottom:-3px; left:3px; font-size:15px;color:#1a1a1a;"><i class="fas fa-times"></i> </a>
  17. </div>
  18. <!--Welcoming message-->
  19. <p class="ml-4 my-3" style="font-size: 35px; text-align: left; font-family: helvetica;color:#1a1a1a;">Welcome to <strong>(Name)'s page</strong></p>
  20. <div class="row no-gutters">
  21. <div class="col-8">
  22. <div class="card bg-faded rounded-0 ml-3 p-3" style="background:#ffffed;border:2px inset #f4f4f4;height:410px;">
  23. <!--Did you know... header-->
  24. <div class="row no-gutters">
  25. <div class="col-1">
  26. <div class="card rounded-0 border-0 mt-2 ml-2" style="background-image:url(https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/2de243d6-ec05-4a84-9349-779a25b48c92/deovspw-2a16e76a-9f45-4a20-9698-04d5ef0eb628.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzJkZTI0M2Q2LWVjMDUtNGE4NC05MzQ5LTc3OWEyNWI0OGM5MlwvZGVvdnNwdy0yYTE2ZTc2YS05ZjQ1LTRhMjAtOTY5OC0wNGQ1ZWYwZWI2MjgucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.G7BlhIAgmaQSC1mtaq-doG_wjjZ9cMuzc8lI0xtJVO4); background-size:cover; background-position: center; height:42px; width:30px;">
  27. </div>
  28. </div>
  29. <div class="col-4">
  30. <p class="ml-3 my-3" style="font-size: 17px; text-align: left; font-family: helvetica;color:#1a1a1a;"><strong>Did you know...</strong></p>
  31. </div>
  32. </div>
  33. <div class="row no-gutters">
  34. <div class="col-1">
  35. </div>
  36. <div class="col-11">
  37. <!--Main character paragraph-->
  38. <div class="card bg-faded rounded-0" style="background:#ffffed;height:300px;">
  39. <p class="ml-3 my-1" style="font-size: 15px; text-align: left; font-family: helvetica;color:#1a1a1a;">Here's where you write the main info of the character. Write as much as you can to try and fill the browser box, but not too much cus the box won't scroll (and if it did scroll it would look weird cus yknow Windows 95)</p>
  40. <a class="ml-3 my-1" style="font-size: 15px; text-align: left; font-family: helvetica;color:#1a1a1a;">Another paragraph for more information about the character if ya need it</p>
  41. </div>
  42. </div>
  43. </div>
  44. </div>
  45. </div>
  46. <div class="col-4">
  47. <!--Age-->
  48. <div class="card bg-faded rounded-0 ml-5 mr-5" style="background:#c3c3c3;border:2px outset #f4f4f4;">
  49. <p class="my-1" style="font-size: 15px; text-align: center; font-family: helvetica;color:#1a1a1a;">Age</p>
  50. </div>
  51. <!--Gender-->
  52. <div class="card bg-faded rounded-0 ml-5 mr-5 my-2" style="background:#c3c3c3;border:2px outset #f4f4f4;">
  53. <p class="my-1" style="font-size: 15px; text-align: center; font-family: helvetica;color:#1a1a1a;">Gender</p>
  54. </div>
  55. <!--Species-->
  56. <div class="card bg-faded rounded-0 ml-5 mr-5" style="background:#c3c3c3;border:2px outset #f4f4f4;">
  57. <p class="my-1" style="font-size: 15px; text-align: center; font-family: helvetica;color:#1a1a1a;">Species</p>
  58. </div>
  59. <!--Occupation-->
  60. <div class="card bg-faded rounded-0 ml-5 mr-5 my-2" style="background:#c3c3c3;border:2px outset #f4f4f4;">
  61. <p class="my-1" style="font-size: 15px; text-align: center; font-family: helvetica;color:#1a1a1a;">Occupation</p>
  62. </div>
  63. <!--Height-->
  64. <div class="card bg-faded rounded-0 ml-5 mr-5" style="background:#c3c3c3;border:2px outset #f4f4f4;">
  65. <p class="my-1" style="font-size: 15px; text-align: center; font-family: helvetica;color:#1a1a1a;">Height</p>
  66. </div>
  67. <!--Role-->
  68. <div class="card bg-faded rounded-0 ml-5 mr-5 my-2" style="background:#c3c3c3;border:2px outset #f4f4f4;">
  69. <p class="my-1" style="font-size: 15px; text-align: center; font-family: helvetica;color:#1a1a1a;">Role</p>
  70. </div>
  71. <!--Age-->
  72. <div class="card bg-faded rounded-0 ml-4 mr-4" style="background:#c3c3c3;border:2px inset #f4f4f4;height:3px;">
  73. </div>
  74. <!--Age-->
  75. <div class="card bg-faded rounded-0 ml-5 mr-5 my-2" style="background:#c3c3c3;border:2px outset #f4f4f4;">
  76. <a class="btn my-1 p-1" style="font-size: 15px; text-align: center; font-family: helvetica;color:#1a1a1a; border:2px dotted; height:30px"
  77. href="LINK TO DESIGNER">Designer</p>
  78. </div>
  79. </div>
  80. </div>
  81. </div>
  82. </div>
  83. </div>
  84.  
  85. <!--Tab 2 start-->
  86.  
  87. <div class="tab-pane" id="tab2">
  88. <div class="row no-gutters">
  89. <div class="col-1">
  90. </div>
  91. <div class="col-11">
  92. <div class="card bg-faded rounded-0" style="background:#181818;border:2px solid #181818;height:550px; width:700px;">
  93. <div class="card bg-faded rounded-0" style="background:#c3c3c3;border:2px outset #f4f4f4;height:550px;">
  94. <!--Header- change "untitled" to whatever you want (also update the tab title to make it look consistent)-->
  95. <div class="card bg-faded p-2 rounded-0" style="background:#000082;height:26px;">
  96. <p style="font-size: 15px; text-align: left; font-family: helvetica; margin-top:-7px;"><strong><i class="fas fa-file-edit"></i>&nbsp;untitled - Paint</strong></p>
  97. </div>
  98. <!--X returns-->
  99. <div class="card bg-faded rounded-0" style="background:#c3c3c3;border:2px outset #f4f4f4;height:18px;width:20px;position:absolute;top:4px;right:4px;">
  100. <a style="position:absolute; bottom:-3px; left:3px; font-size:15px;color:#1a1a1a;"><i class="fas fa-times"></i> </a>
  101. </div>
  102. <!--*sharp inhale* okay okay I can do this *sharp exhale*-->
  103. <p class="ml-2 my-1" style="font-size: 15px; text-align: left; font-family: helvetica;color:#1a1a1a;"><u>F</u>ile &nbsp; <u>E</u>dit &nbsp; <u>V</u>iew &nbsp; <u>I</u>mage &nbsp; <u>O</u>ptions &nbsp; <u>H</u>elp</p>
  104. <div class="row no-gutters">
  105. <div class="col-1">
  106. <!--Icon rows-->
  107. <div class="row no-gutters">
  108. <div class="col-6">
  109. <!--Icon set 1-->
  110. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  111. <i class="far fa-splotch" style="color:#1a1a1a; font-size: 17px;"></i>
  112. </div>
  113. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  114. <i class="fas fa-eraser" style="color:#1a1a1a; font-size: 17px;"></i>
  115. </div>
  116. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  117. <i class="fas fa-eye-dropper" style="color:#1a1a1a; font-size: 17px;"></i>
  118. </div>
  119. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  120. <i class="far fa-pencil" style="color:#1a1a1a; font-size: 17px;"></i>
  121. </div>
  122. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  123. <i class="far fa-spray-can" style="color:#1a1a1a; font-size: 17px;"></i>
  124. </div>
  125. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  126. <i class="far fa-horizontal-rule" style="color:#1a1a1a; font-size: 17px;transform:rotate(45deg)"></i>
  127. </div>
  128. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  129. <i class="far fa-object-ungroup" style="color:#1a1a1a; font-size: 17px;"></i>
  130. </div>
  131. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  132. <i class="far fa-draw-circle" style="color:#1a1a1a; font-size: 17px;"></i>
  133. </div>
  134. </div>
  135. <div class="col-6">
  136. <!--Icon set 2-->
  137. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  138. <i class="fal fa-rectangle-landscape" style="color:#1a1a1a; font-size: 17px;"></i>
  139. </div>
  140. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  141. <i class="fas fa-fill-drip" style="color:#1a1a1a; font-size: 17px;"></i>
  142. </div>
  143. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  144. <i class="far fa-search" style="color:#1a1a1a; font-size: 17px;"></i>
  145. </div>
  146. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  147. <i class="fas fa-brush" style="color:#1a1a1a; font-size: 17px;"></i>
  148. </div>
  149. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  150. <i class="fas fa-font" style="color:#1a1a1a; font-size: 17px;"></i>
  151. </div>
  152. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  153. <i class="far fa-wave-sine" style="color:#1a1a1a; font-size: 16px;transform:rotate(90deg)"></i>
  154. </div>
  155. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  156. <i class="far fa-object-group" style="color:#1a1a1a; font-size: 17px;"></i>
  157. </div>
  158. <div class="card bg-faded rounded-0 p-1 ml-2" style="background:#c3c3c3;border:2px outset #f4f4f4;height:28px; width:30px;">
  159. <i class="far fa-draw-polygon" style="color:#1a1a1a; font-size: 17px;"></i>
  160. </div>
  161. </div>
  162. </div>
  163. </div>
  164. <!--floaty empty box under icon rows-->
  165. <div class="card bg-faded rounded-0" style="background:#c3c3c3;border:2px inset #f4f4f4;height:90px; width:55px; position:absolute; bottom:168px; left:10px;">
  166. </div>
  167. <div class="col-11">
  168. <!--Main image on display (the drawing)-->
  169. <div class="card bg-faded rounded-0 ml-3" style="background:#fff; background-image:url(https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/2de243d6-ec05-4a84-9349-779a25b48c92/dep6qkr-d54fe2f4-a2a9-46ef-a4dc-f0c98ac4795e.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzJkZTI0M2Q2LWVjMDUtNGE4NC05MzQ5LTc3OWEyNWI0OGM5MlwvZGVwNnFrci1kNTRmZTJmNC1hMmE5LTQ2ZWYtYTRkYy1mMGM5OGFjNDc5NWUucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.j44prqynLPQRa98NOLuc4CGJeFp9ERZoUtB0JR98ZmA);background-size:cover; background-position: center;border:2px inset #f4f4f4;height:380px; width:610px;">
  170. </div>
  171. </div>
  172. </div>
  173. <div class="row no-gutters mt-3">
  174. <!--the color switcher thing (not functional obviously, it's just an image)-->
  175. <div class="card bg-faded rounded-0 ml-1" style="background:#c3c3c3;border:2px inset #f4f4f4;height:40px; width:40px;">
  176. <div class="card bg-faded rounded-0" style="background:#fff; background-image:url(https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/2de243d6-ec05-4a84-9349-779a25b48c92/depj71k-3ea268d6-6435-497d-abef-904417427f1c.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzJkZTI0M2Q2LWVjMDUtNGE4NC05MzQ5LTc3OWEyNWI0OGM5MlwvZGVwajcxay0zZWEyNjhkNi02NDM1LTQ5N2QtYWJlZi05MDQ0MTc0MjdmMWMucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.zt2Vf_BvMhLyUB08Bkw7agTPwL8yzG6pzh4zkdOxASo);background-size:contain; background-position: center;height:40px;">
  177. </div>
  178. </div>
  179. <!--ref colors-->
  180. <div class="row no-gutters">
  181. <!--black-->
  182. <div class="card bg-faded rounded-0 p-1 ml-1" style="background:#000000;border:2px inset #f4f4f4;height:30px; width:30px;">
  183. </div>
  184. <!--white-->
  185. <div class="card bg-faded rounded-0 p-1" style="background:#ffffff;border:2px inset #f4f4f4;height:30px; width:30px;">
  186. </div>
  187. <!--I reccomend keeping the white and black above ^ but you can change those too if you want. Everything under here are the other colors you can change for the ref v-->
  188. <!--color 1-->
  189. <div class="card bg-faded rounded-0 p-1" style="background:#ff0000;border:2px inset #f4f4f4;height:30px; width:30px;">
  190. </div>
  191. <!--color 2-->
  192. <div class="card bg-faded rounded-0 p-1" style="background:#ffff00;border:2px inset #f4f4f4;height:30px; width:30px;">
  193. </div>
  194. <!--color 3-->
  195. <div class="card bg-faded rounded-0 p-1" style="background:#00ff00;border:2px inset #f4f4f4;height:30px; width:30px;">
  196. </div>
  197. <!--color 4-->
  198. <div class="card bg-faded rounded-0 p-1" style="background:#00ffff;border:2px inset #f4f4f4;height:30px; width:30px;">
  199. </div>
  200. <!--color 5-->
  201. <div class="card bg-faded rounded-0 p-1" style="background:#0000ff;border:2px inset #f4f4f4;height:30px; width:30px;">
  202. </div>
  203. <!--color 6-->
  204. <div class="card bg-faded rounded-0 p-1" style="background:#ff00ff;border:2px inset #f4f4f4;height:30px; width:30px;">
  205. </div>
  206. </div>
  207. </div>
  208. <!--Bottom box-->
  209. <div class="card bg-faded rounded-0 mt-3 ml-1" style="background:#c3c3c3;border:2px inset #f4f4f4;height:30px; width:660px;">
  210. <p class="mt-1 ml-1" style="font-size: 15px; text-align: left; font-family: helvetica;color:#1a1a1a;">Artist credit here, or maybe some extra info if it was made by you.</p>
  211. </div>
  212. </div>
  213. </div>
  214. </div>
  215. </div>
  216. </div>
  217.  
  218. <!--Tabs-->
  219.  
  220. </div>
  221. </div>
  222. <div class="card bg-faded rounded-0" style="background:#c3c3c3;border:2px outset #f4f4f4;height:40px;">
  223. <div class="row no-gutters">
  224. <div class="col-1">
  225. <!--Start tab-->
  226. <div class="card bg-faded rounded-0 mt-1 ml-1" style="background:#c3c3c3;border:2px outset #f4f4f4;height:30px;">
  227. <div class="row no-gutters">
  228. <div class="col-4">
  229. <div class="card rounded-0 border-0" style="background-image:url(https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/2de243d6-ec05-4a84-9349-779a25b48c92/dep2owx-2ca6a0dd-e8c6-4fd8-85cb-b965077db3fb.png?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzJkZTI0M2Q2LWVjMDUtNGE4NC05MzQ5LTc3OWEyNWI0OGM5MlwvZGVwMm93eC0yY2E2YTBkZC1lOGM2LTRmZDgtODVjYi1iOTY1MDc3ZGIzZmIucG5nIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.oxSsf7SAVRtLib9RmwO2pGZAvtrlD-7Ed_mtV3aEBCk); background-size:cover; background-position: center; height:21px; width:22px;">
  230. </div>
  231. </div>
  232. <div class="col-8">
  233. <div class="card bg-faded rounded-0" style="background:#c3c3c3;height:0px;">
  234. </div>
  235. <p style="font-size: 15px; text-align: left; font-family: helvetica;color:#1a1a1a;"><strong>Start</strong></p>
  236. </div>
  237. </div>
  238. </div>
  239. </div>
  240. <!--Functional tabs-->
  241. <ul class="nav nav-tabs card-header-tabs row no-gutters mb-1">
  242. <!--Welcome tab-->
  243. <li class="col-md-3 mt-1 ml-1 mr-5"><a class="btn bg-faded btn-block rounded-0 active p-1" style="background:#c3c3c3;border:2px outset #f4f4f4;height:30px; width:180px; color:#1a1a1a; text-align: left;" data-toggle="tab" href="#tab1"><strong>Welcome</strong></a></li>
  244. <!--Paint tab (change "untitled" if you changed it previously)-->
  245. <li class="col-md-3 mt-1 ml-4"><a class="btn bg-faded btn-block rounded-0 p-1" style="background:#c3c3c3;border:2px outset #f4f4f4;height:30px; width:200px; color:#1a1a1a; text-align: left;" data-toggle="tab" href="#tab2"><strong><i class="fas fa-file-edit"></i>&nbsp;untitled - Paint</strong></a></li>
  246. <!--Windows shutdown sound that plays over the Start tab (it only plays once, otherwise it'll send you to the YouTube page)-->
  247. <iframe src="https://www.youtube-nocookie.com/embed/3JQF-c3ROSA?modestbranding=0" class="border-0" style="position: absolute; top:0px; left:0px; height: 2rem; width: 5rem; z-index: 9; opacity: 0;"></iframe>
  248. <!--Code credit (do NOT remove/alter)-->
  249. <div class="card bg-faded rounded-0" style="background:#c3c3c3;border:2px inset #f4f4f4;height:20px; width:110px; position:absolute; bottom:5px; right:5px;">
  250. <p style="text-align: right; position:absolute; bottom:0px; right:5px;"><span style="font-size: 9px;">Code by <a href="https://toyhou.se/MCDogResource" id="">MCDogWarrior</a></span></p>
  251. </div>
  252. </div>
  253. </div>
  254. </div>
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!