ITL utility_classes

ITL utility_classes

Source: _misc.scss, line 77

9.1 Appearance

@mixin fade @mixin faded

  • .fade: lowers opacity of an ele
  • .faded: lowers the opacity even more
  • .hover-fade: fade on hover
  • .hover-faded: faded on hover

Example

Fade
Faded
Hover-fade
Hover-faded
<div class="fade">Fade</div>
<div class="faded">Faded</div>
<div class="hover-fade">Hover-fade</div>
<div class="hover-faded">Hover-faded</div>

Source: _misc.scss, line 6

9.2 Clickable links

@mixin clickable @mixin link

  • .clickable: changes the cursor
  • .link: turns text into a link

Example

<div class="bg-red w32 h32 clickable"></div>
<p class="link">This is a regular paragraph</p>

Source: _misc.scss, line 38

9.3 Not-allowed

@mixin not-allowed Use this class to make interaction with elements not-allowed

Example

This is a regular paragraph

<div class="not-allowed bg-red w32 h32"></div>
<p class="not-allowed">This is a regular paragraph</p>

Source: _misc.scss, line 56

9.4 Not selectable

@mixin no-select Use this class to make elements non selectable (press CTRL+A and you'll notice)

  • .no-select: makes element not selectable

Example

This is a regular paragraph

<p class="no-select">This is a regular paragraph</p>

Source: _misc.scss, line 118

9.5 Other

@mixin unset .unset: unsets all style