Module:Message box/imbox.css: Difference between revisions
Created page with "→* * {{imbox}} (image message box) styles * * @source https://www.mediawiki.org/wiki/MediaWiki:Gadget-enwp-boxes.css * @revision 2021-07-15: table.imbox { margin: 4px 10%; border-collapse: collapse; →Default "notice" blue: border: 3px solid var(--border-color-progressive, #36c); background-color: var(--background-color-neutral-subtle, #f8f9fa); box-sizing: border-box; } →For imboxes inside imbox-text cells.: .imbox .mbox-text .imbox { /* 0.9 - 0.5..." |
m 1 revision imported |
||
| (2 intermediate revisions by 2 users not shown) | |||
| Line 1: | Line 1: | ||
/ | /* {{pp|small=y}} */ | ||
.imbox { | |||
margin: 4px 0; | |||
border: 3px solid #36c; /* Default "notice" blue */ | |||
background-color: var(--background-color-interactive-subtle, #f8f9fa); | |||
margin: 4px | |||
border | |||
background-color: var(--background-color- | |||
box-sizing: border-box; | box-sizing: border-box; | ||
overflow-x: hidden; | |||
} | } | ||
/* For imboxes inside imbox-text cells. */ | /* For imboxes inside imbox-text cells. */ | ||
.imbox .mbox-text .imbox { | .imbox .mbox-text .imbox { | ||
/* | margin: 0 -0.6em; /* 1 - 0.6 = 0.4em left/right. */ | ||
} | } | ||
/* | .imbox-speedy { | ||
border: 3px solid #b32424; /* Red */ | |||
background-color: #fee7e6; /* Pink */ | |||
} | } | ||
.imbox-delete { | |||
.imbox | border: 3px solid #b32424; /* Red */ | ||
border: | |||
} | } | ||
.imbox-content { | |||
border: 3px solid #f28500; /* Orange */ | |||
.imbox | |||
border: | |||
} | } | ||
.imbox-style { | |||
.imbox | border: 3px solid #fc3; /* Yellow */ | ||
/* | |||
} | } | ||
.imbox-move { | |||
.imbox | border: 3px solid #9932cc; /* Purple */ | ||
/* | |||
} | } | ||
.imbox-protection { | |||
/* | border: 3px solid #a2a9b1; /* Gray-gold */ | ||
} | } | ||
.imbox-license { | |||
border: 3px solid #88a; /* Dark gray */ | |||
} | } | ||
.imbox-featured { | |||
border: 3px solid #cba135; /* Brown-gold */ | |||
border | |||
} | } | ||
.imbox .mbox-text { | |||
padding: 0.35em 1em; | |||
flex: 1 1 100%; | |||
} | } | ||
.imbox .mbox-image, | |||
.imbox .mbox-imageright { | |||
padding: 4px 2px; | |||
text-align: center; | |||
flex: none; | |||
} | } | ||
/* keep synced with each other type of message box as this isn't qualified */ | |||
.mbox-invalid-type { | |||
text-align: center; | |||
} | } | ||
@media (min-width: 480px) { | |||
/* | .imbox:not(.mbox-with-below), | ||
.imbox .mbox-flex { | |||
display: flex; | |||
align-items: center; | |||
} | |||
.imbox .mbox-image { | |||
/* @noflip */ | |||
padding-left: 1em; | |||
} | |||
.imbox .mbox-imageright { | |||
/* @noflip */ | |||
padding-right: 1em; | |||
} | |||
} | |||
@media (min-width: 640px) { | |||
.imbox { | |||
margin: 4px 10%; | |||
} | |||
} | } | ||
@media screen { | |||
html.skin-theme-clientpref-night .imbox-speedy { | |||
background-color: #310402; /* Dark red, same hue/saturation as light */ | |||
} | |||
} | } | ||
@media screen and (prefers-color-scheme: dark) { | |||
html.skin-theme-clientpref-os .imbox-speedy { | |||
background-color: #310402; /* Dark red, same hue/saturation as light */ | |||
} | |||
} | } | ||