MediaWiki:Common.css: Difference between revisions

From Commonwealth of Sovereign States
Created page with "CSS placed here will be applied to all skins: Infoboxes (Ripped from Wikipedia): .infobox { border: 1px solid #a2a9b1; color: black; padding: 0.2em; font-size: 88%; line-height: 1.5em; border-spacing: 3px; } @media screen { .infobox { background-color: #f8f9fa; } } @media (max-width: 640px) { .infobox { width: 100%; } .infobox .nowrap { white-space: normal; } } @media (min-width: 640px) { .infobox { @noflip: margin: 0.5em..."
 
No edit summary
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
.infobox {
    background-color: rgb(248, 249, 250);
    border-bottom-color: rgb(162, 169, 177);
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-collapse: collapse;
    border-image-repeat: stretch;
    border-image-source: none;
    border-image-width: 1;
    border-left-color: rgb(162, 169, 177);
    border-left-style: solid;
    border-left-width: 1px;
    border-right-color: rgb(162, 169, 177);
    border-right-style: solid;
    border-right-width: 1px;
    border-top-color: rgb(162, 169, 177);
    border-top-style: solid;
    border-top-width: 1px;
    box-sizing: border-box;
    clear: right;
    color: rgb(0, 0, 0);
    direction: ltr;
    display: table;
    float: right;
    font-family: sans-serif;
    font-size: medium;
    min-width: 300px;
    max-width: 300px;
}


/* Infoboxes (Ripped from Wikipedia)*/
.infobox th {
.infobox {
    padding: 10px;
border: 1px solid #a2a9b1;
color: black;
padding: 0.2em;
font-size: 88%;
line-height: 1.5em;
border-spacing: 3px;
}
}


@media screen {
.infobox tr {
.infobox {
    width: 100%;
background-color: #f8f9fa;
    }
}
}


@media (max-width: 640px) {
.infobox .subheader {
.infobox {
    border-collapse: collapse;
width: 100%;
    border-top-color: rgb(162, 169, 177);
}
    border-top-style: solid;
      
    border-top-width: 1px;
.infobox .nowrap {
    color: rgb(0, 0, 0);
white-space: normal;
    direction: ltr;
}
    display: table-cell;
    font-family:sans-serif;
    font-size: small;
    font-weight: 700;
    padding: 8px;
     text-align: center;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: top;
}
}


@media (min-width: 640px) {
.infobox .mergedtoprow {
.infobox {
    border-bottom-color: rgb(162, 169, 177);
/* @noflip */
    border-collapse: collapse;
margin: 0.5em 0 0.5em 1em;
    border-left-color: rgb(162, 169, 177);
/* @noflip */
    border-right-color: rgb(162, 169, 177);
float: right;
    border-top-color: rgb(162, 169, 177);
/* @noflip */
    color: rgb(0, 0, 0);
clear: right;
    direction: ltr;
width: 22em;
    display: table-row;
}
    font-family: sans-serif;
    font-size: small;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: middle;
}
}


.infobox-header,
.mergedtoprow .infoboxlabel {
.infobox-label,
    border-collapse: collapse;
.infobox-above,
    border-top-color: rgb(162, 169, 177);
.infobox-full-data,
    border-top-style: solid;
.infobox-data,
    border-top-width: 1px;
.infobox-below,
    color: rgb(0, 0, 0);
.infobox-subheader,
    direction: ltr;
.infobox-image,
    display: table-cell;
.infobox-navbar,
    font-family: sans-serif;
/* Remove element selector when every .infobox thing is using the standard module/templates  */
    font-size: small;
.infobox th,
    font-weight: 700;
.infobox td {
    padding: 8px;
vertical-align: top;
    text-align: left;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: top;
}
}


.infobox-label,
.mergedtoprow .infoboxdata {
.infobox-data,
    border-collapse: collapse;
/* Remove element selector when every .infobox thing is using the standard module/templates  */
    border-top-color: rgb(162, 169, 177);
.infobox th,
    border-top-style: solid;
.infobox td {
    border-top-width: 1px;
/* @noflip */
    color: rgb(0, 0, 0);
text-align: left;
    direction: ltr;
    display: table-cell;
    font-family: sans-serif;
    font-size: small;
    padding: 8px;
    text-align: left;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: top;
}
}


/* Remove .infobox when element selectors above are removed */
.infoboxdata img {
.infobox .infobox-above,
    display: block;
.infobox .infobox-title,
    margin: auto;
/* Remove element selector when every .infobox thing is using the standard module/templates  */
.infobox caption {
font-size: 125%;
font-weight: bold;
text-align: center;
}
}


.infobox-title,
.infobox .mergedrow {
/* Remove element selector when every .infobox thing is using the standard module/templates  */
    border-bottom-color: rgb(162, 169, 177);
.infobox caption {
    border-collapse: collapse;
padding: 0.2em;
    border-left-color: rgb(162, 169, 177);
    border-right-color: rgb(162, 169, 177);
    border-top-color: rgb(162, 169, 177);
    color: rgb(0, 0, 0);
    direction: ltr;
    display: table-row;
    font-family: sans-serif;
    font-size: small;
    text-indent: 0px;
    unicode-bidi: isolate;
    vertical-align: middle;
}
}


