SHARE
TWEET

minimal

SHADYACE Nov 15th, 2019 37 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. [nobr]
  2. [class=variables]
  3.     cursor: url('http://i.imgur.com/ZOrzC.png'), auto !important;
  4.     --color: #141414;
  5. [/class]
  6.  
  7. [class=container]
  8.     width: 350px;
  9.     display: flex;
  10.     margin: auto;
  11.     flex-direction: column;
  12.     justify-content: flex-start;
  13. [/class]
  14.  
  15. [class=name]
  16.     font-size: 40px;
  17.     font-weight: 900;
  18.     line-height: 0.7;
  19.     color: var(--color);
  20. [/class]
  21.  
  22. [class=tabsContainer]
  23.     width: 350px;
  24.     display: flex;
  25.     justify-content: space-evenly;
  26.     align-items: center;
  27.     flex-wrap: wrap;
  28. [/class]
  29.  
  30. [class=title]
  31.     font-size: 20px;
  32.     border: 1px solid var(--color);
  33.     padding: 3px;
  34.     box-sizing: border-box;
  35.     line-height: 1;
  36.     letter-spacing: 2px;
  37.     transition: 1s;
  38. [/class]
  39.  
  40. [class name=title state=hover]
  41.     cursor: url('https://i.imgur.com/8akxkMH.png'), auto !important;
  42.     background-color: var(--color);
  43.     color: white;
  44. [/class]
  45.  
  46. [class=bigGap]
  47.     flex-grow: 3;
  48. [/class]
  49.  
  50. [class=gap]
  51.     flex-grow: 2;
  52. [/class]
  53.  
  54. [class=tab]
  55.     text-shadow: -1px -1px 0 var(--color), 1px -1px 0 var(--color), -1px 1px 0 var(--color), 1px 1px 0 var(--color);
  56.     font-size: 30px;
  57.     color: white;
  58.     transition: 1s;
  59.     flex-basis: auto;
  60. [/class]
  61.  
  62. [class name=tab state=hover]
  63.     cursor: url('https://i.imgur.com/8akxkMH.png'), auto !important;
  64.     color: var(--color);
  65. [/class]
  66.  
  67. [class=contentContainer]
  68.     height: 350px;
  69.     width: 350px;
  70.     position: relative;
  71. [/class]
  72.  
  73. [class=content]
  74.     height: 350px;
  75.     width: 350px;
  76.     opacity: 0;
  77.     position: absolute;
  78.     transition: 1s;
  79.     padding: 10px;
  80.     box-sizing: border-box;
  81.     font-size: 12px;
  82.     overflow: hidden;
  83. [/class]
  84.  
  85. [class=scroll]
  86.     overflow-y: scroll;
  87.     padding-right: 40px;
  88.     width: 100%;
  89.     height: 100%;
  90. [/class]
  91.  
  92. [class=bigImg]
  93.     height: 330px;
  94.     width: 330px;
  95.     background-image: url('https://img.buzzfeed.com/buzzfeed-static/static/2017-01/2/16/asset/buzzfeed-prod-web-11/sub-buzz-13797-1483392917-1.jpg?downsize=1040:*&output-format=auto&output-quality=auto');
  96.     background-size: cover;
  97. [/class]
  98.  
  99. [class=tag]
  100.     width: auto;   
  101.     height: 16px;
  102.     padding: 0px 2px 0px 2px;
  103.     display: inline-block;
  104.     border: 1px solid var(--color);
  105.     font-size: 10px;
  106.     text-transform: uppercase;
  107. [/class]
  108.  
  109. [class=imgSmallContainer]
  110.     width: 80%;
  111.     height: 70px;
  112.     display: flex;
  113.     justify-content: space-between;
  114.     margin: 10px auto;
  115. [/class]
  116.  
  117. [class=imgSmall]
  118.     width: 70px;
  119.     height: 70px;
  120.     background-size: cover;
  121. [/class]
  122.  
  123. [class=show]
  124.     z-index: 1;
  125.     opacity: 1;
  126. [/class]
  127.  
  128. [class=titleSelected]
  129.     background-color: var(--color);
  130.     color: white;
  131. [/class]
  132.  
  133. [class=selected]
  134.     color: var(--color);
  135. [/class]
  136.  
  137. [script class=title on=click]
  138.     addClass show contentHome
  139.     removeClass show content01
  140.     removeClass show content02
  141.     removeClass show content03
  142.  
  143.     addClass titleSelected title
  144.     removeClass selected tab01
  145.     removeClass selected tab02
  146.     removeClass selected tab03
  147. [/script]
  148.  
  149. [script class=tab01 on=click]
  150.     addClass show content01
  151.     removeClass show contentHome
  152.     removeClass show content02
  153.     removeClass show content03
  154.  
  155.     addClass selected tab01
  156.     removeClass titleSelected title
  157.     removeClass selected tab02
  158.     removeClass selected tab03
  159. [/script]
  160.  
  161. [script class=tab02 on=click]
  162.     addClass show content02
  163.     removeClass show contentHome
  164.     removeClass show content01
  165.     removeClass show content03
  166.  
  167.     addClass selected tab02
  168.     removeClass titleSelected title
  169.     removeClass selected tab01
  170.     removeClass selected tab03
  171. [/script]
  172.  
  173. [script class=tab03 on=click]
  174.     addClass show content03
  175.     removeClass show contentHome
  176.     removeClass show content01
  177.     removeClass show content02
  178.  
  179.     addClass selected tab03
  180.     removeClass titleSelected title
  181.     removeClass selected tab01
  182.     removeClass selected tab02
  183. [/script]
  184.  
  185.  
  186. [div class=variables]
  187.     [div class=container]
  188.         [div class=name][font=Playfair Display]name here[/font][/div]
  189.         [div class=tabsContainer]
  190.             [div class="title titleSelected"][font=work sans]ROLE?[/font][/div]
  191.             [div class=bigGap][/div]
  192.             [div class="tab tab01"]01.[/div]
  193.             [div class=gap][/div]
  194.             [div class="tab tab02"]02.[/div]
  195.             [div class=gap][/div]
  196.             [div class="tab tab03"]03.[/div]
  197.         [/div]
  198.  
  199.         [div class=contentContainer]
  200.             [div class="content contentHome show"]
  201.             [div class=bigImg][/div]
  202.             [/div]
  203.  
  204.             [div class="content content01"]
  205.             [div class=scroll]
  206.                 [div class=imgSmallContainer]
  207.                     [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/fddf535c408ac6eeba44dcd97959fa64/tumblr_inline_pdtkc8rBD31uzz54f_1280.gif');"][/div]
  208.                     [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/b45b8e6e2e93dc02f32ca9c96503cd3d/tumblr_inline_pdtkcqwvia1uzz54f_1280.gif');"][/div]
  209.                     [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/1ee8fc0cbf3b7f25ed687c554d6a3674/tumblr_inline_pdtkct5uyG1uzz54f_1280.gif');"][/div]
  210.                 [/div]
  211. [div class=tag]name[/div] name here
  212. [br][/br]
  213. [div class=tag]nickname[/div] etc.
  214. [br][/br]
  215. [div class=tag]age[/div]
  216. [br][/br]
  217. [div class=tag]pob[/div]
  218. [br][/br]
  219. [div class=tag]dob[/div]
  220. [br][/br]
  221. [div class=tag]input[/div] output
  222. [br][/br]
  223. [div class=tag]input[/div] output
  224.             [/div]
  225.             [/div]
  226.  
  227.             [div class="content content02"]
  228.             [div class=scroll]
  229.                 [div class=imgSmallContainer]
  230.                     [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/3e555714a27f9e21f7b903f3a2174465/tumblr_inline_pdtjzwRbnu1uzz54f_1280.gif');"][/div]
  231.                     [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/a3de78ad594c425c8be85a3ddd3229b4/tumblr_inline_pdtjzf0NYd1uzz54f_1280.gif');"][/div]
  232.                     [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/a9c1e1018f92e73cad51e1a1ace298e4/tumblr_inline_pdtk01872k1uzz54f_1280.gif');"][/div]
  233.                 [/div]
  234. [div class=tag]vices[/div] (4+)
  235. [br][/br]
  236. [div class=tag]virtues[/div] (4+)
  237. [br][/br]
  238. [div class=tag]surely by now[/div] you get the idea
  239.             [/div]
  240.             [/div]
  241.  
  242.             [div class="content content03"]
  243.             [div class=scroll]
  244.                 [div class=imgSmallContainer]
  245.                     [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/e2019bc5f08d13b8da0432ae1deca7c2/tumblr_inline_pcdp1dkhJP1uzz54f_540.gif');"][/div]
  246.                     [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/01d012e794a3b6ae7d21406be18a5aec/tumblr_inline_pcdp1eetJb1uzz54f_540.gif');"][/div]
  247.                     [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/87989a3cbfcf06fb008336867a7f2be3/tumblr_inline_pcdp1gn1vv1uzz54f_540.gif');"][/div]
  248.                 [/div]
  249. [div class=tag]theme song[/div]
  250. [br][/br]
  251. [div class=tag]misc[/div]
  252.             [/div]
  253.             [/div]
  254.  
  255.         [/div]
  256.     [/div]
  257. [/div]
  258. [div=font-size: 9px; text-align: center; opacity: 0.7;]coded by shady.[/div]
  259. [/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