Jump to content

MediaWiki:Vector-dark.css: Difference between revisions

Line 490: Line 490:
/* Ensure mw-jsslideshow fits inside vector-body */
/* Ensure mw-jsslideshow fits inside vector-body */
.vector-body .mw-jsslideshow {
.vector-body .mw-jsslideshow {
    padding: 0;
    margin: 0 auto;
    overflow: hidden;
    background-color: #002B5C;
    background-color: #002B5C;
    border: 2px solid #FF851B;
    border: 2px solid #FF851B;
    border-radius: 8px;
    border-radius: 8px;
    padding: 10px;
    color: #FFFFFF;
    overflow: hidden;
    box-sizing: border-box;
    margin: 0 auto; /* Just in case the JS doesn't apply it early enough */
}
}
/* Tame the dynamically-generated slideshow div */
.vector-body .mw-jsslideshow .slideshow {
.vector-body .mw-jsslideshow .slideshow {
    width: 100% !important;
    display: flex;
    height: auto !important;
    flex-wrap: nowrap;
    display: flex !important;
    justify-content: center;
    align-items: center; /* Center vertically */
    align-items: center;
    top: 50% !important;
    left: 50% !important;
    overflow: hidden !important;
    box-sizing: border-box;
}
}
/* Each dynamically generated slide (the divs inside slideshow) */
.vector-body .mw-jsslideshow .slideshow div {
.vector-body .mw-jsslideshow .slideshow > div {
    padding: 0;
    flex: 0 0 auto;
    margin: 0;
    box-sizing: border-box;
    display: flex;
    display: flex;
    justify-content: center;
    justify-content: center;
    align-items: center;
    align-items: center;
    width: 100% !important;
    height: auto !important;
    overflow: hidden;
    box-sizing: border-box;
    text-align: center;
}
}
/* Images inside each slide */
.vector-body .mw-jsslideshow .slideshow div img {
.vector-body .mw-jsslideshow .slideshow > div img {
    display: block;
    display: block;
    max-width: 100%;
    max-width: 100%;
    height: auto;
    height: auto;
    object-fit: contain;
    object-fit: contain;
    margin: 0 auto;
    margin: 0; /* Kill any rogue margins */
}
}


/* Optional mobile-friendly tweaks */
/* Optional mobile-friendly tweaks */
@media (max-width: 768px) {
@media (max-width: 768px) {