News Ticker

Announcement

Collapse
No announcement yet.

Add avatars santa hat with CSS vB5

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Font Size
    #1

    vB5.X.X Add avatars santa hat with CSS vB5

    Description:
    The simple and easy way to add a santa hat to all avatars.


    How to install:
    1. Download the zip file, put the svg file named santahat.svg in the images folder in the root
    2. 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
    Similar Threads

Thread Information

Collapse

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

    Those who read this thread

    Collapse

    Members who have read this thread: 1

    Working...
    X
    0x0