- Welcome to the Kancolle Wiki!
- If you have any questions regarding site content, account registration, etc., please visit the KanColle Wiki Discord
Difference between revisions of "Template:Timer"
Jump to navigation
Jump to search
| Line 1: | Line 1: | ||
| − | <includeonly><div style="{{{style|text-align:center;font-size:18px;font-weight:bold;color:red;margin:0px 0px 10px 0px}}}"> | + | <includeonly><div style="{{{style|text-align:center;font-size:18px;font-weight:bold;color:red;margin:0px 0px 10px 0px}}};{{{extra_style|}}}"> |
<span class="countdown" data-options="no-leading-zeros" data-end="toggle" data-toggle=".{{{class|{{{endClass|countdownComplete1}}}}}}" style="display:none"> | <span class="countdown" data-options="no-leading-zeros" data-end="toggle" data-toggle=".{{{class|{{{endClass|countdownComplete1}}}}}}" style="display:none"> | ||
<span class="countdowndate">{{{time|}}}</span> | <span class="countdowndate">{{{time|}}}</span> | ||
| Line 8: | Line 8: | ||
* <code>time</code> : [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse time] to countdown to, required. | * <code>time</code> : [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse time] to countdown to, required. | ||
* <code>style</code> : custom style, optional. | * <code>style</code> : custom style, optional. | ||
| + | * <code>extra_style</code> : extra style to add to the default style, optional. | ||
* <code>class</code> : specify when multiple timers are used on the page, <code>countdownComplete1</code> by default, e.g., <code>countdownComplete2</code> for a second timer, etc. | * <code>class</code> : specify when multiple timers are used on the page, <code>countdownComplete1</code> by default, e.g., <code>countdownComplete2</code> for a second timer, etc. | ||
* <code>text</code> : optional completion text, <code>Countdown complete!</code> by default. | * <code>text</code> : optional completion text, <code>Countdown complete!</code> by default. | ||
| Line 13: | Line 14: | ||
==Examples== | ==Examples== | ||
<pre> | <pre> | ||
| − | {{Timer|time = January 1 2021 00:00:00 +0900}} | + | {{Timer|time = January 1 2021 00:00:00 +0900|extra_style = text-align:left}} |
</pre> | </pre> | ||
| − | {{Timer|time = January 1 2021 00:00:00 +0900}} | + | {{Timer|time = January 1 2021 00:00:00 +0900|extra_style = text-align:left}} |
<pre> | <pre> | ||
{{Timer | {{Timer | ||
Revision as of 09:14, 1 May 2021
Parameters
time: time to countdown to, required.style: custom style, optional.extra_style: extra style to add to the default style, optional.class: specify when multiple timers are used on the page,countdownComplete1by default, e.g.,countdownComplete2for a second timer, etc.text: optional completion text,Countdown complete!by default.
See MediaWiki:Gadget-Countdown.js for JS implementation details.
Examples
{{Timer|time = January 1 2021 00:00:00 +0900|extra_style = text-align:left}}
{{Timer
|time = January 1 2025 00:00:00 +0900
|style = font-style:italic
|class = countdownComplete2
|text = Not yet.
}}
{{Timer
|time = January 19 2038 12:14:07 +0900
|style = font-weight:bold
|class = countdownComplete2
|text = The time is now!
}}