Template:Checkbox - Revision history

DokkeFyxen at 02:52, 16 November 2024

2024-11-16T02:52:26Z

← Older revision		Revision as of 02:52, 16 November 2024
Line 37:		Line 37:
	'''Note:''' you should put these class names on a separate <code><<nowiki/>span></code> that goes over your elements, because the checkbox changes the <code>style="display:*"</code> attribute and will overwrite if the span already has an existing display attribute.		'''Note:''' you should put these class names on a separate <code><<nowiki/>span></code> that goes over your elements, because the checkbox changes the <code>style="display:*"</code> attribute and will overwrite if the span already has an existing display attribute.
	</noinclude>		</noinclude>

			[[Category:Templates]]

Chunky104: Fixed broken "Tweak_Generic_Button.png" file link

2024-06-22T08:34:53Z

Fixed broken "Tweak_Generic_Button.png" file link

← Older revision		Revision as of 08:34, 22 June 2024
Line 1:		Line 1:
	<includeonly><div id="{{{id\|cb}}}" data-id="checkbox" data-checked="{{{check\|yes}}}" data-hideYes="{{{hideYes\|}}}" data-hideNo="{{{hideNo\|}}}" data-showYes="{{{showYes\|}}}" data-showNo="{{{showNo\|}}}" class="image-{{{color\|black}}}" style="display:inline-flex; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none;"><div style="pointer-events: none; display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:~~Tweak_Generic_Button~~.png\|link=\|30px]]</span><span id="check-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| yes \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png\|link=\|18px]]</span><span id="uncheck-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| no \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png\|link=\|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title\|}}}</div></span></div></div></includeonly><noinclude>		<includeonly><div id="{{{id\|cb}}}" data-id="checkbox" data-checked="{{{check\|yes}}}" data-hideYes="{{{hideYes\|}}}" data-hideNo="{{{hideNo\|}}}" data-showYes="{{{showYes\|}}}" data-showNo="{{{showNo\|}}}" class="image-{{{color\|black}}}" style="display:inline-flex; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none;"><div style="pointer-events: none; display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:UI_Generic_Checkbox.png\|link=\|30px]]</span><span id="check-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| yes \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png\|link=\|18px]]</span><span id="uncheck-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| no \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png\|link=\|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title\|}}}</div></span></div></div></includeonly><noinclude>
	<span style="background:white; padding-top:5px; padding-bottom:6px;">{{checkbox\|color=black\|check=yes\|title=Title1\|id=cb1\|hideYes=1,2,3,4\|hideNo=\|showYes=\|showNo=}}{{checkbox\|color=black\|check=no\|title=Title2\|id=cb2\|hideYes=\|hideNo=\|showYes=\|showNo=}}</span>		<span style="background:white; padding-top:5px; padding-bottom:6px;">{{checkbox\|color=black\|check=yes\|title=Title1\|id=cb1\|hideYes=1,2,3,4\|hideNo=\|showYes=\|showNo=}}{{checkbox\|color=black\|check=no\|title=Title2\|id=cb2\|hideYes=\|hideNo=\|showYes=\|showNo=}}</span>
	<span style="background:black; padding-top:5px; padding-bottom:6px; padding-left:4px;">{{checkbox\|color=white\|check=yes\|title=Title3\|id=cb3\|hideYes=\|hideNo=\|showYes=\|showNo=}}{{checkbox\|color=white\|check=no\|title=Title4\|id=cb4\|hideYes=\|hideNo=\|showYes=\|showNo=}}</span>		<span style="background:black; padding-top:5px; padding-bottom:6px; padding-left:4px;">{{checkbox\|color=white\|check=yes\|title=Title3\|id=cb3\|hideYes=\|hideNo=\|showYes=\|showNo=}}{{checkbox\|color=white\|check=no\|title=Title4\|id=cb4\|hideYes=\|hideNo=\|showYes=\|showNo=}}</span>

Bog at 14:18, 7 June 2024

2024-06-07T14:18:22Z

← Older revision		Revision as of 14:18, 7 June 2024
Line 11:		Line 11:
	</pre>		</pre>

	color - ~~Text~~ and checkbox color		color - Optional, text and checkbox color

	check - If it's checked by default (yes/no)		check - Optional, if it's checked by default (yes/no)

	title - Optional text next to checkbox		title - Optional, text next to checkbox

	id - Optional, needed when more than one checkboxes are present. Each needs a unique id.		id - Optional, needed when more than one checkboxes are present. Each needs a unique id.

Bog at 14:16, 7 June 2024

2024-06-07T14:16:23Z

