Module:Message box/imbox.css: Difference between revisions

Fixes phab:T369874 via automated script
 
m 1 revision imported
 
(3 intermediate revisions by 2 users not shown)
Line 2: Line 2:
.imbox {
.imbox {
margin: 4px 0;
margin: 4px 0;
border-collapse: collapse;
border: 3px solid #36c;    /* Default "notice" blue */
border: 3px solid #36c;    /* Default "notice" blue */
background-color: var(--background-color-interactive-subtle, #f8f9fa);  
background-color: var(--background-color-interactive-subtle, #f8f9fa);  
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.5em; /* 0.9 - 0.5 = 0.4em left/right. */
margin: 0 -0.6em; /* 1 - 0.6 = 0.4em left/right. */
/* TODO: Still needed? */
display: block; /* Fix for webkit to force 100% width.  */
}
}


Line 49: Line 47:


.imbox .mbox-text {
.imbox .mbox-text {
border: none;
padding: 0.35em 1em;
/* @noflip */
flex: 1 1 100%;
padding: 0.25em 0.9em;
width: 100%;
}
}


.imbox .mbox-image {
.imbox .mbox-image,
border: none;
.imbox .mbox-imageright {
/* @noflip */
padding: 4px 2px;
padding: 2px 0 2px 0.9em;
text-align: center;
text-align: center;
flex: none;
}
}


.imbox .mbox-imageright {
/* keep synced with each other type of message box as this isn't qualified */
border: none;
.mbox-invalid-type {
/* @noflip */
padding: 2px 0.9em 2px 0;
text-align: center;
text-align: center;
}
}


/* An empty narrow cell */
@media (min-width: 480px) {
.imbox .mbox-empty-cell {
.imbox:not(.mbox-with-below),
border: none;
.imbox .mbox-flex {
padding: 0;
display: flex;
width: 1px;
align-items: center;
}
}


.imbox .mbox-invalid-type {
.imbox .mbox-image {
text-align: center;
/* @noflip */
padding-left: 1em;
}
.imbox .mbox-imageright {
/* @noflip */
padding-right: 1em;
}
}
}


@media (min-width: 720px) {
@media (min-width: 640px) {
.imbox {
.imbox {
margin: 4px 10%;
margin: 4px 10%;
}
}
}
}


@media screen {
@media screen {
Line 93: Line 93:
}
}


 
@media screen and (prefers-color-scheme: dark) {
@media screen and ( prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .imbox-speedy {
html.skin-theme-clientpref-os .imbox-speedy {
background-color: #310402; /* Dark red, same hue/saturation as light */
background-color: #310402; /* Dark red, same hue/saturation as light */
}
}
}
}