Icons

Social sharing icons currently only contain twitter and facebook.

Source: _shop18-styleguide.scss, line 482
Example
Markup: components/social/social-sharing.twig
<div class="cr-article__social-links">
  <div class="social-links-label">
    <span>Share with:</span>
  </div>
  <div class="item-list">
  	<ul class="social-links">
  		<li>
  			<a href="http://twitter.com/home?status=http%3A%2F%2Flocalhost%3A8080%2Fweb%2Fnews-tv-and-events%2Fnews%2Fextra-article-3&amp;amp;title=Extra+article+3" title="Twitter" class="social-link twitter-social-link social-link-popup SocialPopup-processed">
  				<svg class="icon">
  					<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#social-link-twitter"></use>
  					</svg>
  			</a>
  		</li>
  		<li>
  			<a href="https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Flocalhost%3A8080%2Fweb%2Fnews-tv-and-events%2Fnews%2Fextra-article-3&amp;amp;title=Extra+article+3" title="Facebook" class="social-link facebook-social-link social-link-popup SocialPopup-processed">
  				<svg class="icon">
  					<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#social-link-facebook"></use>
  					</svg>
  			</a>
  		</li>
  	</ul>
  </div>  
</div>
Source: _shop18-styleguide.scss, line 488
Example
Markup: components/social/social-following.twig
<div class="footer__social-links bg--black">
  <ul>
    <li>
      <a href="https://www.facebook.com/officialrednoseday" title="Facebook" target="_blank" class="icon__fb">
        <svg class="icon">
          <use xlink:href="#icon-facebook"></use>
        </svg>
      </a>
    </li>
    <li>
      <a href="https://twitter.com/rednoseday" title="Twitter" target="_blank" class="icon__twitter">
        <svg class="icon">
          <use xlink:href="#icon-twitter"></use>
        </svg>
      </a>
    </li>
    <li>
      <a href="https://www.instagram.com/rednoseday/" title="YouTube" target="_blank" class="icon__youtube">
        <svg class="icon">
          <use xlink:href="#icon-youtube"></use>
        </svg>
      </a>
    </li>
    <li>
      <a href="https://plus.google.com/+rednoseday" title="Instagram" target="_blank" class="icon__instagram">
        <svg class="icon">
          <use xlink:href="#icon-instagram"></use>
        </svg>
      </a>
    </li>
    <li>
      <a href="https://www.youtube.com/user/rednoseday" title="Google Plus" target="_blank" class="icon__googleplus">
        <svg class="icon">
          <use xlink:href="#icon-googleplus"></use>
        </svg>
      </a>
    </li>
  </ul>
</div>
Source: _shop18-styleguide.scss, line 494
Markup: components/meta-icons/meta-icons.twig
<div id="block-metaiconsblock" class="contextual-region block block-cr-meta-icons">
  <div class="meta-icons">
    <a role="button" class="meta-icons__magnify has-tooltip active" title="Search" href="#">
      <svg class="icon">
        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-magnify"></use>
      </svg>
    </a>
    <a role="button" href="https://my.rednoseday.com/user/login" target="_blank" class="meta-icons__login has-tooltip" title="Log in to your Giving Page">
      <svg class="icon">
        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-login"></use>
      </svg>
    </a>
    <a role="button" class="meta-icons__esu-toggle has-tooltip" title="Sign up for emails" href="#">
      <svg class="icon">
        <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#envelope"></use>
      </svg>
      <span>Get the latest</span>
    </a>
  </div>
</div>
Source: _shop18-styleguide.scss, line 500