<span class="icon-block">
<svg class="icon icon-block__icon icon--phone" id="icon-3933" viewBox="0 0 200 200" role="presentation">
  <use xlink:href="#icon-phone"></use>
</svg>0421 3655-8584
</span>
-
  //- Prepare attr object
  attr = attr || {};
  attr.class = classList(attr.class);

  //- Tag
  tag = 'span';
  if (attr.href || link) {
    attr.href = attr.href || link || '';
    tag = 'a';
  }

  //- Process options
  if (modifier) {
    attr.class.push(`icon-block--${modifier}`);
  }

//- Render atom
#{tag}.icon-block&attributes(attr)
  //- Icon
  != include('@icon', {icon, attr: {class: 'icon-block__icon'}})

  //- Content/text
  if content
    != renderPug(content)
  else if text
    | #{text}

  //- Subinformation
  if sub
    span.icon-block__sub  #{sub}
{
  "icon": "phone",
  "text": "0421 3655-8584"
}
  • Content:
    .icon-block {
      display: inline-block;
    
      &[href] {
        @include link($color-blue-light, $color-blue);
    
        font-weight: bold;
      }
    }
    
    .icon-block__icon {
      color: $color-red;
      margin-right: 1.2rem;
    }
    
    .icon-block__sub {
      display: inline-block;
      font-weight: $root-font-weight;
      margin-left: 0.5rem;
    }
    
    .icon-list .icon-block {
      display: block;
      padding-left: calc(1em + 1.2rem);
    }
    
    .icon-list .icon-block__icon {
      margin-left: calc(-1em - 1.2rem);
    }
    
  • URL: /components/raw/icon-block/icon-block.scss
  • Filesystem Path: src/components/molecules/icon-block/icon-block.scss
  • Size: 457 Bytes

There are no notes for this item.