Template:Cover: Difference between revisions

Revision as of 20:00, 1 June 2025

Template documentation

Editors can experiment in this template's sandbox (edit \| diff) and testcases (create) pages. Please add categories to the /doc subpage. Subpages of this template.

This template permits the insertion of "spoiler information" with a concealed appearance by default; the user would have to hover their cursor on the chunk of covered text to uncover spoiler content.

{{Cover|The culprit is Gosho Aoyama}}

Results in The culprit is Gosho Aoyama Template:Css

@@ Line 1: / Line 1: @@
-<includeonly><input type="checkbox" id="btnControl"/><label class="spoilerText" for="btnControl">{{{1}}}</label></includeonly>
+<includeonly><span class="cover">{{{1}}}</span></includeonly>
 {{css|
-#btnControl {
+.cover, .cover a, a .cover, .cover a.new {
-        display: none;
+  background-color: #e6e6e6;
+  color: #e6e6e6;
+  text-shadow: none;
+  transition: color 0.2s linear, background-color 0.2s linear;
 }
+.cover:hover, .cover:active,
-.spoilerText {
+.cover:hover .cover, .cover:active .cover {
-    height: 1em;
+  color: black !important;
-    background: #909199;
+  background-color: transparent !important;
-    color: #909199;
-    display: inline;
-    text-align: center;
 }
+.cover:hover a, a:hover .cover,
-.spoilerText:hover {
+.cover:active a, a:active .cover {
-    background: #70717a;
+  color: blue !important;
-    color: #70717a;
+  background-color: transparent !important;
-    transition: 0.1s;
 }
+.cover:hover .new, .cover .new:hover, .new:hover .cover,
-#btnControl:checked + label {
+.cover:active .new, .cover .new:active, .new:active .cover {
-    background: #e3e3e5;
+  color: #BA0000 !important;
-    color: #000;
+  background-color: transparent !important;
-    transition: 0.15s;
 }
-}}
+}}<noinclude>{{Documentation}}
-<noinclude>{{Documentation}}
 This template permits the insertion of "spoiler information" with a concealed appearance by default; '''the user would have to hover their cursor on the chunk of covered text to uncover spoiler content'''.