Template:Mbox/doc

From Support Wiki
Jump to navigation Jump to search

Mbox is a wiki template that helps fine-tune the Sitenotice giving it colors and various additions.

Manual

Template name: Mbox

<includeonly>{{#invoke:Mbox|main|imagewidth={{{imagewidth|45px}}}}}</includeonly><noinclude>This template is used to create article/section notice templates like [[:Template:Stub]] or [[:Template:Cleanup]].

==Boilerplate==
<pre><nowiki>
{{Mbox
| header      = 
| text        = 
| comment     = 
| image       = 
| imagewidth  = 
| type        = 
| bordercolor = 
}}</nowiki></pre>

Adopted from https://acecombat.wiki.gg/wiki/Template:Mbox

==Variables==
;header: The header of the message box, presented in bold on the top line.
;text: The text of the message box, presented below the header.
;comment: Smaller text placed below the normal text. This is optional.
;image: A small image placed to the left of the box's text.
;imagewidth: The width of the image, default at 45px. The height will automatically adjust.
;type: This sets the color of the left border between some preset options:
:;moderate: Orange border color, used for medium-priority messages
:;important: Red border color, used for high-priority messages
:;info: Blue border color, used for informational messages
;bordercolor: Overrides '''type''' and sets a custom left border color.

[[Category:Templates]]</noinclude>

MediaWiki name: Common.css

:root {
  --theme-text-color: #000;
  --theme-link-color: #dc5548;
  --theme-red-link-color: #ba0000;
  --theme-header-color: #840b0b;
  --theme-body-color: rgb(255,248,246, 95%);
  
  --theme-alert-color: #FE6675;
  --theme-alert-color--rgb:254,102,117;
  --theme-alert-label-color: #373030;
  --theme-warning-color: #cf721c;
  --theme-warning-color--rgb: 207,114,28;
  --theme-success-color: #10B13A;
  --theme-success-color--rgb:16,177,58;
  --theme-success-label-color: #373030;
}

/********************
* [[Template:Mbox]] *
Adopted from https://acecombat.wiki.gg/wiki/Template:Mbox
*********************/
.mbox {
	display: flex;
	position: relative;
	background-color: var(--theme-body-color);
	border: 1px solid var(--theme-link-color);
	border-left-width: 8px;
	margin-bottom: 5px;
	min-height: 32px;
}
.mbox-type-success {
	border-color: var(--theme-success-color);
}
.mbox-type-info {
	border-color: var(--theme-accent-color--hover);
}
.mbox-type-moderate {
	border-color: var(--theme-warning-color);
}
.mbox-type-important {
	border-color: var(--theme-alert-color);
}
.mbox__content {
	display: table;
	box-sizing: border-box;
	width: 100%;
	padding: 8px 15px;
}
.mbox__content__image {
	display: table-cell;
	width: 45px;
	height: 100%;
	text-align: center;
	vertical-align: middle;
	padding-right: 15px;
	font-size: 2.5em;
	line-height: 1;
}
.mbox__content__image .icon-filter {
	filter: var(--wiki-icon-general-filter);
}
.mbox__content__wrapper {
	display: table-cell;
	vertical-align: middle;
}
.mbox__content__header {
	display: block;
	font-weight: bold;
}
.mbox__content__text {
	display: block;
}
.mbox__content__text__comment {
	font-size: small;
}
.mbox__content__aside {
	display: table-cell;
	width: 100px;
	vertical-align: middle;
	text-align: center;
	padding-left: 15px;
	border-left: 1px solid var(--theme-link-color);
}
.mbox__close {
	position: absolute;
	right: 0;
	top: 0;
	padding: 2px 7px;
	font-weight: bold;
	font-size: 16px;
	color: var(--theme-text-color);
	cursor: pointer;
	transition: all .15s ease-in;
}
.mbox__close:hover {
	color: var(--theme-link-color);
}
.mbox__close:after {
	content: '×';
}
.mw-collapsed + .mbox__close {
	transform: rotate(45deg);
	padding: 4px 7px 5px 2px;
}
.mbox__content__image.fandom-icons {
	font-size: 2em;
}
#siteNotice .mbox {
	line-height: 1.4;
}
#siteNotice .mbox__close {
	display: none;
}
.sitedir-ltr .mw-dismissable-notice-body,
.sitedir-rtl .mw-dismissable-notice-body {
	clear: both;
	margin: 0;
}
/***********
* End Mbox *
************/

MediaWiki name: Sitenotice

{{Mbox
| header      = Welcome to the WIKI_NAME Wiki!
| text        = Insert any text, announcements or on-going events here
| comment     = Note: Support the wiki by downloading the [https://wiki.gg/redirect wiki.gg Redirect extension].
| type        = info
| style       = border-left-width:1px
}}

Once this last addition has been added to your wiki, make sure you cache refresh on your browser (Ctrl+F5) on the upload page to see changes.

Optional

Themes

For adjusting the Mbox to your themes automatically it's very easy. Since you added in the root variable to the core Common.css page, you can now just add that same root variable to your one of your custom themes and use by replacing the hex code in --theme-body-color: hex-code.

Questions

Reliability

Mbox doesn't have the best reliability and relies on https://commons.wiki.gg/ wiki. If the platform has a hiccup it can cause error messages like Lua error in package.lua at line 80: module 'Dev:I18n' not found. to fix this you'll need to wait until the hiccup stops then purge all articles that feature this template or convert the Mbox code from using Dev: to code hosted on your wiki.

Example wikis