SHARE
TWEET

reincarnate

luna-ria Aug 21st, 2019 (edited) 57 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  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]
RAW Paste Data
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
Top