/* Remove .infobox when element selectors above are removed */
.mergedrow .infoboxlabel {
.infobox .infobox-header,
    border-collapse: collapse;
.infobox .infobox-subheader,
    color: rgb(0, 0, 0);
.infobox .infobox-image,
    direction: ltr;
.infobox .infobox-full-data,
    display: table-cell;
.infobox .infobox-below {
    font-family: sans-serif;
text-align: center;
    font-size: small;
    font-weight: 700;
    padding: 2px 8px 8px;
    text-align: left;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: top;
}
}


/* Remove .infobox when element selectors above are removed */
.mergedrow .infoboxdata {
.infobox .infobox-navbar {
    border-collapse: collapse;
/* @noflip */
    color: rgb(0, 0, 0);
text-align: right;
    direction: ltr;
    display: table-cell;
    font-family: sans-serif;
    font-size: small;
    padding: 2px 8px 8px;
    text-align: left;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: top;
}
}

Revision as of 23:15, 6 May 2025

.infobox {
    background-color: rgb(248, 249, 250);
    border-bottom-color: rgb(162, 169, 177);
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-collapse: collapse;
    border-image-repeat: stretch;
    border-image-source: none;
    border-image-width: 1;
    border-left-color: rgb(162, 169, 177);
    border-left-style: solid;
    border-left-width: 1px;
    border-right-color: rgb(162, 169, 177);
    border-right-style: solid;
    border-right-width: 1px;
    border-top-color: rgb(162, 169, 177);
    border-top-style: solid;
    border-top-width: 1px;
    box-sizing: border-box;
    clear: right;
    color: rgb(0, 0, 0);
    direction: ltr;
    display: table;
    float: right;
    font-family: sans-serif;
    font-size: medium;
    min-width: 300px;
    max-width: 300px;
}

.infobox th {
    padding: 10px;
}

.infobox tr {
    width: 100%;
}

.infobox .subheader {
    border-collapse: collapse;
    border-top-color: rgb(162, 169, 177);
    border-top-style: solid;
    border-top-width: 1px;
    color: rgb(0, 0, 0);
    direction: ltr;
    display: table-cell;
    font-family:sans-serif;
    font-size: small;
    font-weight: 700;
    padding: 8px;
    text-align: center;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: top;
}

.infobox .mergedtoprow {
    border-bottom-color: rgb(162, 169, 177);
    border-collapse: collapse;
    border-left-color: rgb(162, 169, 177);
    border-right-color: rgb(162, 169, 177);
    border-top-color: rgb(162, 169, 177);
    color: rgb(0, 0, 0);
    direction: ltr;
    display: table-row;
    font-family: sans-serif;
    font-size: small;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: middle;
}

.mergedtoprow .infoboxlabel {
    border-collapse: collapse;
    border-top-color: rgb(162, 169, 177);
    border-top-style: solid;
    border-top-width: 1px;
    color: rgb(0, 0, 0);
    direction: ltr;
    display: table-cell;
    font-family: sans-serif;
    font-size: small;
    font-weight: 700;
    padding: 8px;
    text-align: left;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: top;
}

.mergedtoprow .infoboxdata {
    border-collapse: collapse;
    border-top-color: rgb(162, 169, 177);
    border-top-style: solid;
    border-top-width: 1px;
    color: rgb(0, 0, 0);
    direction: ltr;
    display: table-cell;
    font-family: sans-serif;
    font-size: small;
    padding: 8px;
    text-align: left;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: top;
}

.infoboxdata img {
    display: block;
    margin: auto;
}

.infobox .mergedrow {
    border-bottom-color: rgb(162, 169, 177);
    border-collapse: collapse;
    border-left-color: rgb(162, 169, 177);
    border-right-color: rgb(162, 169, 177);
    border-top-color: rgb(162, 169, 177);
    color: rgb(0, 0, 0);
    direction: ltr;
    display: table-row;
    font-family: sans-serif;
    font-size: small;
    text-indent: 0px;
    unicode-bidi: isolate;
    vertical-align: middle;
}

.mergedrow .infoboxlabel {
    border-collapse: collapse;
    color: rgb(0, 0, 0);
    direction: ltr;
    display: table-cell;
    font-family: sans-serif;
    font-size: small;
    font-weight: 700;
    padding: 2px 8px 8px;
    text-align: left;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: top;
}

.mergedrow .infoboxdata {
    border-collapse: collapse;
    color: rgb(0, 0, 0);
    direction: ltr;
    display: table-cell;
    font-family: sans-serif;
    font-size: small;
    padding: 2px 8px 8px;
    text-align: left;
    text-indent: 0;
    unicode-bidi: isolate;
    vertical-align: top;
}