User:HashJona/common.css: Difference between revisions
From Growtopia Wiki
More actions
mNo edit summary |
mNo edit summary |
||
| Line 19: | Line 19: | ||
} | } | ||
/* Make the slideshow fill its container and stop floating */ | |||
.mainpage .gtw-slider .wiki-slideshow, | .mainpage .gtw-slider .wiki-slideshow, | ||
.mainpage .gtw-slider . | .mainpage .gtw-slider .wikia-gallery-slideshow, | ||
.mainpage .gtw-slider .mw-gallery-slideshow { | |||
width: 100%; | width: 100%; | ||
max-width: 100%; | max-width: 100%; | ||
float: none; | |||
margin: 0 auto; | margin: 0 auto; | ||
} | } | ||
.mainpage .gtw-slider . | |||
.mainpage .gtw-slider . | /* Force a banner-like aspect ratio; height derives from width */ | ||
. | .mainpage .gtw-slider .mw-gallery-slideshow .mw-gallery-slideshow-img-container { | ||
aspect-ratio: 1340 / 348; /* adjust to taste */ | |||
height: auto; /* beat inline heights */ | |||
} | |||
/* Make the image fill that box cleanly */ | |||
.mainpage .gtw-slider .mw-gallery-slideshow .mw-gallery-slideshow-img-container img { | |||
width: 100%; | width: 100%; | ||
height: | height: 100%; | ||
object-fit: cover; /* use 'contain' if you don't want cropping */ | |||
display: block; | display: block; | ||
} | } | ||
Revision as of 12:47, 1 September 2025
.mainpage .gtw-slider {
margin-bottom: 10px;
}
.mainpage .gtw-slider .fandom-slider {
max-width: 100%;
aspect-ratio: 1340 / 348;
height: auto;
border: none;
}
.mainpage .gtw-slider .fandom-slider .gallerybox {
display: block;
}
.mainpage .gtw-slider .fandom-slider .gallerybox img {
width: 100%;
height: auto;
}
.mainpage .gtw-slider .fandom-slider .fandom-slider__nav__thumbs {
display: none;
}
/* Make the slideshow fill its container and stop floating */
.mainpage .gtw-slider .wiki-slideshow,
.mainpage .gtw-slider .wikia-gallery-slideshow,
.mainpage .gtw-slider .mw-gallery-slideshow {
width: 100%;
max-width: 100%;
float: none;
margin: 0 auto;
}
/* Force a banner-like aspect ratio; height derives from width */
.mainpage .gtw-slider .mw-gallery-slideshow .mw-gallery-slideshow-img-container {
aspect-ratio: 1340 / 348; /* adjust to taste */
height: auto; /* beat inline heights */
}
/* Make the image fill that box cleanly */
.mainpage .gtw-slider .mw-gallery-slideshow .mw-gallery-slideshow-img-container img {
width: 100%;
height: 100%;
object-fit: cover; /* use 'contain' if you don't want cropping */
display: block;
}