SHARE
TWEET

[FTU] Smoothie About Me - Grape [3 tabs]

Zephyrhowl Jan 9th, 2017 (edited) 178 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. [styleclass=ct][
  2. ][styleclass=av]avatar here 100x100px[/styleclass][
  3. ][styleclass=text]default text here [i]italic[/i] [b]bold[/b] [u]underline[/u] [s]strike[/s] [url=http://pokefarm.com]link[/url]
  4.  
  5. [progress="[inventory=PokéDex]/10"]progress bar[/progress][/styleclass][
  6. ][styleclass=tabs][accordion]
  7. [a-section=tab1]tab1 content[/a-section]
  8. [a-section=tab2]tab2 content[/a-section]
  9. [a-section=tab3]tab3 content[/a-section]
  10. [/accordion][/styleclass][
  11. ][styleclass=cr]code©[url=https://pokefarm.com/forum/post/2117803]type null[/url][/styleclass][/styleclass]
  12. [style]
  13. /* STYLE OPTIONS
  14.    Everything here is editable EXCEPT the last section!
  15.    Please respect me by not editing anything else unless you are certain you know what you are doing! */
  16.    
  17. /* image codes
  18.    replace image url with desired image INSIDE quotation marks! */
  19. @bgImage:url("https://i.imgur.com/lXnOm4j.png");
  20. @tabImage:url("https://i.imgur.com/7wCGb7z.png"); /* used for tab content */
  21. @tabIcon:url("https://pfq-static.com/img/items/acc/icon/seashell.png");
  22.  
  23. /* border codes */
  24. @borderStyle:double; /* Recommended values: double, outset, inset */
  25. @borderColor:#c96eea;
  26. @roundedBorders:5px; /* enter 0px for no rounded borders */
  27.  
  28. /* background colors */
  29. @bgColor1:#e3adf4; /* main background */
  30. @bgColor2:#f5d6ff; /* background for tabs, etc */
  31.  
  32. /* fonts */
  33. @fontColor:#8f43a8;
  34. @tabFontColor:@borderColor;
  35. @linkColor: #c1539f;
  36. @linkStyle:none; /* recommended values: none, underline */
  37. @font:"arial", "sans-serif";
  38. @tabFont:"ms pgothic", "arial", "sans-serif";
  39. @fontWeight:normal;
  40.  
  41. /* tab hover colors */
  42. @tabBgColor:#fbf2fd; /* background color */
  43. @fontColor2:#8f4cb0; /* font color */
  44. @borderColor2:#8f4cb0; /* border color */
  45.  
  46. /* tab text align */
  47. @tabAlign:left; /* recommended values: left, center */
  48.  
  49. /* do not edit unless necessary */
  50. @lineHeight:14px;
  51. @fontSize:12px;
  52. @borderSize:3px;
  53. @marginTop1:96.8%; /* used for credit */
  54. @marginTop2:1px;
  55. @marginLeft:1px;
  56. @tabMargin:67px;
  57. @tabMargin2:108px;
  58. @tabTop1:52px;
  59. @tabTop2:80px;
  60. @tabWidth:(@ctWidth/3) - (@tabMargin/1.3);
  61. @ctWidth:311px;
  62. @ctHeight:321px;
  63. @transition:all ease-in-out 0.5s;
  64.  
  65. /* MAIN STYLING
  66.    I highly recommend not changing anything in this section. */
  67.  
  68. .ct {
  69.   background-color:@bgColor1;
  70.   background-image:@bgImage;
  71.   width:@ctWidth;
  72.   height:@ctHeight;
  73.   position:relative;
  74. }
  75.  
  76. .ct a { color:@linkColor; text-decoration:@linkStyle; }
  77. .ct .bbcode_tooltip { border-color:@linkColor; }
  78. .ct .tooltip_content { background-color:@bgColor1; border:1px solid @fontColor; color:@fontColor }
  79.  
  80. .av {
  81.   width:100px;
  82.   height:100px;
  83.   color:@fontColor;
  84.   font-family:@font;
  85.   font-size:@fontSize;
  86.   line-height:@lineHeight;
  87.   border:@borderSize @borderStyle @borderColor;
  88.   border-radius:@roundedBorders;
  89.   background-color:@bgColor2;
  90.   float:left;
  91.   margin-top:@marginTop2;
  92.   margin-left:@marginLeft;
  93. }
  94.  
  95. .tabs .panel {
  96.   border:none;
  97.   box-shadow:none;
  98.   background:none;
  99.   &>h3 {
  100.     background-color:@bgColor2;
  101.     background-image:@tabIcon;
  102.     background-repeat:no-repeat;
  103.     background-position:right center;
  104.     color:@tabFontColor;
  105.     font-family:@font;
  106.     font-weight:@fontWeight;
  107.     text-align:@tabAlign;
  108.     border:@borderSize @borderStyle @borderColor;
  109.     border-radius:@roundedBorders;
  110.     width:@tabWidth;
  111.     height:14px;
  112.     position:absolute;
  113.     overflow:hidden;
  114.     margin-top:@tabTop2;
  115.     margin-left:@tabMargin2;
  116.     -webkit-transition:@transition;
  117.     transition: @transition;
  118.     -o-transition:@transition;
  119.     -moz-transition:@transition;
  120.   }
  121.     &>h3:hover { background-color:@tabBgColor; border-color:@borderColor2; }
  122.     &>h3:nth-child(3) { margin-top:@tabTop2; margin-left:(@tabMargin2) + (@tabMargin); }
  123.     &>h3:nth-child(5) { margin-top:@tabTop2; margin-left:(@tabMargin2) + (@tabMargin*2); }
  124.     &>h3 a {
  125.       color:@tabFontColor;
  126.       font-size:12px;
  127.       font-family:@tabFont;
  128.       -webkit-transition:@transition;
  129.       transition: @transition;
  130.       -o-transition:@transition;
  131.       -moz-transition:@transition;
  132.     }
  133.     &>h3 a:hover { color:@fontColor2; }
  134.     &>div {
  135.       width:295px;
  136.       height:189px;
  137.       background-color:@bgColor2;
  138.       background-image:@tabImage;
  139.       border:@borderSize @borderStyle @borderColor;
  140.       border-radius:@roundedBorders;
  141.       color:@fontColor;
  142.       font-family:@font;
  143.       font-size:@fontSize;
  144.       line-height:11px;
  145.       position:absolute;
  146.       overflow:hidden;
  147.       top:108px;
  148.       left:1px;
  149.       padding-left:3px;
  150.       padding-right:3px;
  151.     }
  152. }
  153.  
  154. .text .panel, .panel .panel { box-shadow:none; border-radius:0px; border:1px solid @borderColor;
  155.   &>h3 { background-color:@bgColor2; background-image:none; color:@fontColor; line-height:initial; border:1px solid transparent; border-radius:0px; position:initial; width:initial; margin-top:0px; box-shadow:none; transition:none; }
  156.   &>h3:hover { border:1px solid transparent; padding:none; background-color:@bgColor2; }
  157.   &>h3 span, &>h3 a { color:@fontColor; font-family:@font; font-weight:normal; text-align:left; transition:none; }
  158.   &>h3 span:hover, &>h3 a:hover { color:@fontColor; }
  159.   &>div { background-color:@tabBgColor; background-image:none; border:initial; color:@fontColor; margin-top:0px; height:initial; width:initial; overflow:initial; z-index:initial; position:initial; top:initial; }
  160. }
  161.  
  162. .text .panel>h3:nth-child(1n), .panel .panel>h3:nth-child(1n) { margin:0px; }
  163.  
  164. .text {
  165.   width:295px;
  166.   height:195px;
  167.   background-color:@bgColor2;
  168.   background-image:@tabImage;
  169.   border:@borderSize @borderStyle @borderColor;
  170.   border-radius:@roundedBorders;
  171.   color:@fontColor;
  172.   font-family:@font;
  173.   font-size:@fontSize;
  174.   line-height:@lineHeight;
  175.   position:absolute;
  176.   overflow:hidden;
  177.   top:108px;
  178.   left:@marginLeft;
  179.   padding-left:3px;
  180.   padding-right:3px;
  181.   padding-top:2px;
  182. }
  183.  
  184. .cr {
  185.   position:absolute;
  186.   line-height:10px;
  187.   font-family:@tabFont;
  188.   font-size:@fontSize;
  189.   color:@fontColor;
  190.   background-color:@bgColor2;
  191.   top:@marginTop1;
  192.   padding-left:@marginLeft;
  193.   &>a { color:inherit; }
  194. }
  195.  
  196. .expbar { background-color:@bgColor2; border-color:@borderColor; color:@fontColor;
  197.   &>span { font-weight:normal; }
  198.   &>div { background-color:@bgColor1; border-color:@borderColor; }
  199. }
  200.  
  201. .panel h3>a>svg { display:none; }
  202. [/style]
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