Module:Message box/cmbox.css: Difference between revisions
m 1 revision imported: message box templates |
m 1 revision imported: box update |
||
| (One intermediate revision by one other user not shown) | |||
| Line 1: | Line 1: | ||
/* {{ | /** | ||
.cmbox { | * {{cmbox}} (category message box) styles | ||
margin: 3px | * | ||
* @source https://www.mediawiki.org/wiki/MediaWiki:Gadget-enwp-boxes.css | |||
* @revision 2021-07-15 | |||
*/ | |||
table.cmbox { | |||
margin: 3px 10%; | |||
border-collapse: collapse; | border-collapse: collapse; | ||
border: 1px solid #a2a9b1; | border: 1px solid var(--border-color-base, #a2a9b1); | ||
/* Default "notice" light blue */ | |||
background-color: var(--background-color-progressive-subtle--hover, #d9e2ff); | |||
color: var(--color-base, #202122); | |||
box-sizing: border-box; | box-sizing: border-box; | ||
} | } | ||
/* An empty narrow cell */ | |||
.cmbox td.mbox-empty-cell { | |||
border: none; | |||
padding: 0; | |||
width: 1px; | |||
.cmbox | |||
. | |||
} | } | ||
.cmbox .mbox-text { | /* The message body cell(s) */ | ||
.cmbox th.mbox-text, | |||
.cmbox td.mbox-text { | |||
border: none; | border: none; | ||
/* | /* 0.9em left/right */ | ||
padding: 0.25em 0.9em; | padding: 0.25em 0.9em; | ||
/* Make all mboxes the same width regardless of text length */ | |||
width: 100%; | width: 100%; | ||
} | } | ||
.cmbox .mbox-image { | /* The left image cell */ | ||
.cmbox td.mbox-image { | |||
/* 0.9em left, 0px right */ | |||
/* @noflip */ | /* @noflip */ | ||
padding: 2px 0 2px 0.9em; | padding: 2px 0 2px 0.9em; | ||
} | } | ||
.cmbox .mbox-imageright { | /* The right image cell */ | ||
.cmbox td.mbox-imageright { | |||
/* 0px left, 0.9em right */ | |||
/* @noflip */ | /* @noflip */ | ||
padding: 2px 0.9em 2px 0; | padding: 2px 0.9em 2px 0; | ||
} | } | ||
/* | table.cmbox-notice { | ||
.cmbox | /* Light blue */ | ||
background-color: var(--background-color-progressive-subtle--hover, #d9e2ff); | |||
} | |||
table.cmbox-speedy { | |||
margin-top: 4px; | |||
margin-bottom: 4px; | |||
/* Red */ | |||
border: 4px solid #b32424; | |||
} | } | ||
.cmbox . | table.cmbox-delete, | ||
table.cmbox-speedy { | |||
/* Pink */ | |||
background-color: var(--background-color-error-subtle--active, #ffc8bd); | |||
} | } | ||
table.cmbox-content { | |||
/* Orange */ | |||
background-color: var(--background-color-error-subtle--hover, #ffdad3); | |||
} | } | ||
/* | table.cmbox-style { | ||
/* Yellow */ | |||
background-color: var(--background-color-warning-subtle, #fdf2d5); | |||
} | |||
table.cmbox-move { | |||
/* Blue */ | |||
background-color: var(--background-color-progressive-subtle--active, #b6d4fb); | |||
} | } | ||
table.cmbox-protection { | |||
/* Gold */ | |||
background-color: var(--background-color-content-removed, #ffe49c); | |||
} | |||
@media screen and ( | @media screen and (max-width: 720px) { | ||
table.cmbox { | |||
margin: 3px auto; | |||
} | |||
} | } | ||