Template:Msgbox/styles.css: Difference between revisions
Jump to navigation
Jump to search
[unchecked revision] | [unchecked revision] |
Content added Content deleted
mNo edit summary |
mNo edit summary |
||
(11 intermediate revisions by 3 users not shown) | |||
Line 4: | Line 4: | ||
gap: 0.6em; |
gap: 0.6em; |
||
align-items: center; |
align-items: center; |
||
max-width: |
max-width: 90%; |
||
margin: 0 |
margin: 0 auto; |
||
padding: 0.3em 0.6em; |
padding: 0.3em 0.6em; |
||
border-top: 8px solid #36e; |
border-top: 8px solid #36e; |
||
background-color: #f8f9fa; |
background-color: #f8f9fa; |
||
clear: both; |
|||
} |
} |
||
.msgbox. |
.msgbox:not(.msgbox-mini):last-of-type { |
||
margin-bottom: 0.5em; |
|||
⚫ | |||
⚫ | |||
grid-template-columns: max-content 1fr; |
grid-template-columns: max-content 1fr; |
||
} |
} |
||
Line 21: | Line 26: | ||
padding: 0 0.3em; |
padding: 0 0.3em; |
||
max-width: max-content; |
max-width: max-content; |
||
clear: none; |
|||
margin-bottom: 0.5em; |
|||
} |
} |
||
Line 45: | Line 52: | ||
background-color: #cfc; |
background-color: #cfc; |
||
border-color: #5d5; |
border-color: #5d5; |
||
⚫ | |||
⚫ | |||
text-align: left; |
|||
} |
|||
.msgbox-body.align-center { |
|||
text-align: center; |
|||
} |
|||
.msgbox-body.align-right { |
|||
text-align: right; |
|||
} |
} |
||
Latest revision as of 10:34, 15 June 2024
.msgbox {
display: grid;
grid-template-columns: 1fr;
gap: 0.6em;
align-items: center;
max-width: 90%;
margin: 0 auto;
padding: 0.3em 0.6em;
border-top: 8px solid #36e;
background-color: #f8f9fa;
clear: both;
}
.msgbox:not(.msgbox-mini):last-of-type {
margin-bottom: 0.5em;
}
.msgbox.msgbox-image {
grid-template-columns: max-content 1fr;
}
.msgbox.msgbox-mini {
gap: 0.3em;
margin-left: 0;
margin-right: 0;
padding: 0 0.3em;
max-width: max-content;
clear: none;
margin-bottom: 0.5em;
}
@media screen and (max-width: 720px) {
.msgbox {
max-width: 100%;
}
}
.msgbox.msgbox-default,
.msgbox.msgbox-notice {
background-color: #f8f9fa;
border-color: #36e;
}
.msgbox.msgbox-red,
.msgbox.msgbox-warning {
background-color: #fcc;
border-color: #e44;
}
.msgbox.msgbox-green,
.msgbox.msgbox-status {
background-color: #cfc;
border-color: #5d5;
}
.msgbox-text p {
margin: 0;
}