WAI Website Assets

Icons 

<svg aria-hidden="true" class="icon-default "><use xlink:href="../../assets/images/icons.svg#icon-default"></use></svg> default
 
{%- if name -%}{%- else -%}{%- set name="default" -%}{%- endif -%}
{%- if label -%}
<svg aria-label="{{ label }}" class="icon-{{ name }} {{class}}"><use xlink:href="{{ "/assets/images/icons.svg" | path }}#icon-{{ name }}"></use></svg> {{ name }}
{%- else -%}
<svg aria-hidden="true" class="icon-{{ name }} {{class}}"><use xlink:href="{{ "/assets/images/icons.svg" | path }}#icon-{{ name }}"></use></svg> {{ name }}
{%- endif -%}
 
/* No context defined for this component. */
  • Content: 
    [class^="icon-"], [class*=" icon-"] {
  display: inline-block;
  width: 1em;
  height: 1em;
  stroke-width: 0;
  stroke: currentColor;
  fill: currentColor;
}

/* ==========================================
Single-colored icons can be modified like so:
.icon-name {
  font-size: 32px;
  color: red;
}
========================================== */

.icon-default {
  width: 0.9285714285714285em;
}

.icon-info {
  width: 0.8571428571428571em;
}

.icon-audio-description {
  width: 3.5em;
  height: 1.75em;
  margin: -.25em;
}

.icon-search {
  width: 0.9287109375em;
}

.icon-arrow-left {
  width: 0.8928571428571428em;
}

.icon-arrow-right {
  width: 0.8214285714285714em;
}

.icon-arrow-up {
  width: 0.9285714285714285em;
}

.icon-arrow-down {
  width: 0.9285714285714285em;
}

.icon-ex-circle {
  width: 0.8571428571428571em;
}

.icon-check-circle {
  width: 0.8571428571428571em;
}

.icon-external-link {
  width: 0.8571428571428571em;
}

.icon-readmore {
  width: 0.7142857142857142em;
}

.icon-desktop {
  width: 1.0714285714285714em;
}

.icon-laptop {
  width: 1.0714285714285714em;
}

.icon-tablet {
  width: 0.6428571428571428em;
}

.icon-mobile {
  width: 0.42857142857142855em;
}

.icon-code {
  width: 1.0714285714285714em;
}

.icon-fork {
  width: 0.5714285714285714em;
}

.icon-code-file {
  width: 0.8571428571428571em;
}

.icon-cart-plus {
  width: 0.9285714285714285em;
}

.icon-languages {
  height: 1em;
  width: 2.75em;
  vertical-align: -8%;
}

.icon-translations {
  height: 1.6em;
  vertical-align: middle
}
  • URL: /components/raw/icons/icons.css
  • Filesystem Path: components/icons/icons.css
  • Size: 1.5 KB

There are no notes for this item.