Difference between revisions of "MediaWiki:Common.css"

Latest revision as of 14:11, 7 June 2024

/* CSS placed here will be applied to all skins */

/* CATEGORY LINK START
 * Created by http://mediawiki.org/User:Kyle_van_der_meer
 * Used for Version 2 for non-table layout.
 */
.category_link{
        v-align:top;
        display:inline-block; 
        width:144px;           /*Default width part 2*/
}
 
.category_link a{
        border:1px solid #333; /*Default dark color*/
        color:#fff;            /*Default Light color*/
        background-color:#333; /*Default dark color*/
        padding:2px;
        line-height:1;
        display:block;
}
 
.category_link a:hover{
        border:1px solid #333; /*Default dark color*/
        color:#333;            /*Default dark color*/
        background-color:#eee; /*Default light color*/
}
/*CATEGORY LINK END*/


/* CATEGORY TREE START */

#main-page-categories {
    margin: 0.75em;
}
#main-page-categories .CategoryTreeTag {
    -webkit-column-width: 15em;
    -moz-column-width: 15em;
    -ms-column-width: 15em;
    column-width: 15em;
    -webkit-column-gap: 2em;
    -moz-column-gap: 2em;
    -ms-column-gap: 2em;
    column-gap: 2em;
}
#main-page-categories .CategoryTreeBullet,
#main-page-categories .CategoryTreeEmptyBullet {
    display: none;
}
#main-page-categories .CategoryTreeItem {
    padding-left: 0.75em;
    text-indent: -0.75em;
    display: inline-block;
}

/* CATEGORY TREE END */


/* MESSAGE BOX START */

.message-box {
    padding: 1.2rem 0.8rem !important;
    margin: 10px 0;
    background-color: rgba(0, 0, 0, 0.1);
    text-align: left;
}

figure.message-box {
    display: grid;
    grid-template-columns: min-content 1fr;
}

figure.message-box figcaption {
    grid-column: 2;
    grid-row: 1;
    text-align: left;
    font-weight: bold;
    font-size: 1.12em;
}
figure.message-box p {
    grid-column: 2;
    grid-row: 2;
    text-align: left;
    vertical-align: middle;
    margin: auto 0 !important;
}
figure.message-box p.standalone {
    grid-row: 1 / 3;
}

.message-box:before {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome;
    font-style: normal;
    font-weight: 900;
    font-size: 2em;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin: auto 0.4em auto 0.2em;
    text-align: center;
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
    grid-column: 1;
    grid-row: 1 / 3;
}
.info-box:before {
    color: #00529B;
    content: "\f05a";
}
.warning-box:before {
    color: #9A6324;
    content: "\f071";
}
.todo-box:before {
    color: #4363d8;
    content: "\f46c";
}
.stop-box:before {
    color: #E6194B;
    content: "\f057";
    font-size: 3em;
}
.info-box {
    background-color: rgba(0, 173, 255, 0.1);
}
.warning-box {
    background-color: rgba(254, 204, 0, 0.2);
}
.todo-box {
    background-color: rgba(0, 130, 200, 0.2);
}
.stop-box {
    background-color: rgba(230, 25, 75, 0.2);
}
figure.stop-box figcaption {
    font-size: 1.25em;
}

/* MESSAGE BOX END */