Single post in Site Skins: How-To, and Helpful CSS
Forum Index > PokéFarm > Guides > Site Skins: How-To, and Helpful CSS >
hello! this is my first time trying to implement some of this css, and im not sure if i did it wrong but it doesnt seem to be working :(
i have pasted in the codes that change the notification image, that align the shelter to a grid, and that show if special pokemon are in the shelter
the notification image code works!!! the shelter gridding does not. the shelter notifier worked once for telling me a tyrunt is a prehistoric pokemon, but when i pasted in the grid code, it stopped working. any help is appreciated!!!
code
#head-social > #notifs > a {
background-image: url('https://cdn.discordapp.com/attachments/589962536833646598/613942141693198350/wegee.png');
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
#head-social > #notifs > a > img {
opacity: 0;
}
#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;
}
#shelterarea {
min-height: 350px;
display: flex;
flex-direction:row;
flex-flow: row wrap;
display: grid;
grid-template-columns: repeat(6, 1fr);
grid-template-rows: repeat(5, 70px);
}
.mq2 #shelterarea {
min-height: 175px;
grid-template-rows: repeat(5, 35px);
}
#shelterarea .tooltip_content {
position: absolute;
bottom: 0;
transform: translate(0, 100%);
}
#shelterpage #shelter #shelterarea > .pokemon {
position: static;
flex: 1 1 16%;
display: inline-block;
display: inline-flex;
justify-content: center;
align-items: center;
}
#shelterpage #shelter #shelterarea:before {
display: none;
}