More actions
m Replace hard-coded color with design-token. |
Add option to show an icon on the banner and control the text alignment. |
||
| Line 1: | Line 1: | ||
<div style=" | <div style=" | ||
margin: 1em auto; | display: flex; | ||
border: 1.5px solid {{{border|{{{color|red}}}}}}; | justify-content: space-between; | ||
border-radius: 8px; | column-gap: 0.5em; | ||
padding: 0. | align-items: center; | ||
width: 85%; | margin: 1em auto; | ||
background-color: {{{color|transparent}}}; | border: 1.5px solid {{{border|{{{color|red}}}}}}; | ||
color: {{{text|inherit}}}; | border-radius: 8px; | ||
text-align: center; | padding: 0.5em; | ||
">{{{1|{{Co|var(--color-error)|Content is missing!}}}}}</div> | width: 85%; | ||
<noinclude>{{documentation}}</noinclude> | background-color: {{{color|transparent}}}; | ||
color: {{{text|inherit}}}; | |||
"> | |||
<div> {{#if: {{{icon|}}} |{{{icon}}} }} </div> | |||
<div style=" | |||
flex-basis: 100%; | |||
text-align: {{#if: {{{align|}}} | {{{align}}} | center }}; | |||
"> | |||
{{#if: {{{1|}}} | {{{1}}} | {{Co|var(--color-error)|Content is missing!}} }} </div> | |||
<div> {{#ifeq: {{{icon-both|}}} | yes | {{{icon}}} }} </div> | |||
</div> | |||
<noinclude> | |||
{{documentation}} | |||
</noinclude> | |||