<div class="dg-blocks-social island">
    <h3>Volg Stad Gent op</h3>
    <ul class="no-style">
        <li><a href="https://www.facebook.com/stadsbestuurgent" class="facebook">stadsbestuurgent</a></li>
        <li><a href="https://twitter.com/stadgent" class="twitter">@Stadgent</a></li>
        <li><a href="https://www.linkedin.com/company/stad-gent" class="linkedin">Stad Gent</a></li>
        <li><a href="https://www.youtube.com/channel/UCmJLf8SFG0D0GTd6LSSTQLw" class="youtube">YouTube Stad Gent</a></li>
        <li><a href="https://www.instagram.com/stadgent/" class="instagram">@stadgent</a></li>
    </ul>
</div>
<div class="dg-blocks-social island">
  {% include '@h3'with { 'h3_text': 'Volg Stad Gent op' } %}
  {% include "@list" with
    {
      "modifier": "no-style",
      "items": [
        '<a href="https://www.facebook.com/stadsbestuurgent" class="facebook">stadsbestuurgent</a>',
        '<a href="https://twitter.com/stadgent" class="twitter">@Stadgent</a>',
        '<a href="https://www.linkedin.com/company/stad-gent" class="linkedin">Stad Gent</a>',
        '<a href="https://www.youtube.com/channel/UCmJLf8SFG0D0GTd6LSSTQLw" class="youtube">YouTube Stad Gent</a>',
        '<a href="https://www.instagram.com/stadgent/" class="instagram">@stadgent</a>'
      ]
    }
  %}
</div>
/* No context defined for this component. */
  • Content:
    .dg-blocks-social {
      h3 {
        margin: 0;
        line-height: 1.5em;
      }
    
      ul {
        padding-left: 0;
        list-style: none;
      }
    
      a {
        color: $color-gray;
        text-decoration: none;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        word-wrap: break-word;
    
        &:visited {
          color: $color-gray;
        }
    
        &:hover {
          color: $color-medium-lighter-gray;
        }
    
        &::before {
          @extend %icon-base-css;
          padding-right: .5rem;
        }
      }
    
      .facebook {
        &::before {
          @extend %icon-facebook;
        }
      }
    
      .twitter {
        &::before {
          @extend %icon-twitter;
        }
      }
    
      .linkedin {
        &::before {
          @extend %icon-linkedin;
        }
      }
    
      .youtube {
        &::before {
          @extend %icon-youtube;
        }
      }
    
      .instagram {
        &::before {
          @extend %icon-instagram;
        }
      }
    }
    
  • URL: /components/raw/social-media-block/_social-media-block.scss
  • Filesystem Path: components/31-molecules/blocks/social-media-block/_social-media-block.scss
  • Size: 837 Bytes

There are no notes for this item.