Toggle search
Toggle menu
695
730
30
4.6K
The Petit Planet Wiki
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

MediaWiki:MessageBox.css: Difference between revisions

MediaWiki interface page
More actions
Browse history interactively
← Older edit
empty for easy editing
Tag: Blanking
No edit summary
 
(2 intermediate revisions by 2 users not shown)
Line 1: Line 1:
.mbox {
    --type-important: 185, 102, 102;
    --type-moderate: 228, 159, 109;
    --type-minor: 231, 202, 95;


    --stub: 235, 220, 150;        /* softer warm yellow */
    --cbt: 122, 160, 145;        /* muted green-teal */
    --mild: 225, 155, 130;      /* gentle coral */
    --removed: 160, 85, 105;    /* dusty rose-wine */
    --cleanup: 185, 105, 115;    /* muted raspberry */
    --construct: 235, 190, 145;  /* peachy tan */
    --upcoming: 150, 135, 175;  /* soft lavender purple */
    --unofficialtl: 115, 210, 205; /* calm aqua */
    --lua: 135, 150, 220;        /* muted periwinkle */
    --css: 125, 160, 230;        /* softened sky blue */
    --js: 245, 230, 140;        /* pastel golden yellow */
    --sandbox: 185, 215, 205;    /* pale misty mint */
    --names: 190, 225, 225;      /* very light cyan tint */
    --changehistory: 135, 155, 200; /* softened steel blue */
    --opacity: 0.15;
    display: flex;
    position: relative;
    background-color: var(--custom-mbox-bg);
    border: 2px solid var(--background-color-10);
    border-radius: 10px;
    margin-bottom: 5px;
    min-height: 32px;
}
.mbox{
    .mbox-type-important { border-color: var(--type-important); }
    .mbox-type-moderate { border-color: var(--type-moderate); }
    .mbox-type-minor { border-color: var(--type-minor);}
}
.mbox__content {
    display: table;
    box-sizing: border-box;
    width: 100%;
    padding: 8px 15px;
}
.mbox__content__image {
    display: table-cell;
    width: 40px;
    height: 100%;
    text-align: center;
    vertical-align: middle;
    padding-right: 15px;
}
.mbox__content__wrapper {
    display: table-cell;
    vertical-align: middle;
}
.mbox__content__header {
    display: block;
    font-weight: bold;
}
.mbox__content__text {
    display: block;
}
.mbox__content__text__comment {
    font-size: small;
}
.mbox__content__aside {
    display: table-cell;
    width: 100px;
    vertical-align: middle;
    text-align: center;
    padding-left: 15px;
    border-left: 1px solid #d6d6d6;
}
.mbox__close {
    position: absolute;
    right: 0;
    top: 0;
    padding: 2px 7px;
    font-weight: bold;
    font-size: 16px;
    color: var(--page-text-color);
    cursor: pointer;
    transition: all .15s ease-in;
   
    &:hover {
        color: var(--theme-color-9);
    }
   
    &:after {
        content: '×';
    }
}
.mw-collapsed + .mbox__close {
    transform: rotate(45deg);
    padding: 4px 7px 5px 2px;
}
/* Remove accessibility feature for mbox toggle */
.mw-customtoggle-mbox {
    outline: none;
}
/* Styling */
.mbox__content__text {
padding-right: 10px;
}
.mbox__content__aside , .mbox__content__text__comment {
line-height: 18px;
}
/* STUB */
.mbox.stub {
border-color: rgb(var(--stub));
background-color: rgba(var(--stub), var(--opacity));
   
    .mbox__content__aside {
        border-color: rgb(var(--stub));
    }
}
/* CBT CONTENT */
.mbox.CBT {
border-color: rgb(var(--cbt));
background-color: rgba(var(--cbt), var(--opacity));
}
/* CHINA ONLY */
.mbox.chinaonly {
  border-color: rgb(var(--construct));
  background-color: rgba(var(--construct), var(--opacity));
}
/* CLEANUP */
.mbox.cleanup {
border-color: rgb(var(--cleanup));
background-color: rgba(var(--cleanup), var(--opacity));
   
    .mbox__content__aside {
        border-color: rgb(var(--cleanup));
    }
}
.mbox.cleanup-mild {
border-color: rgb(var(--mild));
background-color: rgba(var(--cleanup), var(--opacity));
   
    .mbox__content__aside {
        border-color: rgb(var(--mild));
    }
}
.mbox.cleanup-top {
border-color: rgb(var(--mild));
background-color: rgba(var(--cleanup), var(--opacity));
   
    .mbox__content__aside {
        border-color: rgb(var(--mild));
    }
}
/* REMOVED */
.mbox.removed {
border-color: rgb(var(--removed));
background-color: rgba(var(--removed), var(--opacity));
}
/* SPOILER */
.mbox.spoiler {
border-color: rgb(var(--cleanup));
background-color: rgba(var(--cleanup), var(--opacity));
}
/* UNDER CONSTRUCTION */
.mbox.underconstruction {
border-color: rgb(var(--construct));
background-color: rgba(var(--construct), var(--opacity));
}
.mbox.underconstruction .mbox__content__aside {
border-color: rgb(var(--construct));
}
/* UPCOMING */
.mbox.upcoming {
border-color: rgb(var(--upcoming));
background-color: rgba(var(--upcoming), var(--opacity));
}
/* UNOFFICIAL TL */
.mbox.unofficial-tl {
border-color: rgb(var(--unofficialtl));
background-color: rgba(var(--unofficialtl), var(--opacity));
}
/* LUA */
.mbox.lua {
border-color: rgb(var(--lua));
background-color: rgba(var(--lua), var(--opacity));
}
/* CSS */
.mbox.css {
border-color: rgb(var(--css));
background-color: rgba(var(--css), var(--opacity));
}
/* JS */
.mbox.js {
border-color: rgb(var(--js));
background-color: rgba(var(--js), var(--opacity));
}
/* SANDBOX */
.mbox.sandbox {
border-color: rgb(var(--sandbox));
background-color: rgba(var(--sandbox), var(--opacity));
}
.mbox.sandbox .mbox__content__aside {
    border-color: rgb(var(--sandbox));
}
/* High Risk */
.mbox.highrisk {
border-color: rgb(var(--type-important));
background-color: rgba(var(--type-important), var(--opacity));
}
.mbox.highrisk .mbox__content__aside {
border-color: rgb(var(--type-important));
}
/* NAMEORDER */
.mbox.nameorder {
border-color: rgb(var(--names));
background-color: rgba(var(--names), var(--opacity));
}
/* Change History */
.mbox.changehistory {
border-color: rgb(var(--changehistory));
background-color: rgba(var(--changehistory), var(--opacity));
}
.mbox .mw-broken-media {
    display: inline-flex;
    width: 45px;
    height: 45px;
    background-image: url("https://petitplanet.wiki/images/d/dd/Unknown.png");
    background-size: cover;
    vertical-align: middle;
    font-size: 0;
}
Retrieved from "https://petitplanet.wiki/MediaWiki:MessageBox.css"