MediaWiki:Mobile.css: Difference between revisions

From Spacewalk Wiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(6 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* All CSS here will be loaded for users of the mobile site */
/* All CSS here will be loaded for users of the mobile site */
/* Infobox Mobile Responsive CSS */
.infobox-wrapper {
    float: none !important;
    clear: both !important;
    width: 100% !important;
    margin: 1em 0 !important;
    box-sizing: border-box !important;
}


@media (max-width: 768px) {
.infobox {
     .infobox-wrapper {
    width: 100% !important;
        float: none !important;
    float: none !important;
        clear: both !important;
    margin: 0 !important;
        width: 100% !important;
     box-sizing: border-box !important;
        margin: 1em 0 !important;
}
        box-sizing: border-box;
 
    }
.infobox img {
    .infobox-wrapper table {
    max-width: 100% !important;
        width: 100% !important;
    height: auto !important;
     }
}
 
.infobox th {
    width: auto !important;
    min-width: 30% !important;
}
 
.infobox td {
    width: auto !important;
}
 
/* Optional: Make infobox stand out more on mobile */
.infobox {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    border-radius: 4px !important;
}
 
.infobox th:first-child {
    border-top-left-radius: 4px !important;
}
 
.infobox th:last-child {
     border-top-right-radius: 4px !important;
}
}

Latest revision as of 11:34, 25 May 2025

/* All CSS here will be loaded for users of the mobile site */
/* Infobox Mobile Responsive CSS */
.infobox-wrapper {
    float: none !important;
    clear: both !important;
    width: 100% !important;
    margin: 1em 0 !important;
    box-sizing: border-box !important;
}

.infobox {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.infobox img {
    max-width: 100% !important;
    height: auto !important;
}

.infobox th {
    width: auto !important;
    min-width: 30% !important;
}

.infobox td {
    width: auto !important;
}

/* Optional: Make infobox stand out more on mobile */
.infobox {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
    border-radius: 4px !important;
}

.infobox th:first-child {
    border-top-left-radius: 4px !important;
}

.infobox th:last-child {
    border-top-right-radius: 4px !important;
}