Site Skins: How-To, and Helpful CSS
Forum Index > PokéFarm > Guides >
QUOTE originally posted by 1Christinem
Sorry if this has already been asked
For the code that auto centers the pokemon after clicking a berry is there a way to modify it so it centers them before you click a berry? I dont like how they slide into place and would like them there automatically.
Try this one
#field_field[data-mode="public"]>div.field>.fieldmon {
margin:0!important;
transform:translate(-50%, -50%)!important;
left:50%!important;
top:50%!important;
img {
animation:none!important;
padding:@padding!important;
}
}
#field_berries {
position:relative;
z-index:12;
}
#field_nav button[data-action=next], #field_nav button[data-action=previous], #field_nav button[data-action=jump] {
position:relative;
z-index:10;
}
#field_party {
position:relative;
z-index: 11;
}
For my shop click here
QUOTE originally posted by dracojax
QUOTE originally posted by MariNee
Hi! I know there's a CSS to stack Pokémon in fields, but is there one that aligns them to a grid?
Code
/* sets field size and aligns 8x5 */
#field_field>div.field {min-height: 345px;display: flex;flex-flow: row wrap;display: grid;grid-template-columns: repeat(8, 12.5%);grid-template-rows: repeat(5, 69px);}
/* sets phone field size to prevent double size */
.mq25 #field_field>div.field {min-height: 180px; grid-template-rows: repeat(5, 36px);}
/* keeps field size and offsets pokes to right starting point */
#field_field>div.field>.fieldmon {margin:0!important;position: static;flex: 1 1 12.5%;display: inline-flex;justify-content: center;align-items: center;}
/* stops field size from doubling and all pokes going to bottom half*/
#field_field>div.field {padding-top: 0%;}
/* changes some images size if too big, but stops them from making field grow */
#field_field>div.field>.fieldmon>img {max-width:75px;max-height:70px;}
I'm so sorry to ask this because I know someone has to have answered this at some point, but where do you put the code?
I can't seem to find the answer, and I don't know if I just keep scrolling over it or what?
Thank you!
┌──────┐
I'm Ray.
♪ ♪ ♪ ♪ ♪
└──────┘
QUOTE originally posted by 2004
I'm so sorry to ask this because I know someone has to have answered this at some point, but where do you put the code?
I can't seem to find the answer, and I don't know if I just keep scrolling over it or what?
Thank you!
It notifies you automatically, then all you have to do is find the special Pokémon ^^
🍔 The Sandwich Shop! (S/A & Boxes) 🍔
(^Currently inactive^) Avatar drawn for me by DuchessLunaire ♥ Collecting Eclipse FlutesThank you!
I've been wondering for a bit, but is it possible to use CSS to block specific notifs from appearing? I want to block everything from the supplier bc the notif is annoying me, but due to reasons I'm ignoring the eggs.
Alright I have a couple of questions, One is really old and was never truly answered and another is one i cant remember if i asked or not. I will start with the more simple of the two
I know there is a code that allows you to put multiple Progress bars side by side (where they are not under one another), But is there a way to do this with hide boxes? If so how would I go about that.
And is there a way to change and replace the trainer sprite image with something else in your site skin? cause as far as I am aware this was never answered.
Check out my Shops
Avatar was made by StinkyBinky here on PFQ
Does anybody know of a CSS that turns one kind of minispirte into another when hovered, ie. a Spectral Leiomano into a Marshadow when hovered over? I can see this not going well with mobile users if not coded correctly, but I can see this being useful for a bunch of Type Race Skins I made
Speaking of minisprites, is there a code, similar to the Type Race Egg Highlight codes, but for Summon Item minisprites?
Current Type Race Score: 0
Even if I'm offline for an extended period of time, that does not mean I lose intrest.70% of the world thinks Warrior Cats is stupid. 25% say: "Who cares?". Repost if you are part of that 5% that would take a hard cover copy of Warrior Cats and slap the other people saying: "STARCLAN IS OUT FOR REVENGE!”
Avatar is by me
Please visit the Vivillon Breeders' Directory to see which users hatch which Vivillon Pattern, or the Maravol Breeders' Directory for the Maravol patterns. Consider joining the Mythbusters PFQ Division! My Hero Academia: Wider World is looking for peospective students! I've tried to do this myself by tinkering around with the CSS in the original post, but it seems as if something I'm doing is wrong.
I am trying to get the following into one site skin
I'm worried that maybe I am trying to do too many with one skin. Is that the case?
This is the code I'm using. It has animation, but the padding isn't changed.
:D
Hide disliked berry in party
Special Pokémon in Shelter
Stack in center (without needing to click berry)(public fields only)
Larger padding, like in the stack per berry example
I want the animations to be there, I like when they jump
code
#shelterarea .pokemon+.tooltip_content {
display:block;
visibility:hidden
}
#shelterarea .pokemon.lock+.tooltip_content, #shelterarea .pokemon:hover+.tooltip_content {
visibility:visible;
}
#shelterarea:not(.selected) .pokemon+.tooltip_content img:not([src*=gender]) {
visibility:visible;
float:left;
transform:scale(15);
opacity:.75;
transform-origin:bottom left;
-ms-interpolation-mode:nearest-neighbor;
image-rendering:-moz-crisp-edges;
image-rendering:pixelated;
touch-action:none;
pointer-events:none;
}
.party>div>.action>.berrybuttons {
text-align:center;
}
.party>div>.action>.berrybuttons[data-up='sour']>[data-berry='aspear'], .party>div>.action>.berrybuttons[data-up='spicy']>[data-berry='cheri'], .party>div>.action>.berrybuttons[data-up='dry']>[data-berry='chesto'], .party>div>.action>.berrybuttons[data-up='sweet']>[data-berry='pecha'], .party>div>.action>.berrybuttons[data-up='bitter']>[data-berry='rawst'] {
width:100%;
}
.party>div>.action>.berrybuttons:not([data-up='sour'])>[data-berry='aspear'], .party>div>.action>.berrybuttons:not([data-up='spicy'])>[data-berry='cheri'], .party>div>.action>.berrybuttons:not([data-up='dry'])>[data-berry='chesto'], .party>div>.action>.berrybuttons:not([data-up='sweet'])>[data-berry='pecha'], .party>div>.action>.berrybuttons:not([data-up='bitter'])>[data-berry='rawst'] {
display:none;
}
.party>div>.action>.berrybuttons[data-up='any']>[data-berry] {
display:inline-block;
}
@padding: 50px;
#field_field[data-mode="public"]>div.field>.fieldmon {
margin:-@padding!important;
left:45%!important;
top:45%!important;
img {
animation:none!important;
padding:@padding!important;
}
}
#field_berries {
position:relative;
z-index:12;
}
#field_nav button[data-action=next], #field_nav button[data-action=previous], #field_nav button[data-action=jump] {
position:relative;
z-index:10;
}
#field_party {
position:relative;
z-index: 11;
}
Cannot post: Please log in to post