Barmer Fractal

List Basic: Social Icon List 

<ul class="a-list-basic list--social-icon">
    <li class="list__item ">
        <a class="a-btn btn--socialmedia" href="#" title="">
            <i class="a-icon icon--facebook" aria-hidden="true"></i>
        </a>

    </li>
    <li class="list__item ">
        <a class="a-btn btn--socialmedia" href="#" title="">
            <i class="a-icon icon--twitter" aria-hidden="true"></i>
        </a>

    </li>
    <li class="list__item ">
        <a class="a-btn btn--socialmedia" href="#" title="">
            <i class="a-icon icon--instagram" aria-hidden="true"></i>
        </a>

    </li>
    <li class="list__item ">
        <a class="a-btn btn--socialmedia" href="#" title="">
            <i class="a-icon icon--youtube" aria-hidden="true"></i>
        </a>

    </li>
</ul>
 
<ul class="a-list-basic {{viewtypes.specifier}}" {{{content.ariaAttrs}}}>
  {{#each partials.listitems as |listitem| }}
    <li class="list__item {{listitem.viewtypes.specifier}}">
      {{# switches.hasIcon }}
      {{render '@icon' partials.icon merge=true}}
      {{/switches.hasIcon}}
      {{#if switches.hasTextContent }}
        {{{content.text}}}
      {{else}}
        {{render (stringToPartial listitem.type) partials.item merge=true}}
      {{/if }}
      {{#if switches.hasSublist }}
        {{render '@list-basic' partials.subList merge=true}}
      {{/if}}
    </li>
  {{/each}}
</ul>
 
{
  "switches": {},
  "viewtypes": {
    "specifier": "list--social-icon"
  },
  "content": {
    "listitems": []
  },
  "partials": {
    "listitems": [
      {
        "switches": {
          "hasTextContent": false
        },
        "type": "button--facebook"
      },
      {
        "switches": {
          "hasTextContent": false
        },
        "type": "button--twitter"
      },
      {
        "switches": {
          "hasTextContent": false
        },
        "type": "button--instagram"
      },
      {
        "switches": {
          "hasTextContent": false
        },
        "type": "button--youtube"
      }
    ]
  }
}

No notes defined.