Tweet
Description:
The simple and easy way to add a santa hat to all avatars.
How to install:
The simple and easy way to add a santa hat to all avatars.
How to install:
- Download the zip file, put the svg file named santahat.svg in the images folder in the root
- If you add the following CSS code to the css_additional.css template of the style you are using, it will look like the screenshot.
HTML Code:
/* Add Avatara Santa Hat with CSS start */
.avatar,
.b-avatar,
.b-avatar--thread {
border: 0;
}
.b-userinfo .b-avatar, .b-userinfo .b-avatar img {
max-height: 80px;
max-width: 80px !important;
width: 80px;
height: 80px;
}
.avatar img,
.avatar:not(.medium) > img,
.b-avatar:not(.b-avatar--m) > img,
.b-avatar--thread > img,
.b-avatar--s > img,
.b-comment .b-avatar img,
.b-comp-menu-dropdown__trigger-avatar,
.profile-sidebar-widget .profileContainer .profile-photo-wrapper .profile-photo,
.b-avatar--pmchat,
.b-pmchat__participants-avatar,
img.avatar,
img.b-avatar {
border-radius: 100%;
}
.avatar,
.b-avatar,
.b-avatar--thread {
border: 0;
position: relative !important;
overflow: visible !important;
}
.b-avatar--thread img {
border: 1px solid #fff;
}
.avatar:before,
.b-avatar:before,
.b-avatar--thread:before {
content: ' ';
background-image: url(/images/santahat.svg) !important;
background-size: contain !important;
background-repeat: no-repeat !important;
width: 75% !important;
height: 75% !important;
position: absolute !important;
top: -11% !important;
left: -8% !important;
}
/* Add Avatara Santa Hat with CSS end */
Attached Files
