Xenforo 2.0 Color Social Share Buttons

[guclusat]

You can color the social share buttons, which are gray in Xenforo 2.
add an extra.less template;

.shareButtons-button.shareButtons-button--facebook {
    background-color: #3B5998;
}
.shareButtons-button.shareButtons-button--twitter {
    background-color: #1DA1F3;
}
.shareButtons-button.shareButtons-button--gplus {
    background-color: #dd4b39;
}
.shareButtons-button.shareButtons-button--reddit {
    background-color: #FF4500;
}
.shareButtons-button.shareButtons-button--pinterest {
    background-color: #bd081c;
}
.shareButtons-button.shareButtons-button--tumblr {
    background-color: #35465c;
}
.shareButtons-button.shareButtons-button--whatsApp {
    background-color: #25D366;
}
.shareButtons-button.shareButtons-button--email {
    background-color: #1289ff;
}
.shareButtons-button.shareButtons-button--link {
    background-color: #787878;
}
.shareButtons--iconic .shareButtons-button:hover {
    opacity: .5;
}
.shareButtons--iconic .shareButtons-button {
    opacity: 1;
    color: #fff;
    margin: 0 3px 3px;
}

If you want to frame the buttons within the topic, add them to the extra.less template again;

.blockMessage.blockMessage--none {
    background: #fff;
    color: #141414;
    padding: 10px 10px 6px;
    border-width: 1px;
    border-style: solid;
    border-top-color: #dfdfdf;
    border-right-color: #d8d8d8;
    border-bottom-color: #cbcbcb;
    border-left-color: #d8d8d8;
}

Prior to;

After;

Within the framework;

In the sidebar;