Template: Colored box: Difference between revisions

Revision as of 17:30, 26 May 2022

.mw-tpl-colorbox {

box-sizing: border-box;
margin: 0.5em 0.5em 1em 0.5em;
border-radius: 0.2em;
background: #fff;
box-shadow: 0 0 0.2em #999999;

}

.mw-tpl-colorbox-title {

background: #eaecf0;
color: #000000;
border-radius: 0.2em 0.2em 0 0;
padding: 0.5em 1em 0.5em 1em;

}

.mw-tpl-colorbox-title-icon {

opacity: 0.8;

}

.mw-tpl-colorbox-title-corner {

float: right;
font-size: 0.7em;

}

.mw-tpl-colorbox-content {

padding: 0.5em 1em 0.5em 1em;

}

.mw-tpl-colorbox-content::after { content: ""; display: block; clear: both; }

@@ Line 1: / Line 1: @@
-<div class="mw-tpl-colorbox {{{class|}}}" style="{{#if:{{{background-content-color|}}}| background-color: {{{background-content-color|#fff}}}; }} {{{style|}}}"><templatestyles src="Colored box/style.css"/><!--
+.mw-tpl-colorbox {
---><div class="mw-tpl-colorbox-title" style="{{#if:{{{background-title-color|}}}|background-color:{{{background-title-color|#eaecf0}}};}}">{{#if:{{{icon|}}}|[[File:{{{icon}}}|20px|class=colorbox-title-icon|link=|alt=]]&#32;}}<strong style="{{#if:{{{title-color|}}}| color: {{{title-color|#000000}}}; }}">{{{title}}}</strong><!--
+ box-sizing: border-box;
--->{{#if:{{{link|}}}|<div class="mw-tpl-colorbox-title-corner">[[{{{link}}}|<span style="{{#if:{{{link-color|{{{title-color|}}}}}}| color: {{{link-color|{{{title-color|}}}}}}; }}">{{{view-text|view}}}</span>]]</div>}}
+ margin: 0.5em 0.5em 1em 0.5em;
-</div><!--
+ border-radius: 0.2em;
---><div class="mw-tpl-colorbox-content">
+ background: #fff;
-{{{content}}}
+ box-shadow: 0 0 0.2em #999999;
-</div>
+}
-</div><noinclude>
-{{documentation}}
+.mw-tpl-colorbox-title {
-</noinclude>
+ background: #eaecf0;
+ color: #000000;
+ border-radius: 0.2em 0.2em 0 0;
+ padding: 0.5em 1em 0.5em 1em;
+}
+.mw-tpl-colorbox-title-icon {
+ opacity: 0.8;
+}
+.mw-tpl-colorbox-title-corner {
+ float: right;
+ font-size: 0.7em;
+}
+.mw-tpl-colorbox-content {
+ padding: 0.5em 1em 0.5em 1em;
+}
+.mw-tpl-colorbox-content::after {
+	content: "";
+	display: block;
+	clear: both;
+}