Single post in Chicken's F2U Templates!
Forum Index > Other > Other Art > Chicken's F2U Templates! >
- ★
- ☆
- 1
- 2
- 3
- 4
- 5
- 6
- 7
Howdy!
This is a tabbed About Me template with some customization options. You can change the background and remove tabs if you wish. Please refer to the list below for more details!
This is a limited height template so make sure you don't put in too much text, as it will cut off.
See the next tab for examples of what things look like in this code, and see the 3rd tab for the changelog!
no i'm not salty i couldnt get sygna suit blue before he went out of rotation.....T_T
Code
[sc=container][sc=bu][sc=tabbed_interface horizontal][ul]
[li]★[/li]
[li]☆[/li]
[/ul][sc=hide][sc=tab-active][/sc][/sc][sc=show][sc=tab][sc=tabbed_interface horizontal][
][ul]
[li]1[/li]
[li]2[/li]
[li]3[/li]
[li]4[/li]
[li]5[/li]
[li]6[/li]
[li]7[/li]
[/ul][
][sc=tab-active]contents 1[/sc][
][sc=tab]contents 2[/sc][
][sc=tab]contents 3[/sc][
][sc=tab]contents 4[/sc][
][sc=tab]contents 5[/sc][
][sc=tab]contents 6[/sc][
][sc=tab]contents 7[/sc][/sc][/sc][/sc][/sc][/sc][/sc][
][sc=credit][pit=credit][url=/forum/thread/322214]F2U code by Gumshoe[/url]
Background is official Pokémon Masters EX art[/pit][/sc][
][style]
@text:white;
@bg:#1c1c1c;
@bg2:#404040;
@link:#cccccc;
@bord:black;
.container {
/* Change the background image here! */
background-image:url("https://i.imgur.com/chmZAWO.png");
background-size:cover;
background-position:center;
height:544px;
width:298px;
padding:5px;
border-radius:8px;
border:1px solid black;
}
.bu {
.tabbed_interface>ul li:nth-child(1) {top:514px;}
.tabbed_interface>ul li:nth-child(2) {top:514px;}
.tabbed_interface>ul {background:none;}
.tabbed_interface>ul>li.tab-active {
display:none;
cursor:pointer;
}
.tabbed_interface>ul li:hover {background:#333333}
.tabbed_interface>ul li {
position:relative;
display:inline;
cursor:pointer;
font-size:15pt;
border-radius:200px;
max-width:30px;
height:30px;
text-align:center;
border:none;
background-color:black;
user-select: none;
color:@text;
display:flex;
align-items: center;
justify-content: center;
z-index:9;
}
.tabbed_interface>div {
animation: .6s fade;
background: none;
color:white;
border-radius:8px;
padding:0px;
box-shadow:none;
border:none
}
}
.hide {display:none;}
.show {
.tabbed_interface>ul li:nth-child(1) {top:0px;}
.tabbed_interface>ul li:nth-child(2) {top:0px;}
.tabbed_interface>ul {
display:flex;
position:relative;
justify-content: space-around;
flex-flow: row wrap;
background:none;
width:260px;
top:485px;
left:36px;
}
.tabbed_interface>ul>li.tab-active {
display:inherit;
cursor:pointer;
color:@text;
background:black;
opacity:100%;
}
.tabbed_interface>ul li:hover {background:black;}
.tabbed_interface>ul li {
position:relative;
cursor:pointer;
font-size:15pt;
border-radius:12px;
max-width:30px;
height:30px;
text-align:center;
border:none;
user-select: none;
opacity:60%;
margin:0px 2px;
}
/* ----------------------------------------------------- */
/* Start of textbox code! */
.tabbed_interface>div {
animation: none;
height:497px;
background: rgba(20,20,20,.85);
color:@text;
a {color:@link; transition:.2s;}
a:hover {color:@text; transition:.2s;}
border-radius:8px;
border:1px solid black;
bottom:58px;
width:286px;
position:relative;
overflow:hidden;
padding:5px;
/* Change the font-size code here! */
font-size:11.5pt;
/* Place the font-family code here! */
.tabbed_interface>ul {
position:relative;
background:none;
width:inherit;
top:inherit;
left:inherit;
margin:0px -2px;
}
.tabbed_interface>ul>li.tab-active {
display:inherit;
position:inherit;
opacity:100%;
background:@bg;
color:@text;
}
.tabbed_interface>ul li {
font-size:inherit;
border-radius:6px;
max-width:inherit;
height:inherit;
border:1px solid @bord;
user-select: none;
margin:2px;
opacity:100%;
background:@bg2;
color:#d6d6d6;
}
.tabbed_interface>div {
margin-top:2px;
height:inherit;
width:inherit;
background:@bg;
border-radius:6px;
box-shadow:none;
border:1px solid black;
top:inherit;
position:inherit;
overflow:hidden;}
.panel {
background: @bg;
border: solid 1px @bord;
color: @text;
box-shadow:none;
> h3 {
> a {color: @text;}
font-size:100%;
border: solid 1px @bord;
background: @bg2;
color: @text;
text-align:center;
cursor:default;
}
> div {color: @text;}
}
.expbar {
background: @bg;
color: @text;
border: solid 1px @bord;
cursor:default;
> div {
background: @bg2;
border-right: solid 1px @bord;
}
}
div.tooltip_content {
background: @bg;
color: @text;
border: solid 1px @bord;
}
.bbcode_tooltip {
border-bottom: 1px dotted @text;
}
table {
border: solid 1px @bord;
}
table th {
border: solid 1px @bord;
color: @text;
background: @bg2;
}
table td {
border: solid 1px @bord;
background: @bg;
color: @text;
}
.party > div {
background: @bg;
color: @text;
border: 1px solid @bord;
box-shadow: none;
.action a[data-berry]:after {border: none;}
width:92.5%;
margin-left: 0px;
}
.party > div > .name {
position:absolute;
right:0px;
top:-3px;
letter-spacing:.5px;
}
.party > div > .action {
position: absolute;
right:1px;
bottom:30px;
}
.party > div > .extra > .nature {
position: absolute;
right:-10px;
bottom:5px;
}
.party > div > .expbar {
width:150px;
position:absolute;
top:15px;
right:10px;
}
hr {border-color: @bg;}
/* End of textbox code! */
/* ----------------------------------------------------- */
}
}
.credit {text-align:right;font-size:10pt;user-select: none;
div.tooltip_content {
bottom:15px;
right:0px;
width:250px;
font-size:10pt;
padding: 4px;
}
.bbcode_tooltip {border-bottom: none;}
}
[/style]
link. bold. italics. underline. tips.
MAX
This is a tip!
This is a hidebox
This is content inside a hidebox!
This is a display.
This text is being displayed.
- tab 1
- 2
- 3
this text is in a tab box
contents 2
contents 3
| Header 1 | Header 2 | Header 3 |
|---|---|---|
| cell 1 | cell 2 | cell 3 |
Poisonium Z
Z-Crystal
(
: 0)
A crystallised form of Z-Power. It can be used to boost Albino rates for Poison-type Eggs.
Sells for 
1,000
Aspear Berry
Aspear Berry (SOUR)
Cheri BerryCheri Berry (SPICY)
Chesto BerryChesto Berry (DRY)
Pecha BerryPecha Berry (SWEET)
Rawst BerryRawst Berry (BITTER)
Likes:
Sweet food
MAXJolly nature
Changelog:
Nothing yet!
contents 4
contents 5
contents 6
contents 7
credit
F2U code by Gumshoe
Background is official Pokémon Masters EX art
^ Click the star to see the text!
You are permitted to change these aspects of the code:
Do not make any other edits without my permission. This includes changing the numbered tab button text, as they not display correctly if more text is added to them.
Please note that any edits made to the code that do not comply with our Legibility Rules means you are breaking our Site Rules. Please be careful to follow them while making edits.
Edits you can make!
- Changing the background image/color (NOT the textbox color). If you use an image, you must properly credit it and have permission to use it. "From Google" is not proper crediting. Do not use bright saturated colors nor use fast moving/flashing images.
How do I do this?
Look for the section of the code that says: /* Change the background image here! */
Replace the image URLthere with the image you wish the background to be. (Make sure to keep the quotation marks) After you replace the image, update the credit so it is accurate. Please refer to our Art Usage and Crediting thread to make sure the image is properly credited.
If you wish to have a solid color as a background, replace the entire background-image: codewith background:gray; changing "gray" to whatever color you wish it to be. Again, do not choose bright saturated colors like red or cyan.
- Removing tabs.
How do I do this?
Look for this section of the code: [li]1[/li] [li]2[/li] [li]3[/li] [li]4[/li] [li]5[/li] [li]6[/li] [li]7[/li] Each of these lines is a tab. Delete each line from the bottom up to delete the corresponding tab. (For example, if you want to remove 2 tabs so you have a total of 5 tabs, delete [li]6[/li] and [li]7[/li])
- Changing the font-size of the textbox (not credit) anywhere between 10pt-15pt (NOT PX).
How do I do this?
Look for this section of the code: /* Change the font-size code here! */ You can change the number to be anywhere between 10 and 15.
- Changing the font of the textbox (not credit).
- More edits I will allow that I won't explain further for:
Other Edits
- Adjusting the background-position and background-size elements.
- Changing the border-radius value of the container and/or textbox between 0px to 25px.
- Removing the link hover effect (a:hover) or changing the transition timing (transition:).
- Changing the textbox background to be more or fully opaque. Do not make it more transparent.
- Removing the border from the container and/or the textbox.
