Links
Basic links
Default link classes
Nitro has a default link style class that uses the value for $link-color passed from the theme: .link_style-default. The class .link will strip browser defaults like text-decoration: underline.
Links with icons
<a href="//location" class="link link_style-default">
Click Me
<span class="icon_inline">
<svg class="icon icon_fill icon_rotate90" role="img" aria-label="double arrows pointing to the right">
<use href="/images/core-icons.svg#icon-doubleCaret"/>
</svg>
</span>
</a>
Pointer Cursors on Other Elements
Cosmetically add the cursor: pointer onto elements that don't have that attribute inherently. Often set specifically on elements in css, so this is more of a temporary cheat for unique situations. Class: .pointer-cursor.
Hover over me
<div class="pointer-cursor">
<!-- content -->
</div>
Make Links Fill their Parent
By default links are inline and only take up as much space a they are wide and tall. They will also ignore vertical padding, and as illustrated below will disrespect layout. To expand the size of a link to fill its parent, like in the case of a set of a links that are "tabbed", apply .link_full to the <a> tag.
In the example below, the margin above left set of tabs is missing and the padding-top and padding-bottom properties have no effect.