API tools faq
paste
Advertisement
ElithianFox

Tag Directory HTML

ElithianFox
Jan 1st, 2021
3,545
1
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.05 KB | None | 1 0
raw download clone embed print report
  1. <!----------------
  2.  
  3. ***TAG DIRECTORY***
  4.  
  5. Code by https://toyhou.se/Elithian
  6. Please read my TOS before using: https://toyhou.se/~bulletins/96449.rules-tos
  7.  
  8. A list for your most used tags, especially when you regularly use your tags to sort characters.
  9.  
  10.  
  11.  
  12. ***TIP: EXTAGS***
  13. Don't just work with tags, but work with extags. For example: the link https://toyhou.se/ElithianFox/characters/extagged:old%20layout will lead to all characters that do not have the #old layout tag. This can be useful if you wanna exclude only one single tag and allows you to use less tags to say the same.
  14.  
  15.  
  16.  
  17. ***SUGGESTED TAG CATEGORIES***
  18. A couple of suggestions for tags to use if you like sorting OCs by tags. You can add a new category for every one of these. Feel free to use whichever tag system - these are nothing but suggestions!
  19.  
  20. BODY SHAPE: humanoid ✦ anthro ✦ feral
  21.  
  22. HUMANOID SPECIES, ANTHRO SPECIES and FERAL SPECIES
  23. or SPECIES if you don't have many different species
  24.  
  25. GENDER: male ✦ female ✦ other
  26.  
  27. SEXUALITY: straight ✦ bi ✦ gay ✦ ace ✦ no sexuality ✦ undetermined
  28.  
  29. AGE (GROUP): baby ✦ toddler ✦ child ✦ teen ✦ adolescent ✦ young adult ✦ adult ✦ elder ✦ ancient ✦ immortal
  30.  
  31. FACTION, GROUP, or CLIQUE
  32.  
  33. FANDOM
  34.  
  35. CLASS/JOB
  36.  
  37. STORY (if they belong to a named story)
  38.  
  39. SHIP STATUS: single ✦ taken ✦ AU only ✦ no shipping
  40.  
  41. LIFE STATUS: alive ✦ dead/deceased ✦ afterlife ✦ revived
  42.  
  43. STORY IMPORTANCE: main character ✦ side character ✦ background character
  44. OR: primary ✦ secondary ✦ tertiary ✦ etc.
  45.  
  46. PROFILE COMPLETION: complete ✦ incomplete
  47.  
  48. PROFILE DETAIL: empty profile ✦ basic profile ✦ average profile ✦ detailed profile
  49.  
  50. FAVOURITISM: fav character ✦ fav design ✦ persona ✦ art wanted
  51.  
  52. COMMERCE: nft ✦ uft ✦ for sale
  53.  
  54. TIME PERIOD: past/medieval ✦ modern ✦ futuristic/scifi
  55.  
  56. GENRE: fantasy ✦ slice of life ✦ horror ✦ noir ✦ rpg ✦ etc.
  57.  
  58. WARNINGS: nsfw ✦ gore ✦ etc.
  59.  
  60. DESIGNER: me ✦ someone else
  61.  
  62.  
  63.  
  64. Feel free to remove this section if you don't need this info.
  65. ---------------->
  66. <div class="p-1 mx-auto m-2" style="max-width:900px">
  67.  
  68. <div class="p-3 bg-faded text-center mb-2" style="border-radius:15px">
  69. <div style="font-size:2rem;font-weight:200;letter-spacing:1px">Username's Tag Directory</div>
  70. <hr style="width:75%">
  71. <div class="mx-auto" style="max-width:600px">This is a description of your tags. You can explain what you use them for (navigation, sales, etc.).</div>
  72. <hr style="width:25%">
  73. <div class="mx-auto" style="max-width:600px;font-weight:100;letter-spacing:1px;font-size:0.85rem">Other links: <a href="">link</a> • <a href="">link</a> • <a href="">link</a></div>
  74. </div>
  75.  
  76.  
  77. <div class="bg-faded p-2 mx-auto mb-2 text-center" style="max-width:700px;font-size:2rem;font-weight:200;letter-spacing:2px">
  78. <hr class="m-1 mx-auto" style="width:55%">
  79. Main tags
  80. <hr class="m-1 mx-auto" style="width:55%">
  81. </div>
  82.  
  83.  
  84. <div class="bg-faded p-md-4 p-2 mx-auto mb-2" style="max-width:700px">
  85.  
  86. <!---- General body build ---->
  87. <div class="row no-gutters mb-3">
  88. <div class="col-auto"><i class="fal fa-male fa-2x px-1 text-secondary"></i></div>
  89. <div class="col mb-2"><hr style="width:90%"></div>
  90. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Body shape</div>
  91. <div class="col mb-2"><hr style="width:90%"></div>
  92. <div class="col-auto"><i class="fal fa-horse fa-2x px-1 text-secondary"></i></div>
  93. <div class="col-md-12 row no-gutters mb-3">
  94. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Humanoid</a></div>
  95. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Anthro</a></div>
  96. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Feral</a></div>
  97. </div>
  98. </div>
  99.  
  100. <!---- Humanoid species ---->
  101. <div class="row no-gutters mb-3">
  102. <div class="col-auto"><i class="fal fa-user-cowboy fa-2x px-1 text-secondary"></i></div>
  103. <div class="col mb-2"><hr style="width:90%"></div>
  104. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Humanoid species</div>
  105. <div class="col mb-2"><hr style="width:90%"></div>
  106. <div class="col-auto"><i class="fal fa-angel fa-2x px-1 text-secondary"></i></div>
  107. <div class="col-md-12 row no-gutters mb-3">
  108. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  109. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  110. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  111. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  112. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  113. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  114. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  115. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  116. </div>
  117. </div>
  118.  
  119. <!---- Anthro species ---->
  120. <div class="row no-gutters mb-3">
  121. <div class="col-auto"><i class="fal fa-dragon fa-2x px-1 text-secondary"></i></div>
  122. <div class="col mb-2"><hr style="width:90%"></div>
  123. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Anthro species</div>
  124. <div class="col mb-2"><hr style="width:90%"></div>
  125. <div class="col-auto"><i class="fal fa-paw-claws fa-2x px-1 text-secondary"></i></div>
  126. <div class="col-md-12 row no-gutters mb-3">
  127. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  128. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  129. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  130. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  131. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  132. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  133. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  134. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  135. </div>
  136. </div>
  137.  
  138. <!---- Feral species ---->
  139. <div class="row no-gutters mb-3">
  140. <div class="col-auto"><i class="fal fa-feather-alt fa-2x px-1 text-secondary"></i></div>
  141. <div class="col mb-2"><hr style="width:90%"></div>
  142. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Feral species</div>
  143. <div class="col mb-2"><hr style="width:90%"></div>
  144. <div class="col-auto"><i class="fal fa-ram fa-2x px-1 text-secondary"></i></div>
  145. <div class="col-md-12 row no-gutters mb-3">
  146. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  147. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  148. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  149. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  150. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  151. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  152. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  153. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  154. </div>
  155. </div>
  156.  
  157. <!---- Gender ---->
  158. <div class="row no-gutters mb-3">
  159. <div class="col-auto"><i class="fal fa-mars fa-2x px-1 text-secondary"></i></div>
  160. <div class="col mb-2"><hr style="width:90%"></div>
  161. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Gender</div>
  162. <div class="col mb-2"><hr style="width:90%"></div>
  163. <div class="col-auto"><i class="fal fa-venus fa-2x px-1 text-secondary"></i></div>
  164. <div class="col-md-12 row no-gutters mb-3">
  165. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Male</a></div>
  166. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Female</a></div>
  167. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Other</a></div>
  168. </div>
  169. </div>
  170.  
  171. <!---- Sexuality ---->
  172. <div class="row no-gutters mb-3">
  173. <div class="col-auto"><i class="fal fa-heart-circle fa-2x px-1 text-secondary"></i></div>
  174. <div class="col mb-2"><hr style="width:90%"></div>
  175. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Sexuality</div>
  176. <div class="col mb-2"><hr style="width:90%"></div>
  177. <div class="col-auto"><i class="fal fa-hands-helping fa-2x px-1 text-secondary"></i></div>
  178. <div class="col-md-12 row no-gutters mb-3">
  179. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Heterosexual</a></div>
  180. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Bisexual</a></div>
  181. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Homosexual</a></div>
  182. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Asexual</a></div>
  183. <div class="col-12 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">No sexuality</a></div>
  184. </div>
  185. </div>
  186.  
  187. <!---- Age ---->
  188. <div class="row no-gutters mb-3">
  189. <div class="col-auto"><i class="fal fa-hourglass fa-2x px-1 text-secondary"></i></div>
  190. <div class="col mb-2"><hr style="width:90%"></div>
  191. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Age</div>
  192. <div class="col mb-2"><hr style="width:90%"></div>
  193. <div class="col-auto"><i class="fal fa-baby-carriage fa-2x px-1 text-secondary"></i></div>
  194. <div class="col-md-12 row no-gutters mb-3">
  195. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Baby (0-2)</a></div>
  196. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Toddler (3-5)</a></div>
  197. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Child (6-12)</a></div>
  198. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Adolescent (13-19)</a></div>
  199. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Young adult (20-24)</a></div>
  200. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Adult (25-54)</a></div>
  201. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Elder (55+)</a></div>
  202. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Ancient</a></div>
  203. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">No age</a></div>
  204. <div class="col-md-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Underage</a></div>
  205. <div class="col-md-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">18 or older</a></div>
  206. </div>
  207. </div>
  208.  
  209. <!---- Faction ---->
  210. <div class="row no-gutters mb-3">
  211. <div class="col-auto"><i class="fal fa-university fa-2x px-1 text-secondary"></i></div>
  212. <div class="col mb-2"><hr style="width:90%"></div>
  213. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Faction/Group</div>
  214. <div class="col mb-2"><hr style="width:90%"></div>
  215. <div class="col-auto"><i class="fal fa-chart-network fa-2x px-1 text-secondary"></i></div>
  216. <div class="col-md-12 row no-gutters mb-3">
  217. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  218. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  219. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  220. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  221. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  222. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  223. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  224. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">tag</a></div>
  225. </div>
  226. </div>
  227.  
  228. <!---- Status ---->
  229. <div class="row no-gutters mb-3">
  230. <div class="col-auto"><i class="fal fa-ankh fa-2x px-1 text-secondary"></i></div>
  231. <div class="col mb-2"><hr style="width:90%"></div>
  232. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Status</div>
  233. <div class="col mb-2"><hr style="width:90%"></div>
  234. <div class="col-auto"><i class="fal fa-tombstone fa-2x px-1 text-secondary"></i></div>
  235. <div class="col-md-12 row no-gutters mb-3">
  236. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Alive</a></div>
  237. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Deceased</a></div>
  238. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Afterlife</a></div>
  239. </div>
  240. </div>
  241.  
  242. <!---- Story importance ---->
  243. <div class="row no-gutters mb-3">
  244. <div class="col-auto"><i class="fal fa-street-view fa-2x px-1 text-secondary"></i></div>
  245. <div class="col mb-2"><hr style="width:90%"></div>
  246. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Story importance</div>
  247. <div class="col mb-2"><hr style="width:90%"></div>
  248. <div class="col-auto"><i class="fal fa-child fa-2x px-1 text-secondary"></i></div>
  249. <div class="col-md-12 row no-gutters mb-3">
  250. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Major character</a></div>
  251. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Side character</a></div>
  252. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Background character</a></div>
  253. </div>
  254. </div>
  255.  
  256. <!---- Favouritism ---->
  257. <div class="row no-gutters mb-3">
  258. <div class="col-auto"><i class="fal fa-star fa-2x px-1 text-secondary"></i></div>
  259. <div class="col mb-2"><hr style="width:90%"></div>
  260. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Favouritism</div>
  261. <div class="col mb-2"><hr style="width:90%"></div>
  262. <div class="col-auto"><i class="fal fa-heart fa-2x px-1 text-secondary"></i></div>
  263. <div class="col-md-12 row no-gutters mb-3">
  264. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Favourite character</a></div>
  265. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Favourite design</a></div>
  266. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Persona</a></div>
  267. <div class="col-12 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Art wanted</a></div>
  268. </div>
  269. </div>
  270.  
  271. <!---- Profile completion ---->
  272. <div class="row no-gutters mb-3">
  273. <div class="col-auto"><i class="fal fa-file fa-2x px-1 text-secondary"></i></div>
  274. <div class="col mb-2"><hr style="width:90%"></div>
  275. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Completion</div>
  276. <div class="col mb-2"><hr style="width:90%"></div>
  277. <div class="col-auto"><i class="fal fa-comment-edit fa-2x px-1 text-secondary"></i></div>
  278. <div class="col-md-12 row no-gutters mb-3">
  279. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Complete</a></div>
  280. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Incomplete</a></div>
  281. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Needs revision</a></div>
  282. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Rewrite</a></div>
  283. </div>
  284. </div>
  285.  
  286. <!---- Profile detail ---->
  287. <div class="row no-gutters mb-3">
  288. <div class="col-auto"><i class="fal fa-edit fa-2x px-1 text-secondary"></i></div>
  289. <div class="col mb-2"><hr style="width:90%"></div>
  290. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Profile detail</div>
  291. <div class="col mb-2"><hr style="width:90%"></div>
  292. <div class="col-auto"><i class="fal fa-user-circle fa-2x px-1 text-secondary"></i></div>
  293. <div class="col-md-12 row no-gutters mb-3">
  294. <div class="col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Detailed profile</a></div>
  295. <div class="col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Average profile</a></div>
  296. <div class="col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Basic profile</a></div>
  297. <div class="col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Empty profile</a></div>
  298. </div>
  299. </div>
  300.  
  301. <!---- Time period ---->
  302. <div class="row no-gutters mb-3">
  303. <div class="col-auto"><i class="fal fa-swords fa-2x px-1 text-secondary"></i></div>
  304. <div class="col mb-2"><hr style="width:90%"></div>
  305. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Time period</div>
  306. <div class="col mb-2"><hr style="width:90%"></div>
  307. <div class="col-auto"><i class="fal fa-car-building fa-2x px-1 text-secondary"></i></div>
  308. <div class="col-md-12 row no-gutters mb-3">
  309. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Medieval</a></div>
  310. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Modern</a></div>
  311. <div class="col-md-4 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Scifi</a></div>
  312. </div>
  313. </div>
  314.  
  315. <!---- Category with 2 tags per row ---->
  316. <div class="row no-gutters mb-3">
  317. <div class="col-auto"><i class="fal fa-hashtag fa-2x px-1 text-secondary"></i></div>
  318. <div class="col mb-2"><hr style="width:90%"></div>
  319. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Category</div>
  320. <div class="col mb-2"><hr style="width:90%"></div>
  321. <div class="col-auto"><i class="fal fa-tag fa-2x px-1 text-secondary"></i></div>
  322. <div class="col-md-12 row no-gutters mb-3">
  323. <div class="col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  324. <div class="col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  325. </div>
  326. </div>
  327.  
  328. <!---- Category with 3 tags per row ---->
  329. <div class="row no-gutters mb-3">
  330. <div class="col-auto"><i class="fal fa-hashtag fa-2x px-1 text-secondary"></i></div>
  331. <div class="col mb-2"><hr style="width:90%"></div>
  332. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Category</div>
  333. <div class="col mb-2"><hr style="width:90%"></div>
  334. <div class="col-auto"><i class="fal fa-tag fa-2x px-1 text-secondary"></i></div>
  335. <div class="col-md-12 row no-gutters mb-3">
  336. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  337. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  338. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  339. </div>
  340. </div>
  341.  
  342. <!---- Category with 4 tags per row ---->
  343. <div class="row no-gutters mb-3">
  344. <div class="col-auto"><i class="fal fa-hashtag fa-2x px-1 text-secondary"></i></div>
  345. <div class="col mb-2"><hr style="width:90%"></div>
  346. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Category</div>
  347. <div class="col mb-2"><hr style="width:90%"></div>
  348. <div class="col-auto"><i class="fal fa-tag fa-2x px-1 text-secondary"></i></div>
  349. <div class="col-md-12 row no-gutters mb-3">
  350. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  351. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  352. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  353. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  354. </div>
  355. </div>
  356.  
  357. </div>
  358.  
  359. <div class="bg-faded p-2 mx-auto mb-2 text-center" style="max-width:700px;font-size:2rem;font-weight:200;letter-spacing:2px">
  360. <hr class="m-1 mx-auto" style="width:55%">
  361. Miscellaneous tags
  362. <hr class="m-1 mx-auto" style="width:55%">
  363. </div>
  364.  
  365. <div class="bg-faded p-md-4 p-2 mx-auto" style="max-width:700px">
  366.  
  367. <!---- Designer ---->
  368. <div class="row no-gutters mb-3">
  369. <div class="col-auto"><i class="fal fa-pencil fa-2x px-1 text-secondary"></i></div>
  370. <div class="col mb-2"><hr style="width:90%"></div>
  371. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Designer</div>
  372. <div class="col mb-2"><hr style="width:90%"></div>
  373. <div class="col-auto"><i class="fal fa-palette fa-2x px-1 text-secondary"></i></div>
  374. <div class="col-md-12 row no-gutters mb-3">
  375. <div class="col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Me</a></div>
  376. <div class="col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Someone else</a></div>
  377. </div>
  378. </div>
  379.  
  380. <!---- Category with 2 tags per row ---->
  381. <div class="row no-gutters mb-3">
  382. <div class="col-auto"><i class="fal fa-hashtag fa-2x px-1 text-secondary"></i></div>
  383. <div class="col mb-2"><hr style="width:90%"></div>
  384. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Category</div>
  385. <div class="col mb-2"><hr style="width:90%"></div>
  386. <div class="col-auto"><i class="fal fa-tag fa-2x px-1 text-secondary"></i></div>
  387. <div class="col-md-12 row no-gutters mb-3">
  388. <div class="col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  389. <div class="col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  390. </div>
  391. </div>
  392. <!---- Category with 3 tags per row ---->
  393. <div class="row no-gutters mb-3">
  394. <div class="col-auto"><i class="fal fa-hashtag fa-2x px-1 text-secondary"></i></div>
  395. <div class="col mb-2"><hr style="width:90%"></div>
  396. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Category</div>
  397. <div class="col mb-2"><hr style="width:90%"></div>
  398. <div class="col-auto"><i class="fal fa-tag fa-2x px-1 text-secondary"></i></div>
  399. <div class="col-md-12 row no-gutters mb-3">
  400. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  401. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  402. <div class="col-md-4 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  403. </div>
  404. </div>
  405.  
  406. <!---- Category with 4 tags per row ---->
  407. <div class="row no-gutters mb-3">
  408. <div class="col-auto"><i class="fal fa-hashtag fa-2x px-1 text-secondary"></i></div>
  409. <div class="col mb-2"><hr style="width:90%"></div>
  410. <div class="col-auto p-1 mb-2 text-primary" style="font-weight:300;font-size:1.2rem">Category</div>
  411. <div class="col mb-2"><hr style="width:90%"></div>
  412. <div class="col-auto"><i class="fal fa-tag fa-2x px-1 text-secondary"></i></div>
  413. <div class="col-md-12 row no-gutters mb-3">
  414. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  415. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  416. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  417. <div class="col-md-3 col-6 p-1"><a class="btn btn-block btn-outline-secondary p-3 rounded-0" href="">Tag</a></div>
  418. </div>
  419. </div>
  420.  
  421. </div>
  422.  
  423.  
  424. <!--- Credit - DON'T REMOVE ---->
  425. <div style="max-width:800px" class="p-1 text-right"><a data-toggle="tooltip" class="text-muted" title="Coding by ElithianFox" href="https://toyhou.se/Elithian"><i class="far fa-dna"></i></a></div>
  426.  
  427. </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!