← Older revision		Revision as of 14:16, 7 June 2024
Line 35:		Line 35:
	<code>hideYes=class1,class2,class3</code>		<code>hideYes=class1,class2,class3</code>

	'''Note:''' you should put these class names on a separate span that goes over your elements, because the checkbox changes the <code>style="display:*"</code> attribute and will overwrite if the span already has an existing display attribute.		'''Note:''' you should put these class names on a separate <code><<nowiki/>span></code> that goes over your elements, because the checkbox changes the <code>style="display:*"</code> attribute and will overwrite if the span already has an existing display attribute.
	</noinclude>		</noinclude>

Bog at 13:18, 7 June 2024

2024-06-07T13:18:21Z

@@ Line 1: / Line 1: @@
-<includeonly><div id="{{{id|cb}}}" data-id="checkbox" data-checked="{{{check|yes}}}" checkbox class="image-{{{color|black}}}" style="display:inline-flex; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none;"><div style="pointer-events: none; display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:Tweak_Generic_Button.png|link=|30px]]</span><span id="check-{{{id|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check|yes}}}}} | yes | ruby | none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png|link=|18px]]</span><span id="uncheck-{{{id|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check|yes}}}}} | no | ruby | none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png|link=|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title|}}}</div></span></div></div></includeonly><noinclude>
+<includeonly><div id="{{{id|cb}}}" data-id="checkbox" data-checked="{{{check|yes}}}" data-hideYes="{{{hideYes|}}}" data-hideNo="{{{hideNo|}}}" data-showYes="{{{showYes|}}}" data-showNo="{{{showNo|}}}" class="image-{{{color|black}}}" style="display:inline-flex; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none;"><div style="pointer-events: none; display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:Tweak_Generic_Button.png|link=|30px]]</span><span id="check-{{{id|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check|yes}}}}} | yes | ruby | none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png|link=|18px]]</span><span id="uncheck-{{{id|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check|yes}}}}} | no | ruby | none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png|link=|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title|}}}</div></span></div></div></includeonly><noinclude>
-<span style="background:white; padding-top:5px; padding-bottom:6px;">{{checkbox|color=black|check=yes|title=Title1|id=cb1}}{{checkbox|color=black|check=no|title=Title2|id=cb2}}</span>
+<span style="background:white; padding-top:5px; padding-bottom:6px;">{{checkbox|color=black|check=yes|title=Title1|id=cb1|hideYes=1,2,3,4|hideNo=|showYes=|showNo=}}{{checkbox|color=black|check=no|title=Title2|id=cb2|hideYes=|hideNo=|showYes=|showNo=}}</span>
-<span style="background:black; padding-top:5px; padding-bottom:6px; padding-left:4px;">{{checkbox|color=white|check=yes|title=Title3|id=cb3}}{{checkbox|color=white|check=no|title=Title4|id=cb4}}</span>
+<span style="background:black; padding-top:5px; padding-bottom:6px; padding-left:4px;">{{checkbox|color=white|check=yes|title=Title3|id=cb3|hideYes=|hideNo=|showYes=|showNo=}}{{checkbox|color=white|check=no|title=Title4|id=cb4|hideYes=|hideNo=|showYes=|showNo=}}</span>
+Checkboxes can be used to hide & show different elements.
 ==Usage==
 <pre>
-{{checkbox|color=black|check=Yes|title=Title1|id=cb1}}
+{{checkbox|color=black|check=Yes|title=Title1|id=cb1|hideYes=|hideNo=|showYes=|showNo=}}
-{{checkbox|color=black|check=No|title=Title2|id=cb2}}
+{{checkbox|color=black|check=No|title=Title2|id=cb2|hideYes=|hideNo=|showYes=|showNo=}}
-{{checkbox|color=white|check=Yes|title=Title3|id=cb3}}
+{{checkbox|color=white|check=Yes|title=Title3|id=cb3|hideYes=|hideNo=|showYes=|showNo=}}
-{{checkbox|color=white|check=No|title=Title4|id=cb3}}
+{{checkbox|color=white|check=No|title=Title4|id=cb4|hideYes=|hideNo=|showYes=|showNo=}}
 </pre>
 </noinclude>

Bog at 10:45, 7 June 2024

2024-06-07T10:45:33Z

