app/assets/stylesheets/shared/social_share.scss
.social-share-button .ssb-icon {
background-image: none;
color: #fff;
height: $icon-width;
line-height: $icon-width;
text-align: center;
width: $icon-width;
&::before {
font-size: calc(#{$icon-width} / 2);
margin-right: 0;
}
&:hover,
&:focus {
background: #fff;
}
}
.ssb-twitter {
@include has-fa-icon(twitter, brands);
background: #45b0e3;
&:hover,
&:focus {
color: #40a2d1;
}
}
.ssb-facebook {
@include has-fa-icon(facebook-f, brands);
background: #3b5998;
&:hover,
&:focus {
color: #354f88;
}
}
.ssb-telegram {
@include has-fa-icon(telegram-plane, brands);
background: #08c;
&:hover,
&:focus {
color: #40a2d1;
}
}
.ssb-whatsapp_app {
@include has-fa-icon(whatsapp, brands);
background: #43d854;
&:hover,
&:focus {
color: #43d854;
}
}
@include breakpoint(medium) {
.ssb-telegram,
.ssb-whatsapp_app {
display: none !important;
}
}
.share-supported {
text-align: center;
.social-share-button {
display: inline-block;
}
}