Single post in Codes and things
Forum Index > PokéFarm > Journals > Codes and things >
BBCode/CSS I've written for myself & others:
Not mine: Auto-update type race code
Show a pkmnpanel platform-style
Up to two icons are shown on the name bar, so for example my Charizard is from PF1 and is mega, but only shiny/male is shown. Everything customizable is at the top as variables: platform/name/berry bg colors, and show/hide options for the held item and berry button.
Future goals: Expand the name link to make the whole area clickable (padding? would need a new element to form the name bg, and need to ensure berry stays clickable). Add exp bar below name (decide if it shares colors with name/platform or gets its own vars). Prevent ready to evolve button from showing for owner.
27% 
MAX 
MAX
Helix Fossil
Fossil
(
: 0)
A fossil from a prehistoric Pokémon that once lived in the sea. It might be a piece of a seashell.
Unsellable
Aspear Berry
Aspear Berry (SOUR)
Cheri BerryCheri Berry (SPICY)
Chesto BerryChesto Berry (DRY)
Pecha BerryPecha Berry (SWEET)
Rawst BerryRawst Berry (BITTER)
Likes:
Bitter food
27%Gentle nature
Aspear Berry
Aspear Berry (SOUR)
Cheri BerryCheri Berry (SPICY)
Chesto BerryChesto Berry (DRY)
Pecha BerryPecha Berry (SWEET)
Rawst BerryRawst Berry (BITTER)
Likes:
Dry food
MAXRash nature
Rare Bone
Treasure
(: 0)
A bone that is extremely valuable for Pokémon archaeology. It can be sold for a high price.
Sells for 
5,000
Aspear Berry
Aspear Berry (SOUR)
Cheri BerryCheri Berry (SPICY)
Chesto BerryChesto Berry (DRY)
Pecha BerryPecha Berry (SWEET)
Rawst BerryRawst Berry (BITTER)
Likes:
Any food
MAXQuirky nature
Code
[pkmnpanel=3mc8] [pkmnpanel=Jg30] [pkmnpanel=kv3l9]
[style]
/* These default to the VIEWER's skin colors */
/* To customize them, just set hex color codes instead */
@platform-base: @col-bg1;
@platform-border: @col-border1;
@name-color: @col-fg1;
@name-background: @col-bg3;
@name-border: @col-border3;
@berry-background: @col-flavour-up;
@berry-border: @col-fg1;
/* Set to "block" to show, "none" to hide */
@display-item: block;
@display-berries: block;
.party {
display: inline-block;
&,>div {
padding: 0;
margin: 0;
background: transparent;
width: 120px !important;
height: 120px;
overflow: hidden;
border: none;
border-radius: 0;
box-shadow: none;
}
>div {
&::after {
display: none;
}
.pkmn {
margin: 0 10px;
float: unset;
&::before {
background-color: @platform-base;
border-color: @platform-border;
}
.helditem {
display: @display-item;
.itemsprite {
cursor: unset;
}
.tooltip_content {
display: none;
}
}
}
.name {
background-color: @name-background;
border: 1px solid @name-border;
border-radius: 5px;
margin-top: 1px;
height: 16px;
display: flex;
flex-wrap: nowrap;
a {
color: @name-color;
font-weight: normal;
margin: 0 2px;
width: 80px !important;
flex-grow: 99;
font-size: 12px;
}
img {
display: none;
}
img:nth-last-of-type(-n+2) {
display: inline;
margin: 0;
}
}
.action {
display: @display-berries;
position: absolute;
left: 88px;
top: 70px;
height: unset;
width: unset;
.berrybuttons[data-up="any"]>a[data-berry="aspear"],
.berrybuttons[data-up="sour"]>a[data-berry="aspear"],
.berrybuttons[data-up="spicy"]>a[data-berry="cheri"],
.berrybuttons[data-up="dry"]>a[data-berry="chesto"],
.berrybuttons[data-up="sweet"]>a[data-berry="pecha"],
.berrybuttons[data-up="bitter"]>a[data-berry="rawst"] {
display: inline-block;
}
.berrybuttons {
>a {
display: none;
width: 20px;
height: 20px;
line-height: 20px;
padding: 5px;
background-color: @berry-background;
border-radius: 20px;
>img {
vertical-align: top;
max-height: 20px;
max-width: 20px;
}
}
>a[data-berry="pecha"] img {
/* this berry is short */
margin-top: 1px;
}
}
&.working {
opacity: 0.5;
}
table, a[data-evolve] {
/* "thank you" message and evolve button */
display: none;
}
}
.expbar, .taste, .extra {
display: none;
}
}
>div:hover>.action a[data-berry]:after {
border-color: @berry-border;
}
}
[/style]
Short-form for signatures
[sc=platform-party][pkmnpanel=3mc8][/sc] [sc=platform-party][pkmnpanel=Jg30][/sc] [sc=platform-party][pkmnpanel=kv3l9][/sc]
[style]
/* These default to the VIEWER's skin colors */
/* To customize them, just set hex color codes instead */
@pparty-platform-base: @col-bg1;
@pparty-platform-border: @col-border1;
@pparty-name-color: @col-fg1;
@pparty-name-background: @col-bg3;
@pparty-name-border: @col-border3;
@pparty-berry-background: @col-flavour-up;
@pparty-berry-border: @col-fg1;
/* Set to "block" to show, "none" to hide */
@pparty-display-item: block;
@pparty-display-berries: block;
@import "skins/user/b/7/q/sharedcss/__extra";
[/style]
Compact pkmnpanel
Modify the pkmnpanel code to be a bit more compact, for narrow about mes and to fit on a single line in desktop mode.
27%
27%
Helix Fossil
Fossil
(: 0)
A fossil from a prehistoric Pokémon that once lived in the sea. It might be a piece of a seashell.
Unsellable
Aspear Berry
Aspear Berry (SOUR)
Cheri BerryCheri Berry (SPICY)
Chesto BerryChesto Berry (DRY)
Pecha BerryPecha Berry (SWEET)
Rawst BerryRawst Berry (BITTER)
Likes:
Bitter food
27%Gentle nature
Everstone
Special Evolution Item
(: 0)
A peculiar stone that prevents a Pokémon from evolving when held.
Sells for 250
Aspear Berry
Aspear Berry (SOUR)
Cheri BerryCheri Berry (SPICY)
Chesto BerryChesto Berry (DRY)
Pecha BerryPecha Berry (SWEET)
Rawst BerryRawst Berry (BITTER)
Likes:
Sweet food
27%Timid nature
Code
[pkmnpanel=3mc8][pkmnpanel=hynl1]
[style]
/* These default to the VIEWER's skin colors */
/* To customize them, just set hex color codes instead */
@pkmn-panel-bg: @col-bg3;
@pkmn-border-color: @col-border3;
@pkmn-text-color: @col-fg1;
@pkmn-link-color: @col-link1;
@pkmn-platform-color: @col-bg1;
@pkmn-platform-edge: @col-border1;
@pkmn-berry-color: @col-flavour-up;
@pkmn-xp-done: @col-bg1;
@pkmn-xp-remining: @col-bg3;
@pkmn-xp-text: @col-fg1;
@pkmn-xp-border: @col-border3;
.party {
display: inline-block;
margin: 10px;
width: unset !important;
color: @pkmn-text-color;
a {
color: @pkmn-link-color;
}
>div {
background: @pkmn-panel-bg;
border-color: @pkmn-border-color;
box-shadow: none;
width: 250px;
margin: 0;
overflow: hidden;
&:hover>.action a[data-berry]:after {
color: @pkmn-border-color;
}
>.pkmn:before {
background-color: @pkmn-platform-color;
border-color: @pkmn-platform-edge;
}
>.name a {
margin-bottom: 5px;
max-width: 140px;
}
>.expbar {
width: 140px;
height: 25px;
margin-top: 2px;
background-color: @pkmn-xp-remining;
border-color: @pkmn-xp-border;
color: @pkmn-xp-text;
>div {
border-color: @pkmn-xp-border;
background-color: @pkmn-xp-done;
}
}
>.extra {
>.happy {
display: none;
}
>.nature {
width: 165px;
margin-left: 5px;
}
}
>.action {
width: 140px;
height: 30px;
>.berrybuttons {
>a {
background-color: @pkmn-berry-color;
display: none;
width: 100%;
height: 30px;
padding: 3px;
box-sizing: border-box;
>img {
height: 25px;
vertical-align: top;
}
}
}
>.berrybuttons[data-up="any"]>a[data-berry="aspear"] {
display: inline-block;
border-radius: 20px;
}
>.berrybuttons[data-up="sour"]>a[data-berry="aspear"] {
display: inline-block;
}
>.berrybuttons[data-up="spicy"]>a[data-berry="cheri"] {
display: inline-block;
}
>.berrybuttons[data-up="dry"]>a[data-berry="chesto"] {
display: inline-block;
}
>.berrybuttons[data-up="sweet"]>a[data-berry="pecha"] {
display: inline-block;
}
>.berrybuttons[data-up="bitter"]>a[data-berry="rawst"] {
display: inline-block;
}
}
}
}
[/style]
Short-form for signatures
[sc=compact-party][pkmnpanel=3mc8][/sc] [sc=compact-party][pkmnpanel=hynl1][/sc]
[style]
/* These default to the VIEWER's skin colors */
/* To customize them, just set hex color codes instead */
@cparty-pkmn-panel-bg: @col-bg3;
@cparty-pkmn-border-color: @col-border3;
@cparty-pkmn-text-color: @col-fg1;
@cparty-pkmn-link-color: @col-link1;
@cparty-pkmn-platform-color: @col-bg1;
@cparty-pkmn-platform-edge: @col-border1;
@cparty-pkmn-berry-color: @col-flavour-up;
@cparty-pkmn-xp-done: @col-bg1;
@cparty-pkmn-xp-remining: @col-bg3;
@cparty-pkmn-xp-text: @col-fg1;
@cparty-pkmn-xp-border: @col-border3;
@import "skins/user/b/7/q/sharedcss/__extra";
[/style]