← Older revision		Revision as of 10:45, 7 June 2024
Line 1:		Line 1:
	<includeonly><div id="{{{id\|cb}}}" data-id="checkbox" data-checked="{{{check\|yes}}}" checkbox class="image-{{{color\|black}}}" style="display:inline-flex; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none;"><div style="display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:Tweak_Generic_Button.png\|link=\|30px]]</span><span id="check-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| yes \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png\|link=\|18px]]</span><span id="uncheck-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| no \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png\|link=\|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title\|}}}</div></span></div></div></includeonly><noinclude>		<includeonly><div id="{{{id\|cb}}}" data-id="checkbox" data-checked="{{{check\|yes}}}" checkbox class="image-{{{color\|black}}}" style="display:inline-flex; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none;"><div style="pointer-events: none; display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:Tweak_Generic_Button.png\|link=\|30px]]</span><span id="check-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| yes \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png\|link=\|18px]]</span><span id="uncheck-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| no \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png\|link=\|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title\|}}}</div></span></div></div></includeonly><noinclude>
	<span style="background:white; padding-top:5px; padding-bottom:6px;">{{checkbox\|color=black\|check=yes\|title=Title1\|id=cb1}}{{checkbox\|color=black\|check=no\|title=Title2\|id=cb2}}</span>		<span style="background:white; padding-top:5px; padding-bottom:6px;">{{checkbox\|color=black\|check=yes\|title=Title1\|id=cb1}}{{checkbox\|color=black\|check=no\|title=Title2\|id=cb2}}</span>
	<span style="background:black; padding-top:5px; padding-bottom:6px; padding-left:4px;">{{checkbox\|color=white\|check=yes\|title=Title3\|id=cb3}}{{checkbox\|color=white\|check=no\|title=Title4\|id=cb4}}</span>		<span style="background:black; padding-top:5px; padding-bottom:6px; padding-left:4px;">{{checkbox\|color=white\|check=yes\|title=Title3\|id=cb3}}{{checkbox\|color=white\|check=no\|title=Title4\|id=cb4}}</span>

Bog at 10:41, 7 June 2024

2024-06-07T10:41:23Z

← Older revision		Revision as of 10:41, 7 June 2024
Line 1:		Line 1:
	<includeonly><div id="{{{id\|cb}}}" data-id="checkbox" data-checked="{{{check\|yes}}}" checkbox class="image-{{{color\|black}}}" style="display:inline-flex; cursor: pointer;"><div style="display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:Tweak_Generic_Button.png\|link=\|30px]]</span><span id="check-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| yes \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png\|link=\|18px]]</span><span id="uncheck-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| no \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png\|link=\|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title\|}}}</div></span></div></div></includeonly><noinclude>		<includeonly><div id="{{{id\|cb}}}" data-id="checkbox" data-checked="{{{check\|yes}}}" checkbox class="image-{{{color\|black}}}" style="display:inline-flex; cursor: pointer; -webkit-user-select: none; -ms-user-select: none; user-select: none;"><div style="display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:Tweak_Generic_Button.png\|link=\|30px]]</span><span id="check-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| yes \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png\|link=\|18px]]</span><span id="uncheck-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| no \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png\|link=\|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title\|}}}</div></span></div></div></includeonly><noinclude>
	<span style="background:white; padding-top:5px; padding-bottom:6px;">{{checkbox\|color=black\|check=yes\|title=Title1\|id=cb1}}{{checkbox\|color=black\|check=no\|title=Title2\|id=cb2}}</span>		<span style="background:white; padding-top:5px; padding-bottom:6px;">{{checkbox\|color=black\|check=yes\|title=Title1\|id=cb1}}{{checkbox\|color=black\|check=no\|title=Title2\|id=cb2}}</span>
	<span style="background:black; padding-top:5px; padding-bottom:6px; padding-left:4px;">{{checkbox\|color=white\|check=yes\|title=Title3\|id=cb3}}{{checkbox\|color=white\|check=no\|title=Title4\|id=cb4}}</span>		<span style="background:black; padding-top:5px; padding-bottom:6px; padding-left:4px;">{{checkbox\|color=white\|check=yes\|title=Title3\|id=cb3}}{{checkbox\|color=white\|check=no\|title=Title4\|id=cb4}}</span>

Bog at 10:22, 7 June 2024

2024-06-07T10:22:39Z

