Template:Mbox/styles.css: Difference between revisions
Template page
More actions
No edit summary |
No edit summary |
||
| (One intermediate revision by the same user not shown) | |||
| Line 4: | Line 4: | ||
position: relative; | position: relative; | ||
display: flex; | display: flex; | ||
align-items: center; | |||
margin-block: var(--space-md); | margin-block: var(--space-md); | ||
background-color: var(--color-surface-1); | background-color: var(--color-surface-1); | ||
border: var(--border-base); | border: var(--border-base); | ||
border-radius: var(--border-radius- | border-left: 5px solid var(--color-progressive); | ||
border-radius: var(--tg-border-radius-small); | |||
font-size: var(--font-size-small); | font-size: var(--font-size-small); | ||
line-height: var(--line-height-xx-small); | line-height: var(--line-height-xx-small); | ||
| Line 19: | Line 20: | ||
.mbox.mbox-med { | .mbox.mbox-med { | ||
background-color: var(--background-color-warning-subtle); | background-color: var(--background-color-warning-subtle); | ||
} | |||
.mbox-content { | |||
display: flex; | |||
flex-direction: column; | |||
} | } | ||
| Line 27: | Line 33: | ||
.mbox-title { | .mbox-title { | ||
font-weight: var(--font-weight-semi-bold); | |||
font-size: var(--font-size-medium); | |||
} | } | ||
.mbox-icon img { | .mbox-icon img { | ||
display: block; | display: block; | ||
width: var(--font-size- | width: auto; | ||
height: var(--font-size-x-large); | |||
margin-right: var(--space-xs); | margin-right: var(--space-xs); | ||
} | } | ||
.mbox-text { | .mbox-text { | ||
padding-top: 0; | |||
} | } | ||
Latest revision as of 13:47, 2 November 2025
/* Based on https://starcitizen.tools/Module:Mbox/styles.css */
.mbox {
position: relative;
display: flex;
align-items: center;
margin-block: var(--space-md);
background-color: var(--color-surface-1);
border: var(--border-base);
border-left: 5px solid var(--color-progressive);
border-radius: var(--tg-border-radius-small);
font-size: var(--font-size-small);
line-height: var(--line-height-xx-small);
}
.mbox.mbox-high {
background-color: var(--background-color-destructive-subtle);
}
.mbox.mbox-med {
background-color: var(--background-color-warning-subtle);
}
.mbox-content {
display: flex;
flex-direction: column;
}
.mbox-title,
.mbox-text {
padding: var(--space-sm) var(--space-md);
}
.mbox-title {
font-weight: var(--font-weight-semi-bold);
font-size: var(--font-size-medium);
}
.mbox-icon img {
display: block;
width: auto;
height: var(--font-size-x-large);
margin-right: var(--space-xs);
}
.mbox-text {
padding-top: 0;
}