API tools faq
paste
Advertisement
LeafJelly

Detailed Trade Prefs - TH Colors - Star Ratings

LeafJelly
Jan 28th, 2023 (edited)
1,248
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 67.19 KB | None | 0 0
raw download clone embed print report
  1. <!-------------------------------------------------------
  2. Free to Use Detailed Trade Preferences
  3. TH Theme Colors Version
  4. WITH STAR RATINGS
  5. HTML by LeafJelly
  6.  
  7. Change the star rating for each listed item to show your trading priority for it/how much you love the listed item.
  8.  
  9. How to Change the Stars from solid to empty:
  10. There's two ways, you can copy and paste the follower codes:
  11. 3 Stars <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  12. 2 Stars <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  13. 1 Star <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  14. 0 Stars <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  15.  
  16. Or you can change the text at the start of each <i class= as follows:
  17. fas for a solid star
  18. far for a empty star
  19.  
  20. Add this code after your typed content for a magnify glass symbol to indicate that you are picky about it
  21. <span><i class="fas fa-magnifying-glass fa-sm ml-1"></i></span>
  22.  
  23. Add this code after where it says to (written in the code annotations) for an indented bulletin to write extra info
  24. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  25. Extra Info
  26. </li></ul>
  27. -------------------------------------------------------->
  28. <div class="col-12 card bg-faded shadow p-0 pb-2 mx-auto mb-3" style="font-size:13px;border-radius:1.3em; max-width:1600px;">
  29. <div class="card card-primary text-center p-2 mb-2" style="font-size:1.6em; font-weight:500; letter-spacing:3px; border-radius: .8em .8em 0 0"><p>
  30. <i class="fas fa-right-left pull-left px-3" style="font-size:1.3em"></i>
  31.  
  32. Username's Trade Preferences
  33.  
  34. <i class="fas fa-handshake pull-right px-3" style="font-size:1.3em"></i></p>
  35. </div>
  36.  
  37. <div class="col-auto card card-body p-1 mx-auto my-2">
  38. <h4 class="text-center" style="letter-spacing:1.5px">
  39. Key
  40. </h4><hr class="m-0 mb-1 ">
  41. <div class="row no-gutters justify-content-center">
  42. <div class="badge badge-primary p-1 px-2 m-1 font-weight-normal" style="font-size:1em"><i class="fal fa-heart"></i>
  43. Love
  44. </div>
  45.  
  46. <div class="badge badge-success p-1 px-2 m-1 font-weight-normal" style="font-size:1em"><i class="fal fa-check"></i>
  47. Like
  48. </div>
  49.  
  50. <div class="badge badge-warning p-1 px-2 m-1 font-weight-normal" style="font-size:1em"><i class="fal fa-question"></i>
  51. Uncertain
  52. </div>
  53.  
  54. <div class="badge badge-danger p-1 px-2 m-1 font-weight-normal" style="font-size:1em"><i class="fal fa-xmark"></i>
  55. Dislike
  56. </div>
  57.  
  58. <div class="btn btn-secondary active p-1 px-2 m-1 font-weight-normal" style="font-size:1em"><i class="fal fa-magnifying-glass"></i>
  59. Picky
  60. </div>
  61.  
  62. </div>
  63. <div class="row no-gutters justify-content-center">
  64. <div class="btn btn-secondary active p-1 px-2 m-1 font-weight-normal" style="font-size:1em">
  65. <i class="fas fa-star fa-sm"></i><i class="fas fa-star fa-sm"></i><i class="fas fa-star fa-sm"></i>
  66. Actively Seeking
  67. </div>
  68.  
  69. <div class="btn btn-secondary active p-1 px-2 m-1 font-weight-normal" style="font-size:1em">
  70. <i class="fas fa-star fa-sm"></i><i class="fas fa-star fa-sm"></i><i class="far fa-star fa-sm"></i>
  71. Kinda Seeking
  72. </div>
  73.  
  74. <div class="btn btn-secondary active p-1 px-2 m-1 font-weight-normal" style="font-size:1em">
  75. <i class="fas fa-star fa-sm"></i><i class="far fa-star fa-sm"></i><i class="far fa-star fa-sm"></i>
  76. Somewhat Seeking
  77. </div>
  78.  
  79. <div class="btn btn-secondary active p-1 px-2 m-1 font-weight-normal" style="font-size:1em">
  80. <i class="far fa-star fa-sm"></i><i class="far fa-star fa-sm"></i><i class="far fa-star fa-sm"></i>
  81. Not Looking for ATM
  82. </div>
  83.  
  84. </div>
  85. </div>
  86.  
  87. <div class="col-12 p-2 px-md-3 mx-auto row no-gutters justify-content-center">
  88.  
  89. <!---========================================
  90.  
  91. ACTIVELY SEEKING
  92.  
  93. ============================================-->
  94. <div class="col-12 col-md-6 col-lg-4 p-2"><div class="alert alert-success p-2 m-0 h-100">
  95. <h4 class="text-center" style="letter-spacing:1.5px"><i class="fas fa-heart"></i>
  96.  
  97. Actively Seeking
  98.  
  99. <i class="fas fa-heart"></i></h4>
  100. <hr class="m-0 mb-2">
  101. <p>
  102. A list of things you're currently really looking for! Hopefully this will get more people to offer it to you, and make it clear to people what you're more likely to accept in a trade.
  103. </p>
  104. <ul class="pl-4 m-0">
  105. <li>One</li>
  106. <li>Two</li>
  107. <li>Three</li>
  108.  
  109. <!----- Copy and paste above here for more Bulletins------->
  110. </ul>
  111. </div></div>
  112.  
  113.  
  114. <!---========================================
  115.  
  116. DO NOT OFFER WARNING
  117.  
  118. ============================================-->
  119. <div class="col-12 col-md-6 col-lg-4 p-2"><div class="alert alert-danger p-2 m-0 h-100">
  120. <h4 class="text-center font-weight-bold" style="letter-spacing:1.5px"><i class="fas fa-triangle-exclamation"></i>
  121.  
  122. DO NOT OFFER
  123.  
  124. <i class="fas fa-triangle-exclamation"></i></h4>
  125. <hr class="m-0 mb-2">
  126. <p>
  127. A Big warning sign to tell people what your 100% hard decline things are. Things you absolutely do not want, and it's pointless in offering it to you. Or just a general warning for ppl to read before they offer.
  128. </p>
  129. <ul class="pl-4 m-0">
  130. <li>One</li>
  131. <li>Two</li>
  132. <li>Three</li>
  133.  
  134. <!----- Copy and paste above here for more Bulletins------->
  135. </ul>
  136. </div></div>
  137.  
  138.  
  139. <!---========================================
  140.  
  141. CONTACT INFO
  142. Delete the buttons / Info Bubbles you don't use!
  143. The bottom two are NOT buttons, they're just info bubbles.
  144. ============================================-->
  145. <div class="col-12 col-lg-4 p-2"><div class="card card-body p-2 m-0 h-100">
  146. <h4 class="text-center" style="letter-spacing:1.5px"><i class="far fa-envelope"></i>
  147.  
  148. Contact Info
  149.  
  150. </h4>
  151. <hr class="m-0 mb-2">
  152. <p>
  153. Optional Text. The first three are Buttons, the last two are info bubbles. You can delete the ones you don't need.
  154. </p>
  155.  
  156. <div class="col-0 justify-content-center d-flex flex-wrap m-auto">
  157. <!----- Toyhouse Messages, add your username to the end of the URL after create/ ------->
  158. <a href="https://toyhou.se/~messages/create/YOUR_USERNAME_HERE" target="_BLANK" class="btn btn-outline-primary m-1">
  159. <i class="fal fa-envelope fa-lg px-1"></i>
  160. Message
  161. </a>
  162. <!-- Message Button End ---->
  163.  
  164. <!----- Add a link to your trade bulletin ------->
  165. <a href="URL_HERE" target="_BLANK" class="btn btn-outline-primary m-1">
  166. <i class="fal fa-memo fa-lg px-1"></i>
  167. Bulletin
  168. </a>
  169. <!-- Bulletin Button End ---->
  170.  
  171. <!----- Add a link to where you want people to comment for trade offers ------->
  172. <a href="URL_HERE" target="_BLANK" class="btn btn-outline-primary m-1">
  173. <i class="fal fa-comment fa-lg px-1"></i>
  174. Comment
  175. </a>
  176. <!-- Comment Button End ---->
  177.  
  178. <!----- Comment on the Chara Info Bubble ----->
  179. <div class="badge badge-primary p-1 px-3 m-1 font-weight-normal align-items-center" style="font-size:1em">
  180. <i class="fal fa-comments pr-1"></i>
  181. Comment on the Character
  182. </div>
  183. <!-- Comment Info Bubble End ---->
  184.  
  185. <!----- Discord Info Bubble ----->
  186. <div class="badge badge-primary p-1 px-3 m-1 font-weight-normal align-items-center" style="font-size:1em">
  187. <i class="fab fa-discord pr-1"></i>
  188. DM username####
  189. </div>
  190. <!-- Discord Info Bubble End ---->
  191.  
  192. <!---- Don't touch this ----->
  193. </div>
  194. </div></div>
  195.  
  196. <!---========================================
  197.  
  198. DESIGNER PREFERENCES
  199.  
  200. How to Change the Stars from solid to empty:
  201. There's two ways, you can copy and paste the follower codes:
  202. 3 Stars <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  203. 2 Stars <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  204. 1 Star <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  205. 0 Stars <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  206.  
  207. Or you can change the text at the start of each <i class= as follows:
  208. fas for a solid star
  209. far for a empty star
  210.  
  211. Add this code after your typed content for a magnify glass symbol to indicate that you are picky about it
  212. <span><i class="fas fa-magnifying-glass fa-sm ml-1"></i></span>
  213. ============================================-->
  214. <div class="col-12 col-md-6 col-lg-3 p-2"><div class="card card-body p-2 m-0 h-100">
  215. <h4 class="text-center" style="letter-spacing:1.5px"><i class="far fa-user pull-right"></i>
  216. Designer
  217. </h4>
  218. <hr class="m-0 mb-2">
  219. <!---- Text ------>
  220. <p>
  221. Optional Text Section. If you want to write something.
  222. </p>
  223.  
  224. <ul class="pl-2 pr-1 m-0" style="list-style:none">
  225. <!--------------- Heart Love List START -------------->
  226. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  227. Content
  228.  
  229. <!----- Magnify Glass (Delete it if you don't want it)----->
  230. <span><i class="fas fa-magnifying-glass fa-sm ml-1"></i></span>
  231.  
  232. <hr class="col my-auto mx-2">
  233. <!--- 3 Stars --->
  234. <span class="pull-right">
  235. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  236. </span>
  237. </li><!-- Paste the Indented Bulletin Code after here-->
  238. <!--- Indented Bulletin -----
  239. copy and paste these 3 lines of code for another indented bulletin
  240. ------------------------------->
  241. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  242. Extra Info
  243. </li></ul>
  244.  
  245. <!-------------------------------->
  246. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  247. Content
  248.  
  249. <hr class="col my-auto mx-2">
  250. <!-------- 2 Stars --------->
  251. <span class="pull-right">
  252. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  253. </span>
  254. </li><!-- Paste the Indented Bulletin Code after here-->
  255. <!-------------------------------->
  256. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  257. Content
  258.  
  259. <hr class="col my-auto mx-2">
  260. <!-------- 1 Star --------->
  261. <span class="pull-right">
  262. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  263. </span>
  264. </li><!-- Paste the Indented Bulletin Code after here-->
  265. <!-------------------------------->
  266. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  267. Content
  268.  
  269. <hr class="col my-auto mx-2">
  270. <!-------- 0 Star --------->
  271. <span class="pull-right">
  272. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  273. </span>
  274. </li><!-- Paste the Indented Bulletin Code after here-->
  275. <!-------------------------------->
  276. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  277. Content
  278.  
  279. </li><!-- Paste the Indented Bulletin Code after here-->
  280. <!-------------------------------->
  281.  
  282. <!----Copy and paste above here for more Heart Love lines----->
  283.  
  284. <!-------------- Green Like List START ------------->
  285. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  286. Content
  287. <!----- Magnify Glass (Delete it if you don't want it)----->
  288. <span><i class="fas fa-magnifying-glass fa-sm ml-1"></i></span>
  289.  
  290. <hr class="col my-auto mx-2">
  291. <!-------- 3 Star --------->
  292. <span class="pull-right">
  293. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  294. </span>
  295. </li><!-- Paste the Indented Bulletin Code after here-->
  296. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  297. Extra Info
  298.  
  299. </li></ul>
  300. <!-------------------------------->
  301. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  302. Content
  303. <hr class="col my-auto mx-2">
  304. <!-------- 2 Star --------->
  305. <span class="pull-right">
  306. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  307. </span>
  308. </li><!-- Paste the Indented Bulletin Code after here-->
  309. <!-------------------------------->
  310. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  311. Content
  312. <hr class="col my-auto mx-2">
  313. <!-------- 1 Star --------->
  314. <span class="pull-right">
  315. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  316. </span>
  317. </li><!-- Paste the Indented Bulletin Code after here-->
  318. <!-------------------------------->
  319. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  320. Content
  321. <hr class="col my-auto mx-2">
  322. <!-------- 0 Star --------->
  323. <span class="pull-right">
  324. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  325. </span>
  326. </li><!-- Paste the Indented Bulletin Code after here-->
  327. <!-------------------------------->
  328. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  329. Content
  330. </li><!-- Paste the Indented Bulletin Code after here-->
  331. <!-------------------------------->
  332.  
  333.  
  334. <!----Copy and paste above here for more Green Like Lines----->
  335.  
  336. <!------------ ? Uncertain List START ----------->
  337. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  338. Content
  339. <!----- Magnify Glass (Delete it if you don't want it)----->
  340. <span><i class="fas fa-magnifying-glass fa-sm ml-1"></i></span>
  341. </li><!-- Paste the Indented Bulletin Code after here-->
  342. <!-------------------------------->
  343. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  344. Content
  345. </li><!-- Paste the Indented Bulletin Code after here-->
  346. <!-------------------------------->
  347. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  348. Content
  349. </li><!-- Paste the Indented Bulletin Code after here-->
  350. <!-------------------------------->
  351.  
  352.  
  353. <!----Copy and paste above here for more ? Uncertain Lines ----->
  354. <!---------- X Dislike List START -------->
  355. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  356. Content
  357. </li><!-- Paste the Indented Bulletin Code after here-->
  358. <!-------------------------------->
  359. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  360. Content
  361. </li><!-- Paste the Indented Bulletin Code after here-->
  362. <!-------------------------------->
  363.  
  364.  
  365. <!----Copy and paste above here for more X Dislike Lines ----->
  366. </ul>
  367. </div></div>
  368.  
  369. <!---========================================
  370.  
  371. SPECIES
  372.  
  373. ============================================-->
  374. <div class="col-12 col-md-6 col-lg-3 p-2"><div class="card card-body p-2 m-0 h-100">
  375. <h4 class="text-center" style="letter-spacing:1.5px"><i class="far fa-planet-moon pull-right"></i>
  376. Species
  377. </h4>
  378. <hr class="m-0 mb-2">
  379. <!---- Text ------>
  380. <p>
  381. Optional Text Section. If you want to write something.
  382. </p>
  383.  
  384. <ul class="pl-2 pr-1 m-0" style="list-style:none">
  385. <!--------------- Heart Love List START -------------->
  386. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  387. Content
  388.  
  389. <!----- Magnify Glass (Delete it if you don't want it)----->
  390. <span><i class="fas fa-magnifying-glass fa-sm ml-1"></i></span>
  391.  
  392. <hr class="col my-auto mx-2">
  393. <!--- 3 Stars --->
  394. <span class="pull-right">
  395. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  396. </span>
  397. </li><!-- Paste the Indented Bulletin Code after here-->
  398. <!--- Indented Bulletin -----
  399. copy and paste these 3 lines of code for another indented bulletin
  400. ------------------------------->
  401. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  402. Extra Info
  403. </li></ul>
  404. <!-------------------------------->
  405. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  406. Content
  407.  
  408. <hr class="col my-auto mx-2">
  409. <!-------- 2 Stars --------->
  410. <span class="pull-right">
  411. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  412. </span>
  413. </li><!-- Paste the Indented Bulletin Code after here-->
  414. <!-------------------------------->
  415. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  416. Content
  417.  
  418. <hr class="col my-auto mx-2">
  419. <!-------- 1 Star --------->
  420. <span class="pull-right">
  421. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  422. </span>
  423. </li><!-- Paste the Indented Bulletin Code after here-->
  424. <!-------------------------------->
  425. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  426. Content
  427.  
  428. <hr class="col my-auto mx-2">
  429. <!-------- 0 Star --------->
  430. <span class="pull-right">
  431. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  432. </span>
  433. </li><!-- Paste the Indented Bulletin Code after here-->
  434. <!-------------------------------->
  435. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  436. Content
  437.  
  438. </li><!-- Paste the Indented Bulletin Code after here-->
  439. <!-------------------------------->
  440.  
  441. <!----Copy and paste above here for more Heart Love lines----->
  442.  
  443. <!-------------- Green Like List START ------------->
  444. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  445. Content
  446. <!----- Magnify Glass (Delete it if you don't want it)----->
  447. <span><i class="fas fa-magnifying-glass fa-sm ml-1"></i></span>
  448.  
  449. <hr class="col my-auto mx-2">
  450. <!-------- 3 Star --------->
  451. <span class="pull-right">
  452. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  453. </span>
  454. </li><!-- Paste the Indented Bulletin Code after here-->
  455. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  456. Extra Info
  457.  
  458. </li></ul>
  459. <!-------------------------------->
  460. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  461. Content
  462. <hr class="col my-auto mx-2">
  463. <!-------- 2 Star --------->
  464. <span class="pull-right">
  465. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  466. </span>
  467. </li><!-- Paste the Indented Bulletin Code after here-->
  468. <!-------------------------------->
  469. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  470. Content
  471. <hr class="col my-auto mx-2">
  472. <!-------- 1 Star --------->
  473. <span class="pull-right">
  474. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  475. </span>
  476. </li><!-- Paste the Indented Bulletin Code after here-->
  477. <!-------------------------------->
  478. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  479. Content
  480. <hr class="col my-auto mx-2">
  481. <!-------- 0 Star --------->
  482. <span class="pull-right">
  483. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  484. </span>
  485. </li><!-- Paste the Indented Bulletin Code after here-->
  486. <!-------------------------------->
  487. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  488. Content
  489. </li><!-- Paste the Indented Bulletin Code after here-->
  490. <!-------------------------------->
  491.  
  492.  
  493. <!----Copy and paste above here for more Green Like Lines----->
  494.  
  495. <!------------ ? Uncertain List START ----------->
  496. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  497. Content
  498. <!----- Magnify Glass (Delete it if you don't want it)----->
  499. <span><i class="fas fa-magnifying-glass fa-sm ml-1"></i></span>
  500. </li><!-- Paste the Indented Bulletin Code after here-->
  501. <!-------------------------------->
  502. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  503. Content
  504. </li><!-- Paste the Indented Bulletin Code after here-->
  505. <!-------------------------------->
  506. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  507. Content
  508. </li><!-- Paste the Indented Bulletin Code after here-->
  509. <!-------------------------------->
  510.  
  511.  
  512. <!----Copy and paste above here for more ? Uncertain Lines ----->
  513. <!---------- X Dislike List START -------->
  514. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  515. Content
  516. </li><!-- Paste the Indented Bulletin Code after here-->
  517. <!-------------------------------->
  518. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  519. Content
  520. </li><!-- Paste the Indented Bulletin Code after here-->
  521. <!-------------------------------->
  522.  
  523.  
  524. <!----Copy and paste above here for more X Dislike Lines ----->
  525. </ul>
  526. </div></div>
  527.  
  528. <!---========================================
  529.  
  530. PHYSICAL TRAITS
  531.  
  532. ============================================-->
  533. <div class="col-12 col-md-6 col-lg-3 p-2"><div class="card card-body p-2 m-0 h-100">
  534. <h4 class="text-center" style="letter-spacing:1.5px"><i class="far fa-eye pull-right"></i>
  535. Physical Traits
  536. </h4>
  537. <hr class="m-0 mb-2">
  538. <!------- Text --------->
  539. <p>
  540. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  541. </p>
  542.  
  543. <ul class="pl-2 pr-1 m-0" style="list-style:none">
  544. <!--------------- Heart Love List START -------------->
  545. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  546. Content
  547. <hr class="col my-auto mx-2">
  548. <!--- 3 Stars --->
  549. <span class="pull-right">
  550. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  551. </span>
  552. </li><!-- Paste the Indented Bulletin Code after here-->
  553. <!--- Indented Bulletin -----
  554. copy and paste these 3 lines of code for another indented bulletin
  555. ------------------------------->
  556. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  557. Extra Info
  558. </li></ul>
  559. <!-------------------------------->
  560. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  561. Content
  562. <hr class="col my-auto mx-2">
  563. <!-------- 2 Stars --------->
  564. <span class="pull-right">
  565. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  566. </span>
  567. </li><!-- Paste the Indented Bulletin Code after here-->
  568. <!-------------------------------->
  569. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  570. Content
  571. <hr class="col my-auto mx-2">
  572. <!-------- 1 Star --------->
  573. <span class="pull-right">
  574. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  575. </span>
  576. </li><!-- Paste the Indented Bulletin Code after here-->
  577. <!-------------------------------->
  578. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  579. Content
  580. <hr class="col my-auto mx-2">
  581. <!-------- 0 Star --------->
  582. <span class="pull-right">
  583. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  584. </span>
  585. </li><!-- Paste the Indented Bulletin Code after here-->
  586. <!-------------------------------->
  587. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  588. Content
  589. </li><!-- Paste the Indented Bulletin Code after here-->
  590. <!-------------------------------->
  591.  
  592. <!----Copy and paste above here for more Heart Love lines----->
  593. <!-------------- Green Like List START ------------->
  594. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  595. Content
  596. <hr class="col my-auto mx-2">
  597. <!-------- 3 Star --------->
  598. <span class="pull-right">
  599. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  600. </span>
  601. </li><!-- Paste the Indented Bulletin Code after here-->
  602. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  603. Extra Info
  604. </li></ul>
  605. <!-------------------------------->
  606. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  607. Content
  608. <hr class="col my-auto mx-2">
  609. <!-------- 2 Star --------->
  610. <span class="pull-right">
  611. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  612. </span>
  613. </li><!-- Paste the Indented Bulletin Code after here-->
  614. <!-------------------------------->
  615. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  616. Content
  617. <hr class="col my-auto mx-2">
  618. <!-------- 1 Star --------->
  619. <span class="pull-right">
  620. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  621. </span>
  622. </li><!-- Paste the Indented Bulletin Code after here-->
  623. <!-------------------------------->
  624. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  625. Content
  626. <hr class="col my-auto mx-2">
  627. <!-------- 0 Star --------->
  628. <span class="pull-right">
  629. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  630. </span>
  631. </li><!-- Paste the Indented Bulletin Code after here-->
  632. <!-------------------------------->
  633. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  634. Content
  635. </li><!-- Paste the Indented Bulletin Code after here-->
  636. <!-------------------------------->
  637.  
  638.  
  639. <!----Copy and paste above here for more Green Like Lines----->
  640. <!------------ ? Uncertain List START ----------->
  641. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  642. Content
  643. </li><!-- Paste the Indented Bulletin Code after here-->
  644. <!-------------------------------->
  645. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  646. Content
  647. </li><!-- Paste the Indented Bulletin Code after here-->
  648. <!-------------------------------->
  649. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  650. Content
  651. </li><!-- Paste the Indented Bulletin Code after here-->
  652. <!-------------------------------->
  653.  
  654.  
  655. <!----Copy and paste above here for more ? Uncertain Lines ----->
  656. <!---------- X Dislike List START -------->
  657. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  658. Content
  659. </li><!-- Paste the Indented Bulletin Code after here-->
  660. <!-------------------------------->
  661. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  662. Content
  663. </li><!-- Paste the Indented Bulletin Code after here-->
  664. <!-------------------------------->
  665.  
  666.  
  667. <!----Copy and paste above here for more X Dislike Lines ----->
  668. </ul>
  669. </div></div>
  670.  
  671. <!---========================================
  672.  
  673. Clothing
  674.  
  675. ============================================-->
  676. <div class="col-12 col-md-6 col-lg-3 p-2"><div class="card card-body p-2 m-0 h-100">
  677. <h4 class="text-center" style="letter-spacing:1.5px"><i class="far fa-clothes-hanger pull-right"></i>
  678. Clothing
  679. </h4>
  680. <hr class="m-0 mb-2">
  681. <!------- Text --------->
  682. <p>
  683. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  684. </p>
  685.  
  686. <ul class="pl-2 pr-1 m-0" style="list-style:none">
  687. <!--------------- Heart Love List START -------------->
  688. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  689. Content
  690. <hr class="col my-auto mx-2">
  691. <!--- 3 Stars --->
  692. <span class="pull-right">
  693. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  694. </span>
  695. </li><!-- Paste the Indented Bulletin Code after here-->
  696. <!--- Indented Bulletin -----
  697. copy and paste these 3 lines of code for another indented bulletin
  698. ------------------------------->
  699. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  700. Extra Info
  701. </li></ul>
  702. <!-------------------------------->
  703. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  704. Content
  705. <hr class="col my-auto mx-2">
  706. <!-------- 2 Stars --------->
  707. <span class="pull-right">
  708. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  709. </span>
  710. </li><!-- Paste the Indented Bulletin Code after here-->
  711. <!-------------------------------->
  712. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  713. Content
  714. <hr class="col my-auto mx-2">
  715. <!-------- 1 Star --------->
  716. <span class="pull-right">
  717. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  718. </span>
  719. </li><!-- Paste the Indented Bulletin Code after here-->
  720. <!-------------------------------->
  721. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  722. Content
  723. <hr class="col my-auto mx-2">
  724. <!-------- 0 Star --------->
  725. <span class="pull-right">
  726. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  727. </span>
  728. </li><!-- Paste the Indented Bulletin Code after here-->
  729. <!-------------------------------->
  730. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  731. Content
  732. </li><!-- Paste the Indented Bulletin Code after here-->
  733. <!-------------------------------->
  734.  
  735. <!----Copy and paste above here for more Heart Love lines----->
  736. <!-------------- Green Like List START ------------->
  737. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  738. Content
  739. <hr class="col my-auto mx-2">
  740. <!-------- 3 Star --------->
  741. <span class="pull-right">
  742. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  743. </span>
  744. </li><!-- Paste the Indented Bulletin Code after here-->
  745. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  746. Extra Info
  747. </li></ul>
  748. <!-------------------------------->
  749. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  750. Content
  751. <hr class="col my-auto mx-2">
  752. <!-------- 2 Star --------->
  753. <span class="pull-right">
  754. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  755. </span>
  756. </li><!-- Paste the Indented Bulletin Code after here-->
  757. <!-------------------------------->
  758. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  759. Content
  760. <hr class="col my-auto mx-2">
  761. <!-------- 1 Star --------->
  762. <span class="pull-right">
  763. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  764. </span>
  765. </li><!-- Paste the Indented Bulletin Code after here-->
  766. <!-------------------------------->
  767. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  768. Content
  769. <hr class="col my-auto mx-2">
  770. <!-------- 0 Star --------->
  771. <span class="pull-right">
  772. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  773. </span>
  774. </li><!-- Paste the Indented Bulletin Code after here-->
  775. <!-------------------------------->
  776. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  777. Content
  778. </li><!-- Paste the Indented Bulletin Code after here-->
  779. <!-------------------------------->
  780.  
  781.  
  782. <!----Copy and paste above here for more Green Like Lines----->
  783. <!------------ ? Uncertain List START ----------->
  784. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  785. Content
  786. </li><!-- Paste the Indented Bulletin Code after here-->
  787. <!-------------------------------->
  788. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  789. Content
  790. </li><!-- Paste the Indented Bulletin Code after here-->
  791. <!-------------------------------->
  792. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  793. Content
  794. </li><!-- Paste the Indented Bulletin Code after here-->
  795. <!-------------------------------->
  796.  
  797.  
  798. <!----Copy and paste above here for more ? Uncertain Lines ----->
  799. <!---------- X Dislike List START -------->
  800. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  801. Content
  802. </li><!-- Paste the Indented Bulletin Code after here-->
  803. <!-------------------------------->
  804. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  805. Content
  806. </li><!-- Paste the Indented Bulletin Code after here-->
  807. <!-------------------------------->
  808.  
  809.  
  810. <!----Copy and paste above here for more X Dislike Lines ----->
  811. </ul>
  812. </div></div>
  813.  
  814. <!---========================================
  815.  
  816. COLOR PALETTE
  817.  
  818. ============================================-->
  819. <div class="col-12 col-md-6 col-lg-3 p-2"><div class="card card-body p-2 m-0 h-100">
  820. <h4 class="text-center" style="letter-spacing:1.5px"><i class="far fa-palette pull-right"></i>
  821. Color Palette
  822. </h4>
  823. <hr class="m-0 mb-2">
  824. <!------- Text --------->
  825. <p>
  826. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  827. </p>
  828.  
  829. <ul class="pl-2 pr-1 m-0" style="list-style:none">
  830. <!--------------- Heart Love List START -------------->
  831. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  832. Content
  833. <hr class="col my-auto mx-2">
  834. <!--- 3 Stars --->
  835. <span class="pull-right">
  836. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  837. </span>
  838. </li><!-- Paste the Indented Bulletin Code after here-->
  839. <!--- Indented Bulletin -----
  840. copy and paste these 3 lines of code for another indented bulletin
  841. ------------------------------->
  842. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  843. Extra Info
  844. </li></ul>
  845. <!-------------------------------->
  846. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  847. Content
  848. <hr class="col my-auto mx-2">
  849. <!-------- 2 Stars --------->
  850. <span class="pull-right">
  851. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  852. </span>
  853. </li><!-- Paste the Indented Bulletin Code after here-->
  854. <!-------------------------------->
  855. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  856. Content
  857. <hr class="col my-auto mx-2">
  858. <!-------- 1 Star --------->
  859. <span class="pull-right">
  860. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  861. </span>
  862. </li><!-- Paste the Indented Bulletin Code after here-->
  863. <!-------------------------------->
  864. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  865. Content
  866. <hr class="col my-auto mx-2">
  867. <!-------- 0 Star --------->
  868. <span class="pull-right">
  869. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  870. </span>
  871. </li><!-- Paste the Indented Bulletin Code after here-->
  872. <!-------------------------------->
  873. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  874. Content
  875. </li><!-- Paste the Indented Bulletin Code after here-->
  876. <!-------------------------------->
  877.  
  878. <!----Copy and paste above here for more Heart Love lines----->
  879. <!-------------- Green Like List START ------------->
  880. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  881. Content
  882. <hr class="col my-auto mx-2">
  883. <!-------- 3 Star --------->
  884. <span class="pull-right">
  885. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  886. </span>
  887. </li><!-- Paste the Indented Bulletin Code after here-->
  888. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  889. Extra Info
  890. </li></ul>
  891. <!-------------------------------->
  892. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  893. Content
  894. <hr class="col my-auto mx-2">
  895. <!-------- 2 Star --------->
  896. <span class="pull-right">
  897. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  898. </span>
  899. </li><!-- Paste the Indented Bulletin Code after here-->
  900. <!-------------------------------->
  901. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  902. Content
  903. <hr class="col my-auto mx-2">
  904. <!-------- 1 Star --------->
  905. <span class="pull-right">
  906. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  907. </span>
  908. </li><!-- Paste the Indented Bulletin Code after here-->
  909. <!-------------------------------->
  910. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  911. Content
  912. <hr class="col my-auto mx-2">
  913. <!-------- 0 Star --------->
  914. <span class="pull-right">
  915. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  916. </span>
  917. </li><!-- Paste the Indented Bulletin Code after here-->
  918. <!-------------------------------->
  919. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  920. Content
  921. </li><!-- Paste the Indented Bulletin Code after here-->
  922. <!-------------------------------->
  923.  
  924.  
  925. <!----Copy and paste above here for more Green Like Lines----->
  926. <!------------ ? Uncertain List START ----------->
  927. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  928. Content
  929. </li><!-- Paste the Indented Bulletin Code after here-->
  930. <!-------------------------------->
  931. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  932. Content
  933. </li><!-- Paste the Indented Bulletin Code after here-->
  934. <!-------------------------------->
  935. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  936. Content
  937. </li><!-- Paste the Indented Bulletin Code after here-->
  938. <!-------------------------------->
  939.  
  940.  
  941. <!----Copy and paste above here for more ? Uncertain Lines ----->
  942. <!---------- X Dislike List START -------->
  943. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  944. Content
  945. </li><!-- Paste the Indented Bulletin Code after here-->
  946. <!-------------------------------->
  947. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  948. Content
  949. </li><!-- Paste the Indented Bulletin Code after here-->
  950. <!-------------------------------->
  951. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  952. Content
  953. </li><!-- Paste the Indented Bulletin Code after here-->
  954.  
  955.  
  956. <!----Copy and paste above here for more X Dislike Lines ----->
  957. </ul>
  958. </div></div>
  959.  
  960. <!---========================================
  961.  
  962. Aesthetics
  963.  
  964. ============================================-->
  965. <div class="col-12 col-md-6 col-lg-3 p-2"><div class="card card-body p-2 m-0 h-100">
  966. <h4 class="text-center" style="letter-spacing:1.5px"><i class="far fa-camera pull-right"></i>
  967. Aesthetics
  968. </h4>
  969. <hr class="m-0 mb-2">
  970. <!------- Text --------->
  971. <p>
  972. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  973. </p>
  974.  
  975. <ul class="pl-2 pr-1 m-0" style="list-style:none">
  976. <!--------------- Heart Love List START -------------->
  977. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  978. Content
  979. <hr class="col my-auto mx-2">
  980. <!--- 3 Stars --->
  981. <span class="pull-right">
  982. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  983. </span>
  984. </li><!-- Paste the Indented Bulletin Code after here-->
  985. <!--- Indented Bulletin -----
  986. copy and paste these 3 lines of code for another indented bulletin
  987. ------------------------------->
  988. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  989. Extra Info
  990. </li></ul>
  991. <!-------------------------------->
  992. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  993. Content
  994. <hr class="col my-auto mx-2">
  995. <!-------- 2 Stars --------->
  996. <span class="pull-right">
  997. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  998. </span>
  999. </li><!-- Paste the Indented Bulletin Code after here-->
  1000. <!-------------------------------->
  1001. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1002. Content
  1003. <hr class="col my-auto mx-2">
  1004. <!-------- 1 Star --------->
  1005. <span class="pull-right">
  1006. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1007. </span>
  1008. </li><!-- Paste the Indented Bulletin Code after here-->
  1009. <!-------------------------------->
  1010. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1011. Content
  1012. <hr class="col my-auto mx-2">
  1013. <!-------- 0 Star --------->
  1014. <span class="pull-right">
  1015. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1016. </span>
  1017. </li><!-- Paste the Indented Bulletin Code after here-->
  1018. <!-------------------------------->
  1019. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1020. Content
  1021. </li><!-- Paste the Indented Bulletin Code after here-->
  1022. <!-------------------------------->
  1023.  
  1024.  
  1025. <!----Copy and paste above here for more Heart Love lines----->
  1026. <!-------------- Green Like List START ------------->
  1027. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1028. Content
  1029. <hr class="col my-auto mx-2">
  1030. <!-------- 3 Star --------->
  1031. <span class="pull-right">
  1032. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  1033. </span>
  1034. </li><!-- Paste the Indented Bulletin Code after here-->
  1035. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  1036. Extra Info
  1037. </li></ul>
  1038. <!-------------------------------->
  1039. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1040. Content
  1041. <hr class="col my-auto mx-2">
  1042. <!-------- 2 Star --------->
  1043. <span class="pull-right">
  1044. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1045. </span>
  1046. </li><!-- Paste the Indented Bulletin Code after here-->
  1047. <!-------------------------------->
  1048. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1049. Content
  1050. <hr class="col my-auto mx-2">
  1051. <!-------- 1 Star --------->
  1052. <span class="pull-right">
  1053. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1054. </span>
  1055. </li><!-- Paste the Indented Bulletin Code after here-->
  1056. <!-------------------------------->
  1057. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1058. Content
  1059. <hr class="col my-auto mx-2">
  1060. <!-------- 0 Star --------->
  1061. <span class="pull-right">
  1062. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1063. </span>
  1064. </li><!-- Paste the Indented Bulletin Code after here-->
  1065. <!-------------------------------->
  1066. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1067. Content
  1068. </li><!-- Paste the Indented Bulletin Code after here-->
  1069. <!-------------------------------->
  1070.  
  1071.  
  1072. <!----Copy and paste above here for more Green Like Lines----->
  1073. <!------------ ? Uncertain List START ----------->
  1074. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  1075. Content
  1076. </li><!-- Paste the Indented Bulletin Code after here-->
  1077. <!-------------------------------->
  1078. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  1079. Content
  1080. </li><!-- Paste the Indented Bulletin Code after here-->
  1081. <!-------------------------------->
  1082. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  1083. Content
  1084. </li><!-- Paste the Indented Bulletin Code after here-->
  1085. <!-------------------------------->
  1086.  
  1087.  
  1088. <!----Copy and paste above here for more ? Uncertain Lines ----->
  1089. <!---------- X Dislike List START -------->
  1090. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  1091. Content
  1092. </li><!-- Paste the Indented Bulletin Code after here-->
  1093. <!-------------------------------->
  1094. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  1095. Content
  1096. </li><!-- Paste the Indented Bulletin Code after here-->
  1097. <!-------------------------------->
  1098. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  1099. Content
  1100. </li><!-- Paste the Indented Bulletin Code after here-->
  1101.  
  1102.  
  1103. <!----Copy and paste above here for more X Dislike Lines ----->
  1104. </ul>
  1105. </div></div>
  1106.  
  1107. <!---========================================
  1108.  
  1109. Other
  1110.  
  1111. ============================================-->
  1112. <div class="col-12 col-md-6 col-lg-3 p-2"><div class="card card-body p-2 m-0 h-100">
  1113. <h4 class="text-center" style="letter-spacing:1.5px"><i class="far fa-handshake pull-right"></i>
  1114. Other
  1115. </h4>
  1116. <hr class="m-0 mb-2">
  1117. <!------- Text --------->
  1118. <p>
  1119. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  1120. </p>
  1121.  
  1122. <ul class="pl-2 pr-1 m-0" style="list-style:none">
  1123. <!--------------- Heart Love List START -------------->
  1124. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1125. Content
  1126. <hr class="col my-auto mx-2">
  1127. <!--- 3 Stars --->
  1128. <span class="pull-right">
  1129. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  1130. </span>
  1131. </li><!-- Paste the Indented Bulletin Code after here-->
  1132. <!--- Indented Bulletin -----
  1133. copy and paste these 3 lines of code for another indented bulletin
  1134. ------------------------------->
  1135. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  1136. Extra Info
  1137. </li></ul>
  1138. <!-------------------------------->
  1139. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1140. Content
  1141. <hr class="col my-auto mx-2">
  1142. <!-------- 2 Stars --------->
  1143. <span class="pull-right">
  1144. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1145. </span>
  1146. </li><!-- Paste the Indented Bulletin Code after here-->
  1147. <!-------------------------------->
  1148. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1149. Content
  1150. <hr class="col my-auto mx-2">
  1151. <!-------- 1 Star --------->
  1152. <span class="pull-right">
  1153. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1154. </span>
  1155. </li><!-- Paste the Indented Bulletin Code after here-->
  1156. <!-------------------------------->
  1157. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1158. Content
  1159. <hr class="col my-auto mx-2">
  1160. <!-------- 0 Star --------->
  1161. <span class="pull-right">
  1162. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1163. </span>
  1164. </li><!-- Paste the Indented Bulletin Code after here-->
  1165. <!-------------------------------->
  1166. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1167. Content
  1168. </li><!-- Paste the Indented Bulletin Code after here-->
  1169. <!-------------------------------->
  1170.  
  1171.  
  1172. <!----Copy and paste above here for more Heart Love lines----->
  1173. <!-------------- Green Like List START ------------->
  1174. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1175. Content
  1176. <hr class="col my-auto mx-2">
  1177. <!-------- 3 Star --------->
  1178. <span class="pull-right">
  1179. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  1180. </span>
  1181. </li><!-- Paste the Indented Bulletin Code after here-->
  1182. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  1183. Extra Info
  1184. </li></ul>
  1185. <!-------------------------------->
  1186. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1187. Content
  1188. <hr class="col my-auto mx-2">
  1189. <!-------- 2 Star --------->
  1190. <span class="pull-right">
  1191. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1192. </span>
  1193. </li><!-- Paste the Indented Bulletin Code after here-->
  1194. <!-------------------------------->
  1195. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1196. Content
  1197. <hr class="col my-auto mx-2">
  1198. <!-------- 1 Star --------->
  1199. <span class="pull-right">
  1200. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1201. </span>
  1202. </li><!-- Paste the Indented Bulletin Code after here-->
  1203. <!-------------------------------->
  1204. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1205. Content
  1206. <hr class="col my-auto mx-2">
  1207. <!-------- 0 Star --------->
  1208. <span class="pull-right">
  1209. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1210. </span>
  1211. </li><!-- Paste the Indented Bulletin Code after here-->
  1212. <!-------------------------------->
  1213. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1214. Content
  1215. </li><!-- Paste the Indented Bulletin Code after here-->
  1216. <!-------------------------------->
  1217.  
  1218.  
  1219. <!----Copy and paste above here for more Green Like Lines----->
  1220. <!------------ ? Uncertain List START ----------->
  1221. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  1222. Content
  1223. </li><!-- Paste the Indented Bulletin Code after here-->
  1224. <!-------------------------------->
  1225. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  1226. Content
  1227. </li><!-- Paste the Indented Bulletin Code after here-->
  1228. <!-------------------------------->
  1229. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  1230. Content
  1231. </li><!-- Paste the Indented Bulletin Code after here-->
  1232. <!-------------------------------->
  1233.  
  1234.  
  1235. <!----Copy and paste above here for more ? Uncertain Lines ----->
  1236. <!---------- X Dislike List START -------->
  1237. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  1238. Content
  1239. </li><!-- Paste the Indented Bulletin Code after here-->
  1240. <!-------------------------------->
  1241. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  1242. Content
  1243. </li><!-- Paste the Indented Bulletin Code after here-->
  1244. <!-------------------------------->
  1245. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  1246. Content
  1247. </li><!-- Paste the Indented Bulletin Code after here-->
  1248.  
  1249.  
  1250. <!----Copy and paste above here for more X Dislike Lines ----->
  1251. </ul>
  1252. </div></div>
  1253.  
  1254. <!---========================================
  1255.  
  1256. Art
  1257.  
  1258. ============================================-->
  1259. <div class="col-12 col-md-6 col-lg-3 p-2"><div class="card card-body p-2 m-0 h-100">
  1260. <h4 class="text-center" style="letter-spacing:1.5px"><i class="far fa-paintbrush pull-right"></i>
  1261. Art
  1262. </h4>
  1263. <hr class="m-0 mb-2">
  1264. <!------- Text --------->
  1265. <p>
  1266. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  1267. </p>
  1268.  
  1269. <ul class="pl-2 pr-1 m-0" style="list-style:none">
  1270. <!--------------- Heart Love List START -------------->
  1271. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1272. Content
  1273. <hr class="col my-auto mx-2">
  1274. <!--- 3 Stars --->
  1275. <span class="pull-right">
  1276. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  1277. </span>
  1278. </li><!-- Paste the Indented Bulletin Code after here-->
  1279. <!--- Indented Bulletin -----
  1280. copy and paste these 3 lines of code for another indented bulletin
  1281. ------------------------------->
  1282. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  1283. Extra Info
  1284. </li></ul>
  1285. <!-------------------------------->
  1286. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1287. Content
  1288. <hr class="col my-auto mx-2">
  1289. <!-------- 2 Stars --------->
  1290. <span class="pull-right">
  1291. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1292. </span>
  1293. </li><!-- Paste the Indented Bulletin Code after here-->
  1294. <!-------------------------------->
  1295. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1296. Content
  1297. <hr class="col my-auto mx-2">
  1298. <!-------- 1 Star --------->
  1299. <span class="pull-right">
  1300. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1301. </span>
  1302. </li><!-- Paste the Indented Bulletin Code after here-->
  1303. <!-------------------------------->
  1304. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1305. Content
  1306. <hr class="col my-auto mx-2">
  1307. <!-------- 0 Star --------->
  1308. <span class="pull-right">
  1309. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1310. </span>
  1311. </li><!-- Paste the Indented Bulletin Code after here-->
  1312. <!-------------------------------->
  1313. <li class="text-primary row no-gutters"><i class="far fa-heart pt-1 pr-1"></i>
  1314. Content
  1315. </li><!-- Paste the Indented Bulletin Code after here-->
  1316. <!-------------------------------->
  1317.  
  1318.  
  1319. <!----Copy and paste above here for more Heart Love lines----->
  1320. <!-------------- Green Like List START ------------->
  1321. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1322. Content
  1323. <hr class="col my-auto mx-2">
  1324. <!-------- 3 Star --------->
  1325. <span class="pull-right">
  1326. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i>
  1327. </span>
  1328. </li><!-- Paste the Indented Bulletin Code after here-->
  1329. <ul class="col-12 pl-4 ml-3 text-muted"><li>
  1330. Extra Info
  1331. </li></ul>
  1332. <!-------------------------------->
  1333. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1334. Content
  1335. <hr class="col my-auto mx-2">
  1336. <!-------- 2 Star --------->
  1337. <span class="pull-right">
  1338. <i class="fas fa-star fa-sm mr-1"></i><i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1339. </span>
  1340. </li><!-- Paste the Indented Bulletin Code after here-->
  1341. <!-------------------------------->
  1342. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1343. Content
  1344. <hr class="col my-auto mx-2">
  1345. <!-------- 1 Star --------->
  1346. <span class="pull-right">
  1347. <i class="fas fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1348. </span>
  1349. </li><!-- Paste the Indented Bulletin Code after here-->
  1350. <!-------------------------------->
  1351. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1352. Content
  1353. <hr class="col my-auto mx-2">
  1354. <!-------- 0 Star --------->
  1355. <span class="pull-right">
  1356. <i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i><i class="far fa-star fa-sm mr-1"></i>
  1357. </span>
  1358. </li><!-- Paste the Indented Bulletin Code after here-->
  1359. <!-------------------------------->
  1360. <li class="text-success row no-gutters"><i class="far fa-check pt-1 pr-1"></i>
  1361. Content
  1362. </li><!-- Paste the Indented Bulletin Code after here-->
  1363. <!-------------------------------->
  1364.  
  1365.  
  1366. <!----Copy and paste above here for more Green Like Lines----->
  1367. <!------------ ? Uncertain List START ----------->
  1368. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  1369. Content
  1370. </li><!-- Paste the Indented Bulletin Code after here-->
  1371. <!-------------------------------->
  1372. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  1373. Content
  1374. </li><!-- Paste the Indented Bulletin Code after here-->
  1375. <!-------------------------------->
  1376. <li class="text-warning row no-gutters"><i class="far fa-question pt-1 pr-1"></i>
  1377. Content
  1378. </li><!-- Paste the Indented Bulletin Code after here-->
  1379. <!-------------------------------->
  1380.  
  1381.  
  1382. <!----Copy and paste above here for more ? Uncertain Lines ----->
  1383. <!---------- X Dislike List START -------->
  1384. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  1385. Content
  1386. </li><!-- Paste the Indented Bulletin Code after here-->
  1387. <!-------------------------------->
  1388. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  1389. Content
  1390. </li><!-- Paste the Indented Bulletin Code after here-->
  1391. <!-------------------------------->
  1392. <li class="text-danger row no-gutters"><i class="far fa-xmark pt-1 pr-1"></i>
  1393. Content
  1394. </li><!-- Paste the Indented Bulletin Code after here-->
  1395.  
  1396.  
  1397. <!----Copy and paste above here for more X Dislike Lines ----->
  1398. </ul>
  1399. </div></div>
  1400.  
  1401.  
  1402. </div>
  1403. </div>
  1404.  
  1405. <!-------------- CREDIT DO NOT REMOVE --------------->
  1406. <p class="col-12 text-right mx-auto" style="max-width:1600px;">
  1407. HTML by @LeafJelly
  1408. </p>
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!