API tools faq
paste
luna-ria

reincarnate

luna-ria
Aug 21st, 2019
152
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.08 KB | None | 0 0
raw download clone embed print report
  1. [nobr]
  2.  
  3. [class=tabscontainer]
  4. width: 205px;
  5. height: 300px;
  6. display: flex;
  7. flex-direction: column;
  8. [/class]
  9.  
  10.  
  11. [class=tab]
  12. box-sizing: border-box;
  13. font-size: 12px;
  14. letter-spacing: 2px;
  15. width: 100%;
  16. padding-top: 30px;
  17. justify-content: space-around;
  18. font-family: Montserrat;
  19. border-bottom: 1px solid #f6f6f6;
  20. padding-left: 30px;
  21. text-transform: uppercase;
  22. color: #bbb;
  23. flex: 1;
  24. transition: all 0.5s ease-in-out;
  25. flex: 1;
  26. cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important;
  27. [/class]
  28.  
  29.  
  30. [class=tag]
  31. font-size: 10px;
  32. text-transform: uppercase;
  33. display: inline-block;
  34. padding-left: 4px;
  35. padding-right: 4px;
  36. color: #000;
  37. background: #ffd59e;
  38. letter-spacing: 1px;
  39. margin-top: 10px;
  40. [/class]
  41.  
  42.  
  43. [class=selectedtab]
  44. font-size: 12px;
  45. letter-spacing: 2px;
  46. width: 220px;
  47. box-sizing: border-box;
  48. padding-top: 30px;
  49. background: #f0be7d;
  50. padding-left: 60px;
  51. text-transform: uppercase;
  52. font-family: Montserrat;
  53. border-bottom: 1px solid #f6f6f6;
  54. flex: 1;
  55. color: #000;
  56. transition: all 0.5s ease-in-out;
  57. cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important;
  58. [/class]
  59.  
  60.  
  61. [class name=tab state=hover]
  62. color: #000;
  63. transition: all 0.5s ease-in-out;
  64. cursor: url(https://66.media.tumblr.com/6fb38fc5e97353c67e3fc3a2e2b29bf9/tumblr_inline_ol4nwisGdu1uxxza6_75sq.png), auto!important;
  65. [/class]
  66.  
  67.  
  68. [script class=tab on=click]
  69. hide tabcontents
  70. removeClass selectedtab tab
  71. set currentTab (getText)
  72.  
  73. if (eq ${currentTab} general.) (addClass selectedtab tabone)
  74. if (eq ${currentTab} appearance.) (addClass selectedtab tabtwo)
  75. if (eq ${currentTab} persona.) (addClass selectedtab tabthree)
  76. if (eq ${currentTab} background.) (addClass selectedtab tabfour)
  77.  
  78.  
  79. if (eq ${currentTab} general.) (show tabcontentsone)
  80. if (eq ${currentTab} appearance.) (show tabcontentstwo)
  81. if (eq ${currentTab} persona.) (show tabcontentsthree)
  82. if (eq ${currentTab} background.) (show tabcontentsfour)
  83. [/script]
  84.  
  85.  
  86.  
  87. [div=box-sizing: border-box; background: #f7f7f7; padding-bottom: 30px; cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important;]
  88. [div=height: 100px; background: #f0be7d;][/div]
  89. [div=font-size: 80px; text-align: center; font-family: Times New Roman; color: #000; letter-spacing: -1px; font-weight: bold; margin-top: -80px;]character name.[/div]
  90. [div=width: 1000px; background: #fff; margin: auto; height: 500px; display: flex; flex-direction: row;]
  91.  
  92.  
  93.  
  94. [div class="tabcontents tabcontentsone"][div=flex: 2; display: flex; flex-direction: row;]
  95. [div=flex: 0.6; width: 200px; box-sizing: border-box; background: #f7f7f7; border-right: 10px solid #f7f7f7;]
  96. [div=display: flex; flex-direction: column; height: 500px;]
  97. [div=flex: 1; background: url(https://66.media.tumblr.com/e8995f8772abe2acfee701824bb05c31/tumblr_pce2lh1OpC1ua1nbgo1_400.gif); background-size: cover; background-position: 50% 50%; border: 6px solid #fff; margin-bottom: 10px;]
  98. [/div]
  99. [div=flex: 1; background: url(https://66.media.tumblr.com/8d51db3718d443ab9e6a7cd311fad2ac/tumblr_pce2lh1OpC1ua1nbgo2_400.gif); background-size: cover; background-position: 50% 50%; border: 6px solid #fff; margin-bottom: 10px;]
  100. [/div]
  101. [div=flex: 1; background: url(https://66.media.tumblr.com/01373faa68b444d38c48c3b552b7f63a/tumblr_pce2lh1OpC1ua1nbgo3_400.gif); background-size: cover; background-position: 50% 50%; border: 6px solid #fff;]
  102. [/div]
  103. [/div]
  104. [/div]
  105.  
  106. [div=flex: 2; width: 595px; height: 500px; box-sizing: border-box; padding: 20px; border: 1px solid #fff;]
  107. [div=font-size: 40px; font-family: Times New Roman; color: #000; letter-spacing: -1px; font-weight: bold; margin-left: 20px; margin-top: -15px;]general info.[/div]
  108. [div=border-top: 18px solid #f0be7d; margin-top: -30px;][/div]
  109. [div=height: 400px; margin-top: 10px; font-size: 12px; line-height: 20px; text-align: justify; overflow-y: auto;]
  110. [div class=tag]tag[/div] info
  111. [br][/br]
  112. [div class=tag]tag[/div] info
  113. [br][/br]
  114. [div class=tag]tag[/div] info
  115. [br][/br]
  116. [div class=tag]tag[/div] info
  117. [br][/br]
  118. [div class=tag]tag[/div] info
  119. [br][/br]
  120. [div class=tag]tag[/div] info
  121. [br][/br]
  122. [div class=tag]tag[/div] info
  123. [/div]
  124. [/div]
  125. [/div]
  126. [/div]
  127.  
  128.  
  129.  
  130. [div class="tabcontents tabcontentstwo" style="display: none;"][div=flex: 2; display: flex; flex-direction: row;]
  131. [div=flex: 0.6; width: 200px; box-sizing: border-box; background: #f7f7f7; border-right: 10px solid #f7f7f7;]
  132. [div=display: flex; flex-direction: column; height: 500px;]
  133. [div=flex: 1; background: url(https://66.media.tumblr.com/a78269bafec3970adac067a35fa5d524/tumblr_p4oh1e7K7l1ua1nbgo1_250.gif); background-size: cover; background-position: 50% 50%; border: 6px solid #fff; margin-bottom: 10px;]
  134. [/div]
  135. [div=flex: 1; background: url(https://66.media.tumblr.com/387f41f976e00f883ac57287670a5bcc/tumblr_p4oh1e7K7l1ua1nbgo2_250.gif); background-size: cover; background-position: 50% 50%; border: 6px solid #fff; margin-bottom: 10px;]
  136. [/div]
  137. [div=flex: 1; background: url(https://66.media.tumblr.com/85759d7ff84dd446d50cdeab0ec7039f/tumblr_p4oh1e7K7l1ua1nbgo4_250.gif); background-size: cover; background-position: 50% 50%; border: 6px solid #fff;]
  138. [/div]
  139. [/div]
  140. [/div]
  141.  
  142. [div=flex: 2; width: 595px; height: 500px; box-sizing: border-box; padding: 20px; border: 1px solid #fff;]
  143. [div=font-size: 40px; font-family: Times New Roman; color: #000; letter-spacing: -1px; font-weight: bold; margin-left: 20px; margin-top: -15px;]appearance info.[/div]
  144. [div=border-top: 18px solid #f0be7d; margin-top: -30px;][/div]
  145. [div=height: 400px; margin-top: 10px; font-size: 12px; line-height: 20px; text-align: justify; overflow-y: auto;]
  146. [div class=tag]tag[/div] info
  147. [br][/br]
  148. [div class=tag]tag[/div] info
  149. [br][/br]
  150. [div class=tag]tag[/div] info
  151. [br][/br]
  152. [div class=tag]tag[/div] info
  153. [br][/br]
  154. [div class=tag]tag[/div] info
  155. [br][/br]
  156. [div class=tag]tag[/div] info
  157. [br][/br]
  158. [div class=tag]tag[/div] info
  159. [/div]
  160. [/div]
  161. [/div]
  162. [/div]
  163.  
  164.  
  165.  
  166. [div class="tabcontents tabcontentsthree" style="display: none;"][div=flex: 2; display: flex; flex-direction: row;]
  167. [div=flex: 0.6; width: 200px; box-sizing: border-box; background: #f7f7f7; border-right: 10px solid #f7f7f7;]
  168. [div=display: flex; flex-direction: column; height: 500px;]
  169. [div=flex: 1; background: url(https://66.media.tumblr.com/67a2c68fadabd80e1b86e3d026e2ac0e/tumblr_pb5x7gRL2U1qelb9co1_500.gif); background-size: cover; background-position: 50% 50%; border: 6px solid #fff; margin-bottom: 10px;]
  170. [/div]
  171. [div=flex: 1; background: url(https://66.media.tumblr.com/efc4291bc8babab8295f03f1677e3815/tumblr_pb5x7gRL2U1qelb9co2_540.gif); background-size: cover; background-position: 50% 50%; border: 6px solid #fff; margin-bottom: 10px;]
  172. [/div]
  173. [div=flex: 1; background: url(https://66.media.tumblr.com/fc259cabdf7b97631c48d805c74b8e73/tumblr_pb5x7gRL2U1qelb9co3_500.gif); background-size: cover; background-position: 50% 50%; border: 6px solid #fff;]
  174. [/div]
  175. [/div]
  176. [/div]
  177.  
  178. [div=flex: 2; width: 595px; height: 500px; box-sizing: border-box; padding: 20px; border: 1px solid #fff;]
  179. [div=font-size: 40px; font-family: Times New Roman; color: #000; letter-spacing: -1px; font-weight: bold; margin-left: 20px; margin-top: -15px;]persona info.[/div]
  180. [div=border-top: 18px solid #f0be7d; margin-top: -30px;][/div]
  181. [div=height: 400px; margin-top: 10px; font-size: 12px; line-height: 20px; text-align: justify; overflow-y: auto;]
  182. [div class=tag]tag[/div] info
  183. [br][/br]
  184. [div class=tag]tag[/div] info
  185. [br][/br]
  186. [div class=tag]tag[/div] info
  187. [br][/br]
  188. [div class=tag]tag[/div] info
  189. [br][/br]
  190. [div class=tag]tag[/div] info
  191. [br][/br]
  192. [div class=tag]tag[/div] info
  193. [br][/br]
  194. [div class=tag]tag[/div] info
  195. [/div]
  196. [/div]
  197. [/div]
  198. [/div]
  199.  
  200.  
  201.  
  202. [div class="tabcontents tabcontentsfour" style="display: none;"][div=flex: 2; display: flex; flex-direction: row;]
  203. [div=flex: 0.6; width: 200px; box-sizing: border-box; background: #f7f7f7; border-right: 10px solid #f7f7f7;]
  204. [div=display: flex; flex-direction: column; height: 500px;]
  205. [div=flex: 1; background: url(https://66.media.tumblr.com/89d15ca8d6da0738e3616c58acc9886a/tumblr_pqfjkeLR2r1xetezto4_540.gif); background-size: cover; background-position: 60% 50%; border: 6px solid #fff; margin-bottom: 10px;]
  206. [/div]
  207. [div=flex: 1; background: url(https://66.media.tumblr.com/8b3b107fd82ee6cd5d9d8ac9868acd1d/tumblr_pqfjkeLR2r1xetezto3_540.gif); background-size: cover; background-position: 60% 50%; border: 6px solid #fff; margin-bottom: 10px;]
  208. [/div]
  209. [div=flex: 1; background: url(https://66.media.tumblr.com/e3be286c1c90d9b48d8a9c18993936a5/tumblr_pqfjkeLR2r1xetezto2_540.gif); background-size: cover; background-position: 70% 50%; border: 6px solid #fff;]
  210. [/div]
  211. [/div]
  212. [/div]
  213.  
  214. [div=flex: 2; width: 595px; height: 500px; box-sizing: border-box; padding: 20px; border: 1px solid #fff;]
  215. [div=font-size: 40px; font-family: Times New Roman; color: #000; letter-spacing: -1px; font-weight: bold; margin-left: 20px; margin-top: -15px;]background info.[/div]
  216. [div=border-top: 18px solid #f0be7d; margin-top: -30px;][/div]
  217. [div=height: 400px; margin-top: 10px; font-size: 12px; line-height: 20px; text-align: justify; overflow-y: auto;]
  218. [div class=tag]tag[/div] info
  219. [br][/br]
  220. [div class=tag]tag[/div] info
  221. [br][/br]
  222. [div class=tag]tag[/div] info
  223. [br][/br]
  224. [div class=tag]tag[/div] info
  225. [br][/br]
  226. [div class=tag]tag[/div] info
  227. [br][/br]
  228. [div class=tag]tag[/div] info
  229. [br][/br]
  230. [div class=tag]tag[/div] info
  231. [/div]
  232. [/div]
  233. [/div]
  234. [/div]
  235.  
  236.  
  237. [div=flex: 0.6; height: 500px; border-left: 10px solid #f7f7f7;]
  238. [div class=tabscontainer]
  239. [div class="tab tabone"]general.[/div]
  240. [div class="tab tabtwo"]appearance.[/div]
  241. [div class="tab tabthree"]persona.[/div]
  242. [div class="tab tabfour"]background.[/div]
  243. [/div]
  244.  
  245.  
  246.  
  247. [/div]
  248. [/div]
  249. [/div]
  250. [div=font-size: 10px; letter-spacing: 1px; text-align: center; margin-top: 5px;]coded by luna.[/div]
  251. [/nobr]
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!