Socials & Languages PREFIXES

Compatible XF 2.x versions

Hi everyone, I'm sharing this little code + svg for social network and language prefixes for your XenForo Forum.

1) Download the file
2) Upload it to your forum
3) Go to your panel and edit extra.less (admin > appearance > template > extra.less)
4) Paste the code
5) Create your prefixes (forums > threads prefix) Example prefix code; label label--Instagram
6) Save.

Extra.less code:

Less:

/***** PREFIX BY NEYCRUZZ *****/
/** SOCIAL PREFIX **/
.label--twitter{border-radius:3px;background-image:linear-gradient(to bottom, #0e323e, #52585a, #02090b);color:#ffffff;font-weight:900}
.label--threads{border:1px solid #fff;border-radius:3px;background:#000;color:#fff;font-weight:900}
.label--facebook{border:1px solid #fff;border-radius:3px;background-image:linear-gradient(to bottom, #29acfd, #1d86ee, #1262e0);color:#ffffff;font-weight:bold;text-shadow:.5px .5px #000}
.label--tiktok{border:1px solid #fff;border-radius:3px;background-image:linear-gradient(to left bottom, #ff004f, #000, #000, #00f7ef);color:#ffffff;font-weight:bold}
.label--instagram{border:1px solid #cc2366;color:#fff;background:#f09433;background:-moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);background:-webkit-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);background:linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f09433', endColorstr='#bc1888', GradientType=1)}
.label--twitch{border:1px solid #fff;border-radius:3px;background-image:linear-gradient(to left bottom, #6441a5, #6441a5, #a28dc9);color:#ffffff;font-weight:bold}
.label--patreon{border:1px solid #052c49;border-radius:3px;background-image:linear-gradient(to left bottom, #e85b46, #e85b46, #f19c90);color:#ffffff;font-weight:bold}
.label--reddit{border-radius:3px;background-image:linear-gradient(to left bottom, #ee0611, #ee0611, #ee0611, #fd9901, #fd9901);color:#ffffff;font-weight:bold}
.label--youtube{border:1px solid #900;border-radius:3px;background-image:linear-gradient(to left bottom, #f00, #f00, #f66);color:#ffffff;font-weight:bold}
.label--snapchat{border:1px solid #fff;border-radius:3px;background-image:linear-gradient(to left bottom, #fffc01, #fffc01, #fffd66, #fffd66);color:#000;font-weight:bold}
.label--kick{border:1px solid #6a7081;border-radius:3px;background:#25272c;color:#53fc18;font-weight:800}
.label--whatsapp{border-radius:3px;background-image:linear-gradient(to left bottom, #23cb40, #23cb40, #59f573);color:#fff;text-shadow:1px .5px #000;font-weight:800}

/** COUNTRY PREFIX **/
.label--deutsch{border:1px solid #fff;border-radius:3px;background-image:linear-gradient(to bottom, #000, #331019, #620f24, #920728, #c20023, #d82c1e, #ed4915, #ff6400, #ff8900, #fa0, #f8ca00, #eee91a);font-weight:700 !important;color:white}
.label--usa{border:1px solid #fff;border-radius:3px;background-image:url(data/assets/prefixes/flag-usa.svg);background-size:cover;font-weight:700 !important;color:#fff;text-shadow:-2px -2px 2px #389,2px 2px 2px #19444d}
.label--canada{border:1px solid #fff;border-radius:3px;background-image:url(data/assets/prefixes/flag-canada.svg);background-size:cover;font-weight:700 !important;color:#fff;text-shadow:-2px -2px 2px #389,2px 2px 2px #19444d}
.label--aussie{border:1px solid #fff;border-radius:3px;background-image:url(data/assets/prefixes/flag-aussie.svg);background-size:cover;font-weight:700 !important;color:#fff;text-shadow:-2px -2px 2px #389,2px 2px 2px #19444d}
.label--italy{border:1px solid #fff;border-radius:3px;background-image:url(data/assets/prefixes/flag-italy.svg);background-size:cover;font-weight:700 !important;color:#fff;text-shadow:-2px -2px 2px #389,2px 2px 2px #19444d}
.label--england{border:1px solid #fff;border-radius:3px;background-image:url(data/assets/prefixes/flag-england.svg);background-size:cover;font-weight:700 !important;color:#fff;text-shadow:-2px -2px 2px #389,2px 2px 2px #19444d}
.label--french{border:1px solid #fff;border-radius:3px;background-image:linear-gradient(to right, #002654, #fff, #ce1126);color:white;font-weight:700 !important;text-shadow:-1px -1px 1px #389,1px 1px 1px #19444d}
.label--russia{border:1px solid #fff;border-radius:3px;background-image:linear-gradient(to bottom, #fff, #0039a6, #d52b1e);color:white;font-weight:700 !important;text-shadow:1px 1px #000}
.label--spain{border:1px solid #fff;border-radius:3px;background-image:url(data/assets/prefixes/flag-spain.svg);background-size:cover;font-weight:700 !important;color:#fff;text-shadow:.8px .8px #000}
/***** PREFIX BY NEYCRUZZ *****/