Module:Utilities/doc: Difference between revisions

From Deadlock Wiki
Jump to navigation Jump to search
Sur (talk | contribs)
m get_slot_color trying an example with debug_mode
Sur (talk | contribs)
m get_slot_color with alpha colored divs
Line 9: Line 9:
===Parameters===
===Parameters===
* '''slot''' - slot key, options are Weapon, Armor, and Tech
* '''slot''' - slot key, options are Weapon, Armor, and Tech
* '''color_format''' - color format, defaults to hex. Valid options are hex, rgb
* '''color_format''' - color format, defaults to hex. Valid options are hex, rgb, hsl, cmyk
* '''no_wrap''' - Defaults to false. Set to true to remove prefixes and postfixes of '#' from hex, or 'rgb()', 'hsl()', and 'cmyk()' from the other formats. May be useful for altering the values dynamically
* '''debug_mode''' - (OPTIONAL) - used mostly for documentation purposes


===Examples===
===Examples===
To retrieve the color alone
To retrieve the hex color
<code><nowiki>{{#invoke:Utilities|get_slot_color|Tech}}</nowiki></code>
<code><nowiki>{{#invoke:Utilities|get_slot_color|Tech}}</nowiki></code>


{{#invoke:Utilities|get_slot_color|Tech|debug_mode=true}}
{{#invoke:Utilities|get_slot_color|Tech|debug_mode=true}}
To retrieve other color formats
<code><nowiki>{{#invoke:Utilities|get_slot_color|Tech|rgb}}</nowiki></code>
{{#invoke:Utilities|get_slot_color|Tech|rgb|debug_mode=true}}




To style text:
To style text:
<code><nowiki><span style="color: {{#invoke:Utilities|get_slot_color|Tech}};">Tech colored text</span></nowiki></code>
<code><nowiki><span style="color: {{#invoke:Utilities|get_slot_color|Weapon}};">Weapon colored text</span></nowiki></code>


<span style="color: {{#invoke:Utilities|get_slot_color|Tech}};">Tech colored text</span>
<span style="color: {{#invoke:Utilities|get_slot_color|Weapon}};">Weapon colored text</span>




To style divs:
To style divs:
<code><nowiki><div style="background-color: {{#invoke:Utilities|get_slot_color|Tech}}; padding: 10px; border-radius: 5px;">
<code><nowiki><div style="background-color: {{#invoke:Utilities|get_slot_color|Tech}};">
Tech colored div</div></nowiki></code>
 
<div style="background-color: {{#invoke:Utilities|get_slot_color|Tech}};">
Tech colored div
Tech colored div
</div></nowiki></code>
</div>
 
 
To alter the alpha value using rgb dynamically:
<code><nowiki><div style="background-color: rgb({{#invoke:Utilities|get_slot_color|Armor|rgb|no_wrap=true}}, 0.5);">
Armor colored div with 0.5 alpha</div></nowiki></code>
 
<div style="background-color: rgb({{#invoke:Utilities|get_slot_color|Armor|rgb|no_wrap=true}}, 0.5);">
Armor colored div with 0.5 alpha
</div>
 


<code><nowiki><div style="background-color: rgb({{#invoke:Utilities|get_slot_color|Armor|rgb|no_wrap=true}}, 0.2);">
Armor colored div with 0.2 alpha</div></nowiki></code>


<div style="background-color: {{#invoke:Utilities|get_slot_color|Tech}}; padding: 10px; border-radius: 5px;">
<div style="background-color: rgb({{#invoke:Utilities|get_slot_color|Armor|rgb|no_wrap=true}}, 0.2);">
Tech colored div
Armor colored div with 0.2 alpha
</div>
</div>

Revision as of 21:54, 1 November 2024

Overview

Utility functions that serve any miscellaneous purpose

Functions

get_slot_color

Retrieve's the hex color of a certain slot/category, formerly known in english as Weapon, Vitality, and Spirit, though their unlocalized names are Weapon, Armor, and Tech.

Parameters

  • slot - slot key, options are Weapon, Armor, and Tech
  • color_format - color format, defaults to hex. Valid options are hex, rgb, hsl, cmyk
  • no_wrap - Defaults to false. Set to true to remove prefixes and postfixes of '#' from hex, or 'rgb()', 'hsl()', and 'cmyk()' from the other formats. May be useful for altering the values dynamically
  • debug_mode - (OPTIONAL) - used mostly for documentation purposes

Examples

To retrieve the hex color {{#invoke:Utilities|get_slot_color|Tech}}

#c288f0

To retrieve other color formats {{#invoke:Utilities|get_slot_color|Tech|rgb}}

rgb(194,136,240)


To style text: <span style="color: {{#invoke:Utilities|get_slot_color|Weapon}};">Weapon colored text</span>

Weapon colored text


To style divs: <div style="background-color: {{#invoke:Utilities|get_slot_color|Tech}};"> Tech colored div</div>

Tech colored div


To alter the alpha value using rgb dynamically: <div style="background-color: rgb({{#invoke:Utilities|get_slot_color|Armor|rgb|no_wrap=true}}, 0.5);"> Armor colored div with 0.5 alpha</div>

Armor colored div with 0.5 alpha


<div style="background-color: rgb({{#invoke:Utilities|get_slot_color|Armor|rgb|no_wrap=true}}, 0.2);"> Armor colored div with 0.2 alpha</div>

Armor colored div with 0.2 alpha