add MboxCSS

src/MboxCSS/LICENSE

@@ -0,0 +1,4 @@
+/**
+ * SPDX-License-Identifier: CC-BY-SA-4.0
+ * _addText: '{{Gadget Header|license=CC-BY-SA-4.0}}'
+ */

src/MboxCSS/MboxCSS.less

@@ -0,0 +1,338 @@
+.mbox {
+	display: flex;
+	max-width: 95%;
+	flex-direction: column;
+	place-content: center center;
+	align-items: center;
+	border-width: 1.25px;
+	border-left-width: 0.375em;
+	border-style: solid;
+	border-radius: 0.25em;
+	border-color: #36c;
+	padding: 0.5em 0.5em 0.5em 0;
+	margin: 0.25em auto;
+	background: #def;
+	border-collapse: inherit;
+}
+
+.mbox-body {
+	display: flex;
+	width: 100%;
+	flex-flow: row nowrap;
+	place-content: center space-between;
+	align-items: center;
+}
+
+.mbox-above,
+.mbox-below {
+	margin: auto;
+}
+
+.mbox-above {
+	padding: 0.5em 0.5em 0;
+}
+
+.mbox-below {
+	padding: 0 0.5em 0.5em;
+}
+
+.mbox-text {
+	width: 95%;
+	flex: 1 1 95%;
+	padding: 0.5em;
+	border: 0;
+}
+
+.mbox-image,
+.mbox-imageright {
+	border: 0;
+	flex: 1 0;
+	margin: auto;
+	padding: 1px 0.75em;
+	text-align: center;
+}
+
+.mbox-image img,
+.mbox-imageright img {
+	max-width: 45px;
+	height: auto;
+	text-align: center;
+}
+
+.mbox-empty-cell {
+	width: 1px;
+	padding: 0;
+	border: 0;
+}
+
+.mbox-notice {
+	border-color: #36c;
+	background: #def;
+}
+
+.mbox-speedy,
+.mbox.alert,
+.mbox.red {
+	border-color: #b22;
+	background: #fee;
+}
+
+.mbox-delete,
+.mbox.tawny {
+	border-color: #a97;
+	background: #f0f0d8;
+}
+
+.mbox-content,
+.mbox.orange {
+	border-color: #f28500;
+	background: #fed;
+}
+
+.mbox-style,
+.mbox-rule,
+.mbox.rule,
+.mbox.yellow {
+	border-color: #fc3;
+	background: #ffc;
+}
+
+.mbox-move,
+.mbox.violet,
+.mbox.purple {
+	border-color: #93c;
+	background: #fef;
+}
+
+.mbox-protection,
+.mbox-draft,
+.mbox.gray,
+.mbox.grey {
+	border-color: #606060;
+	background: #eee;
+}
+
+.mbox-featured,
+.mbox.brown {
+	border-color: #cba135;
+	background: #fec;
+}
+
+.mbox-policy,
+.mbox.green {
+	border-color: #181;
+	background: #cfc;
+}
+
+.mbox-guideline,
+.mbox.blue {
+	border-color: #36c;
+	background: #def;
+}
+
+.mbox-license {
+	border-width: 2px;
+	border-color: #999;
+}
+
+.mbox-license,
+.mbox.license-pd {
+	background: #f7f8ff;
+}
+
+.mbox.license-cc {
+	background: #f9f9f9;
+}
+
+.mbox.license-other {
+	background: #ffe;
+}
+
+.mbox.license-free {
+	background: #f3ffee;
+}
+
+.mbox.license-nonfree {
+	background: #fff9f9;
+}
+
+.mbox.license-self {
+	background: #f8f9fa;
+}
+
+.mbox-disambig,
+.mbox-setindex {
+	border-color: #999;
+	background: #fefefe;
+}
+
+.mbox .mbox-text .mbox {
+	border-radius: 0;
+}
+
+.mbox.license-self .mbox-text .mbox {
+	border-width: 1px;
+}
+
+.mbox-inside .mbox {
+	margin: 0.25em;
+}
+
+.compact-mbox .mbox {
+	display: block;
+	width: auto;
+	padding: 0 !important;
+	border-radius: 0.25em;
+	margin: 0 0 0 1.6em !important;
+	background: transparent;
+	border-collapse: collapse;
+}
+
+.compact-mbox .mw-collapsible-content .mbox {
+	display: list-item;
+	border: 0;
+	margin-left: 1em !important;
+	line-height: 1.5em;
+	list-style-type: disc;
+}
+
+body.mediawiki .compact-mbox .mbox-small-left {
+	width: auto;
+	margin: 0;
+	clear: both;
+	font-size: 100%;
+}
+
+.compact-mbox div .mbox-text {
+	margin: 0 !important;
+}
+
+.compact-mbox .mbox-text .mbox-image,
+.compact-mbox .mbox-text .mbox-imageright,
+.compact-mbox .mbox-text .mbox-empty-cell {
+	display: none;
+}
+
+.tmbox {
+	background: #f8eaba;
+}
+
+.mbox-inside .tmbox.mbox-small {
+	font-size: 100%;
+	line-height: 1.5em;
+}
+
+.mediawiki .mbox-inside .tmbox {
+	width: 100%;
+	margin: 2px 0;
+}
+
+.fmbox {
+	border-width: 1.25px;
+	border-style: solid;
+	border-color: #a2a9b1;
+	border-radius: 1em;
+	margin: 0.25em 0;
+	background: #f8f9fa;
+	clear: both;
+}
+
+.fmbox-warning {
+	border-color: #bb7070;
+	background: #ffdbdb;
+}
+
+.fmbox-editnotice {
+	background: fade(#fff, 70%);
+}
+
+.mw-warning-with-logexcerpt,
+.mw-lag-warn-high,
+.mw-cascadeprotectedwarning,
+#mw-protect-cascadeon {
+	padding: 0.5em;
+	border: 1px solid #bb7070;
+	margin: 0.2em 0;
+	background: #ffdbdb;
+	clear: both;
+}
+
+.fmbox-system {
+	padding: 0.25em 0;
+	border-color: #a2a9b1;
+	margin: 0.2em 0;
+	background: #f8f9fa;
+	clear: both;
+}
+
+/* These mbox-small classes must be placed after all other
+	 tmbox etc classes. "body.mediawiki" is so. */
+body.mediawiki .mbox-small {
+	max-width: 320px;
+	margin: 4px 0 4px 1em !important;
+
+	/* For the "small=yes" option. */
+	clear: both;
+	float: right;
+	font-size: 88%;
+	line-height: 1.25em;
+}
+
+body.mediawiki .mbox-small-left {
+	width: 240px;
+
+	/* For the "small=left" option. */
+	margin: 4px 1em 4px 0 !important;
+	border-collapse: collapse;
+	font-size: 88%;
+	line-height: 1.25em;
+}
+
+@media screen and (max-width: 768px) {
+	.mbox,
+	.mbox-small {
+		width: 95%;
+		width: calc(100% - 1em);
+		max-width: 95%;
+		max-width: calc(100% - 1em);
+	}
+
+	.mbox-image img,
+	.mbox-imageright img {
+		max-width: 6vw;
+	}
+
+	.mbox-image {
+		padding: 2px 0 2px 2vw;
+	}
+
+	.mbox-imageright {
+		padding: 2px 2vw 2px 0;
+	}
+
+	.mbox.licensetpl .mbox-image,
+	.mbox.licensetpl .mbox-imageright {
+		display: none;
+	}
+
+	.mbox-text {
+		flex: 1 1 90vw;
+		padding: 1vh 2vw;
+	}
+}
+
+@media screen and (max-width: 480px) {
+	.mbox-small {
+		width: 100%;
+		margin: 0.25em auto !important;
+		float: none;
+	}
+}
+
+.permissions-errors {
+	border: 1px solid #a2a9b1;
+}
+
+.permissions-errors .fmbox {
+	border: 0;
+}

src/MboxCSS/definition.json

@@ -0,0 +1,6 @@
+{
+	"enable": true,
+	"description": "<sup><abbr title=\"默认为所有用户启用\">D</abbr></sup><span id=\"Gadget-MboxCSS\"></span> {{tl|Mbox}}系列模板样式表",
+	"default": true,
+	"hidden": true
+}