bem-social

Примеры

{
  block: 'social-icon',
  mods: { size: 'm', round: 'facebook-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'instagram-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'ok-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'telegram-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'twitter-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'vk-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'ya-primary'}
}

{
  block: 'social-icon',
  mods: { size: 'm', round: 'facebook-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'instagram-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'ok-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'telegram-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'twitter-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'vk-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'ya-default'}
}

{
  block: 'social-icon',
  mods: { size: 'm', round: 'facebook-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'instagram-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'ok-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'telegram-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'twitter-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'vk-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', round: 'ya-inverse'}
}

{
  block: 'social-icon',
  mods: { size: 'm', clear: 'facebook-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'instagram-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'ok-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'telegram-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'twitter-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'vk-primary'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'ya-primary'}
}

{
  block: 'social-icon',
  mods: { size: 'm', clear: 'facebook-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'instagram-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'ok-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'telegram-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'twitter-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'vk-default'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'ya-default'}
}

{
  block: 'social-icon',
  mods: { size: 'm', clear: 'facebook-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'instagram-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'ok-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'telegram-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'twitter-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'vk-inverse'}
},
{
  block: 'social-icon',
  mods: { size: 'm', clear: 'ya-inverse'}
}