← Older revision		Revision as of 10:22, 7 June 2024
Line 1:		Line 1:
	<includeonly><div id="checkbox-{{{~~title~~}}}" class="image-{{{color\|black}}}" style="display:inline-flex;"><div style="display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:Tweak_Generic_Button.png\|link=\|30px]]</span><span style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| yes \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png\|link=\|18px]]</span><span style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| no \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png\|link=\|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title\|}}}</div></span></div></div></includeonly><noinclude>		<includeonly><div id="{{{id\|cb}}}" data-id="checkbox" data-checked="{{{check\|yes}}}" checkbox class="image-{{{color\|black}}}" style="display:inline-flex; cursor: pointer;"><div style="display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:Tweak_Generic_Button.png\|link=\|30px]]</span><span id="check-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| yes \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png\|link=\|18px]]</span><span id="uncheck-{{{id\|cb}}}" style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| no \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png\|link=\|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title\|}}}</div></span></div></div></includeonly><noinclude>
	<span style="background:white; padding-top:5px; padding-bottom:~~5px~~;">{{checkbox\|color=black\|check=yes\|title=Title1}}{{checkbox\|color=black\|check=no\|title=Title2}}</span>		<span style="background:white; padding-top:5px; padding-bottom:6px;">{{checkbox\|color=black\|check=yes\|title=Title1\|id=cb1}}{{checkbox\|color=black\|check=no\|title=Title2\|id=cb2}}</span>
	<span style="background:black; padding-top:5px; padding-bottom:~~5px~~;">{{checkbox\|color=white\|check=yes\|title=Title3}}{{checkbox\|color=white\|check=no\|title=Title4}}</span>		<span style="background:black; padding-top:5px; padding-bottom:6px; padding-left:4px;">{{checkbox\|color=white\|check=yes\|title=Title3\|id=cb3}}{{checkbox\|color=white\|check=no\|title=Title4\|id=cb4}}</span>

	==Usage==		==Usage==
	<pre>		<pre>
	{{checkbox\|color=black\|check=Yes\|title=Title1}}		{{checkbox\|color=black\|check=Yes\|title=Title1\|id=cb1}}
	{{checkbox\|color=black\|check=No\|title=Title2}}		{{checkbox\|color=black\|check=No\|title=Title2\|id=cb2}}
	{{checkbox\|color=white\|check=Yes\|title=Title3}}		{{checkbox\|color=white\|check=Yes\|title=Title3\|id=cb3}}
	{{checkbox\|color=white\|check=No\|title=Title4}}		{{checkbox\|color=white\|check=No\|title=Title4\|id=cb3}}
	</pre>		</pre>
	</noinclude>		</noinclude>

Bog: /* Usage */

2024-06-03T15:27:59Z

Usage

← Older revision		Revision as of 15:27, 3 June 2024
Line 5:		Line 5:
	==Usage==		==Usage==
	<pre>		<pre>
	{{checkbox\|color=black\|check=Yes}}		{{checkbox\|color=black\|check=Yes\|title=Title1}}
	{{checkbox\|color=black\|check=No}}		{{checkbox\|color=black\|check=No\|title=Title2}}
	{{checkbox\|color=white\|check=Yes}}		{{checkbox\|color=white\|check=Yes\|title=Title3}}
	{{checkbox\|color=white\|check=No}}		{{checkbox\|color=white\|check=No\|title=Title4}}
	</pre>		</pre>
	</noinclude>		</noinclude>

Bog at 15:26, 3 June 2024

2024-06-03T15:26:45Z

← Older revision		Revision as of 15:26, 3 June 2024
Line 1:		Line 1:
	<includeonly><div class="image-{{{color\|black}}}" style="display:inline-flex;"><div style="display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:Tweak_Generic_Button.png\|link=\|30px]]</span><span style="position:absolute; display: ruby; margin-top:-5px">[[File:~~Tweak_GenericSetting_{{{check\|Yes}}}~~.png\|link=\|18px\|{{{~~checked}}}\|~~{{{check\|~~Yes~~}}}]]</div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title\|}}}</div></span></div></div></includeonly><noinclude>		<includeonly><div id="checkbox-{{{title}}}" class="image-{{{color\|black}}}" style="display:inline-flex;"><div style="display:contents; width:28px; height:14px"><span style="margin-left:-6px; margin-top:-8px">[[File:Tweak_Generic_Button.png\|link=\|30px]]</span><span style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| yes \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_Yes.png\|link=\|18px]]</span><span style="position:absolute; display: {{#ifeq: {{lc:{{{check\|yes}}}}} \| no \| ruby \| none }}; margin-top:-5px">[[File:Tweak_GenericSetting_No.png\|link=\|18px]]</span></div><div style="margin-left: -2px; padding-right: 4px; margin-top:-5px">{{{title\|}}}</div></span></div></div></includeonly><noinclude>
	{{checkbox\|color=black\|check=~~Yes~~\|title=Title1}}{{checkbox\|color=black\|check=No\|title=Title2}}		<span style="background:white; padding-top:5px; padding-bottom:5px;">{{checkbox\|color=black\|check=yes\|title=Title1}}{{checkbox\|color=black\|check=no\|title=Title2}}</span>
	{{checkbox\|color=white\|check=~~Yes~~}}{{checkbox\|color=white\|check=No}}		<span style="background:black; padding-top:5px; padding-bottom:5px;">{{checkbox\|color=white\|check=yes\|title=Title3}}{{checkbox\|color=white\|check=no\|title=Title4}}</span>

	==Usage==		==Usage==