API tools faq
paste
Advertisement
Guest User

circlejourney code bug report

a guest
Jul 8th, 2023
12
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 18.35 KB | None | 0 0
raw download clone embed print report
  1. <!-------------------------------------------------
  2.  
  3.  
  4. Telling — Custom Coloured version.
  5. (code by jiko)
  6.  
  7. ------------------------------
  8.  
  9. RULES
  10. → Read this thoroughly please, and maybe drop a small comment saying that you've read it? :'3
  11. thank youu [ https://toyhou.se/~bulletins/127417.code-rules ]
  12.  
  13. → turn OFF WYSIWYG (in display settings)
  14. → turn ON Code Editor
  15.  
  16. ------------------------------
  17.  
  18. TIPPY TIPS
  19. → insert your img links INSIDE or quotation marks!!
  20. → looking for a good online code editor? try [ https://th.circlejourney.net/# ] !
  21.  
  22. ------------------------------
  23.  
  24. COLOUR
  25. → accent 1 ----------- #dc5014
  26. → accent 2 ----------- #30021c
  27. (looks best if darker than accent 1)
  28.  
  29. use control/command + f to quickly change the colours!
  30.  
  31.  
  32. ------------------------------------------------->
  33. <div class="mx-auto text-justify" style="font-size:90%; letter-spacing:0.3px; max-width:800px;"><!--
  34. → add [flex-row-reverse] next to the no-gutters if you want them switched around!
  35. -->
  36. <div class="row no-gutters" style="margin:-4px;"><!-------------------------------------------------
  37.  
  38.  
  39. CHARACTER BOX + MUSIC BOX
  40.  
  41.  
  42. ------------------------------------------------->
  43. <div class="col-lg-4 p-2 order-lg-2 d-flex w-100">
  44. <div class="card-block bg-faded p-0" style="border-bottom-left-radius:15px; border-top-left-radius:15px;"><!-- NAME / TITLE
  45. --------------------------------------------->
  46. <!--
  47. → shorter is better!
  48. -->
  49. <div class="card border-0 rounded-0 p-2 text-center" style="border-top-left-radius:15px; background-color:#dc5014;"><span class="text-uppercase text-white font-weight-bold" style="font-size:18px; letter-spacing:3.5px; text-shadow: 3.5px 3.5px #30021c;"> THE PHENIOX LAZARUS </span></div><!-- FOCAL IMAGE
  50. --------------------------------------------->
  51. <div class="mb-2" style="min-height:300px;
  52. background-image: url(https://i.imgur.com/61qQZwf.png);
  53. background-size: cover;
  54. background-repeat: no-repeat;
  55. background-position: center;"><br></div><!-- MUSIC BOX
  56. --------------------------------------------->
  57. <div class="row no-gutters p-3 pt-4">
  58. <div class="col-12">
  59. <div class="text-center text-uppercase" style="letter-spacing:3px;">N/A</div>
  60. <div class="text-center text-muted pb-2">N/A</div>
  61. <div class="card border-0 rounded-0 p-1 progress my-2 mb-3" style="height:12px;">
  62. <div class="progress-bar" style="
  63. width:50%;
  64. background-color:#dc5014;"><br></div>
  65. </div>
  66. </div>
  67. <div class="col">
  68. <p class="text-center" style="font-size:20px;"><i class="fas fa-backward"></i></p>
  69. </div>
  70. <div class="col">
  71. <p class="text-center" style="font-size:20px;"><i class="fas fa-play"></i></p>
  72. </div>
  73. <div class="col">
  74. <p class="text-center" style="font-size:20px;"><i class="fas fa-forward"></i></p>
  75. </div><!-- MUSIC
  76. ------------------------------------->
  77. <!--
  78. → this uses the youtube embed video, replace [1IKsmR9yyYs] with your video ID (found in the url after watch?V=)
  79. → E.G. https://www.youtube.com/watch?v= → 1IKsmR9yyYs ←
  80.  
  81. → keep [?controls=0] at the end for a nicer performance!
  82. -->
  83. <span class="fr-video fr-fvc fr-dvb fr-draggable" contenteditable="false" style=""><iframe src="https://www.youtube.com/embed/." class="w-100" style="position:absolute; height:100px; margin-top:30px; left:0; opacity:0.0001;" frameborder="0"> </iframe></span>
  84. </div>
  85. </div>
  86. </div><!-------------------------------------------------
  87.  
  88.  
  89. PROFILE
  90.  
  91.  
  92. ------------------------------------------------->
  93. <div class="col-lg-8 p-2 order-lg-1 w-100"><!-- TABS
  94. --------------------------------------------->
  95. <div class="card border-0 rounded-0 p-2 w-100" style="border-top-right-radius:15px; background-color:#dc5014;">
  96. <div class="mx-auto text-center py-1 col-lg-8">
  97. <ul class="nav row">
  98. <li class="nav-item col"><a class="p-2 text-white active" data-toggle="tab" href="#tellingone"><i class="fas fa-user"></i></a></li>
  99. <li class="nav-item col"><a class="p-2 text-white" data-toggle="tab" href="#tellingtwo"><i class="fas fa-heart"></i></a></li>
  100. <li class="nav-item col"><a class="p-2 text-white" data-toggle="tab" href="#tellingthree"><i class="fas fa-book-open"></i></a></li>
  101. <li class="nav-item col"><a class="p-2 text-white" data-toggle="tab" href="#tellingfour"><i class="fas fa-star"></i></a></li>
  102. <li class="nav-item col"><a class="p-2 text-white" data-toggle="tab" href="#tellingfive"><i class="fas fa-link"></i></a></li>
  103. </ul>
  104. </div>
  105. </div>
  106. <div class="table-responsive tab-content bg-faded" style="border-bottom-right-radius:15px; height:470px;"><!-- BASIC INFO
  107. --------------------------------------------->
  108. <div class="tab-pane fade active show" id="tellingone">
  109. <div class="bg-faded p-3">
  110. <blockquote class="text-uppercase font-weight-bold" style="font-size:12px; letter-spacing:4px; border-width:3px;">01 — Profile</blockquote>
  111. <hr>
  112. <div class="row no-gutters m-n2"><!-- CONTENT
  113. ------------------------------------->
  114. <div class="col-lg-6 p-2">
  115. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Name</span>
  116. <span class="pull-right">Gabriel / Lazarus</span>
  117. </div>
  118. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Nicknames</span>
  119. <span class="pull-right">The Pheniox</span>
  120. </div>
  121. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Age</span>
  122. <span class="pull-right">n/a</span>
  123. </div>
  124. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Gender</span>
  125. <span class="pull-right">n/a</span>
  126. </div>
  127. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Height</span>
  128. <span class="pull-right">6'2"</span>
  129. </div>
  130. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Birthdate</span>
  131. <span class="pull-right">n/a</span>
  132. </div>
  133. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Race</span>
  134. <span class="pull-right">Archangel</span>
  135. </div>
  136. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Orientation.</span>
  137. <span class="pull-right">N/A</span>
  138. </div>
  139. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Occupation</span>
  140. <span class="pull-right"><em><strong>Michaels right hand</strong></em></span>
  141. </div>
  142. <hr class="my-2">
  143. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Status</span>
  144. <span class="pull-right">not for sale. <strong><em>ever</em></strong></span>
  145. </div>
  146. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Designer</span>
  147. <span class="pull-right">me lmao</span>
  148. </div>
  149. <div class="p-1"><span class="text-uppercase text-muted" style="letter-spacing:1.5px;">Worth</span>
  150. <span class="pull-right"><strong><em><u>///never offer for him///</u></em></strong></span>
  151. </div><span class="hidden-md-up">
  152. <hr class="my-2">
  153. </span>
  154. </div><!-- DESIGN NOTES
  155. ------------------------------------->
  156. <div class="col-lg-6 p-2" style="max-height:370px; overflow:auto;">
  157. <ul class="fa-ul mb-0 text-muted">
  158. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>Will protect Michael with his life.</li>
  159. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>he/they pronouns</li>
  160. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>May look soft, is actually a force of nature</li>
  161. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>.</li>
  162. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>.</li>
  163. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>.</li>
  164. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>.</li>
  165. </ul>
  166. </div>
  167. </div>
  168. </div>
  169. </div><!-- PERSONALITY + LIKES/DISLIKES
  170. --------------------------------------------->
  171. <div class="tab-pane fade" id="tellingtwo">
  172. <div class="bg-faded p-3">
  173. <blockquote class="text-uppercase font-weight-bold" style="font-size:12px; letter-spacing:4px; border-width:3px;">02 — Personality</blockquote>
  174. <hr><!-- CONTENT
  175. ----------------------------------------->
  176. <div class="text-muted p-1 mb-3">
  177. <p><i>Gabriel is gruf and agressive. They're exeptionally protective of their brother <a href="https://toyhou.se/18997950.micheal">Michael</a>, as well as their fellow archangel <a href="https://toyhou.se/21747468.zadekiel:">Zadekiel</a>.</p>
  178. </div>
  179. <hr>
  180. <div class="row no-gutters"><!-- LIKES
  181. ----------------------------------------->
  182. <div class="col-6 pr-2">
  183. <div class="card border-0 rounded-0 pl-3 py-2 text-uppercase" style="letter-spacing:3px;">Likes</div>
  184. <ul class="fa-ul text-muted">
  185. <li class="my-2"><span class="fa-li"><i class="fas fa-times" style="font-size:9px; color:#dc5014;"></i></span><br>His job</li>
  186. <li class="my-2"><span class="fa-li"><i class="fas fa-times" style="font-size:9px; color:#dc5014;"></i></span><br>His family</li>
  187. </ul>
  188. </div><!-- DISLIKES
  189. ----------------------------------------->
  190. <div class="col-6 pl-2">
  191. <div class="card border-0 rounded-0 text-right pr-3 py-2 text-uppercase" style="letter-spacing:3px;">DisLikes</div>
  192. <ul class="fa-ul text-muted">
  193. <li class="my-2"><span class="fa-li"><i class="fas fa-times" style="font-size:9px; color:#dc5014;"></i></span><br>N/A</li>
  194. </ul>
  195. </div>
  196. </div>
  197. </div>
  198. </div><!-- BACKGROUND
  199. --------------------------------------------->
  200. <div class="tab-pane fade" id="tellingthree">
  201. <div class="bg-faded p-3">
  202. <blockquote class="text-uppercase font-weight-bold" style="font-size:12px; letter-spacing:4px; border-width:3px;">03 — Background</blockquote>
  203. <hr>
  204. <div class="text-muted p-1">
  205. <div class="card text-uppercase border-0 rounded-0 px-3 py-2 text-body mt-1 mb-2" style="letter-spacing:3px;">
  206. <p><i class="far fa-bookmark fa-fw mr-2"></i>Background</p>
  207. </div>
  208. <p>John Michael Camren was born on March 9th in 1566. Growing up, he volunteered at the local church, and eventually went to school to study religion. This eventually landed him a job as a preist at a church in London! As he continued to age, he continued to climb the ranks and soon became the top preist. At that same time, he started to dabble in the "dark arts" — Angelic and Demonic magik.</p>
  209. <div class="card text-uppercase border-0 rounded-0 px-3 py-2 text-body mt-1 mb-2" style="letter-spacing:3px;">
  210. <p><i class="far fa-bookmark fa-fw mr-2"></i>A rookies mistake</p>
  211. </div>
  212. <p><i>❝Lucifer? Fine. Whatever you wan't I'll give but you ensure him safety.❞</i></p>
  213. <p>Have you ever heard the phrase "don't make a deal with the devil?" John certianly had, but his son meant more than an old church nuns tale. So on one faithful night, Father Camren shook hands with Lucifer, and the fallen angel had broken free from his cage. Lucifer didn't do much at first, though he gave John the ability to "purify" souls — turn demons to humans again, but this also meant he could turn humans to demons.</p>
  214. <div class="card text-uppercase border-0 rounded-0 px-3 py-2 text-body mt-1 mb-2" style="letter-spacing:3px;">
  215. <p><i class="far fa-bookmark fa-fw mr-2"></i>The dissaperance</p>
  216. </div>
  217. <p><i>❝Johnny boy, you've proved yourself so worth it! But it's time to go. Say bye-bye to silly little Syl' now! Oh, wait. You won't ever see him again. Yeesh, you didn't even say goodbye when you left this morning, did you?❞</i></p>
  218. <p>Lucifer, with one flap of his mighty, patchy, gruff and scarred wings, he anhilated the building they were in to shreads, killing everyone inside, human or demon, beside the archangel himself. This was the start of the war.</p>
  219. <!-- add / delete above THIS line! -->
  220. </div>
  221. </div>
  222. </div><!-- TRIVIA
  223. --------------------------------------------->
  224. <div class="tab-pane fade" id="tellingfour">
  225. <div class="bg-faded p-3">
  226. <blockquote class="text-uppercase font-weight-bold" style="font-size:12px; letter-spacing:4px; border-width:3px;">04 — Trivia</blockquote>
  227. <hr>
  228. <ul class="fa-ul mb-0 text-muted">
  229. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>TBA</li>
  230. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>TBA</li>
  231. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>TBA</li>
  232. <li class="my-2"><span class="fa-li"><i class="fas fa-angle-right" style="font-size:9px; color:#dc5014;"></i></span><br>TBA</li>
  233. </ul>
  234. </div>
  235. </div><!-- RELATIONSHIPS
  236. --------------------------------------------->
  237. <div class="tab-pane fade" id="tellingfive">
  238. <div class="bg-faded p-3">
  239. <blockquote class="text-uppercase font-weight-bold" style="font-size:12px; letter-spacing:4px; border-width:3px;">05 — Relationships</blockquote>
  240. <hr><!-- RELATION ONE
  241. ----------------------------------------->
  242. <div class="row no-gutters p-1 py-3"><!-- IMAGE -------------------------->
  243. <div class="col-5 w-100" style="min-height:200px; border-radius:10px;
  244. background-image: url(https://f2.toyhou.se/file/f2-toyhou-se/images/57808673_e7H2e7lkkhaZeNL.png);
  245. background-size:cover;
  246. background-repeat: no-repeat;
  247. background-position: center;"><br></div><!-- DESCRIPTION -------------------->
  248. <div class="col-7 px-3">
  249. <div class="row no-gutters">
  250. <div class="col-6 my-auto"><span style="font-size:20px; color:#dc5014;">01.</span></div>
  251. <div class="col-6 text-right"><span><a href="https://toyhou.se/19019647.lucifer" style="font-size:15px; color:#dc5014;">LUCIFER</a><br> ? ? ? </span></div>
  252. </div>
  253. <hr class="my-2">
  254. <div class="card border-0 rounded-0 p-3 text-muted" style="max-height:140px; overflow:auto;">
  255. <p>Their relations can not be described with words.</p>
  256. </div>
  257. </div>
  258. </div><!-- RELATION TWO
  259. ----------------------------------------->
  260. <div class="row no-gutters p-1 py-3"><!-- IMAGE -------------------------->
  261. <div class="col-5 w-100" style="min-height:200px; border-radius:10px;
  262. background-image: url(https://f2.toyhou.se/file/f2-toyhou-se/characters/15768110?1650548208);
  263. background-size:cover;
  264. background-repeat: no-repeat;
  265. background-position: center;"><br></div><!-- DESCRIPTION -------------------->
  266. <div class="col-7 px-3">
  267. <div class="row no-gutters">
  268. <div class="col-6 my-auto"><span style="font-size:20px; color:#dc5014;">02.</span></div>
  269. <div class="col-6 text-right"><span><a href="https://toyhou.se/15768110.sylvester-edward-camren" style="font-size:15px; color:#dc5014;">Sylvester Edward Camren</a><br> Son </span></div>
  270. </div>
  271. <hr class="my-2">
  272. <div class="card border-0 rounded-0 p-3 text-muted" style="max-height:140px; overflow:auto;">
  273. <p>Sylvester is John's son! They are very very close :)</p>
  274. </div>
  275. </div>
  276. </div><!-- RELATION THREE
  277. ----------------------------------------->
  278. <div class="row no-gutters p-1 py-3"><!-- IMAGE -------------------------->
  279. <div class="col-5 w-100" style="min-height:200px; border-radius:10px;
  280. background-image: url(https://file.toyhou.se/images/7745356_UbxFaTbtSE8Egg6.png);
  281. background-size:cover;
  282. background-repeat: no-repeat;
  283. background-position: center;"><br></div><!-- DESCRIPTION -------------------->
  284. <div class="col-7 px-3">
  285. <div class="row no-gutters">
  286. <div class="col-6 my-auto"><span style="font-size:20px; color:#dc5014;">03.</span></div>
  287. <div class="col-6 text-right"><span><a href="LINK_TO_CHARACTER" style="font-size:15px; color:#dc5014;">N/A</a><br> N/A </span></div>
  288. </div>
  289. <hr class="my-2">
  290. <div class="card border-0 rounded-0 p-3 text-muted" style="max-height:140px; overflow:auto;">
  291. <p>N/A</p>
  292. </div>
  293. </div>
  294. </div><!-- add / delete above THIS line! -->
  295. </div>
  296. </div>
  297. </div>
  298. </div>
  299. </div><!-------------------------------------------------
  300.  
  301.  
  302. CREDITS
  303. DONT REMOVE !!! TY !!! <3
  304.  
  305.  
  306. ------------------------------------------------->
  307. <div class="p-1 small text-right faded" style="letter-spacing:1px;"><a class="text-muted text-monospace tooltipster" href="https://toyhou.se/9283486.-f2u-telling" style="text-decoration:none;" title="code by jiko">code by jiko</a>
  308. <span class="mx-1">|</span>
  309. <a class="text-muted text-monospace tooltipster" href="LINK_TO_ARTIST" style="text-decoration:none;" title="image by ARTIST"><i class="fas fa-image fa-fw"></i></a>
  310. </div>
  311. </div><!-- CODE ENDS -->
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!