Xenforo forum sitesinde hareketli online ikonları nasıl yapılır?

PaulWalker

🏅
Kıdemli Üye
Katılım
8 Ocak 2025
Konular
77
Mesajlar
82
Tepkime puanı
48
Konum
İstanbul
TL
220
Xenforo forum sitesinizde online üyelerinizin avatarı altında hareketli online ikonları olması için aşağıdaki kodu temanızın extra.less şablonuna ekleyip kaydedin.

Kod:
.message-avatar-wrapper .message-avatar-online {
    display: inline-block;
        width: 16px;
        height: 16px;
        margin: 0px 0 0 0px;
        background: #fff;
        border: none!important;
        border-radius: 50%!important
}
.message-avatar-wrapper .message-avatar-online:before {
    content: '';
        position: absolute;
        width: 10px;
        height: 10px;
        margin: 1px 0 0 -6px;
        background: #7fb900;
        border-color: #7fb900;
        border-radius: 50%
}
.message-avatar-wrapper .message-avatar-online:after {
    content: '';
        position: absolute;
        width: 32px;
        height: 32px;
        margin: -10px 0 0 -20px;
        border: 2px solid #7fb900;
        border-radius: 50%;
        box-shadow: 0 0 5px #7fb900, inset 0 0 5px #7fb900;
        -webkit-transform: scale(0);
        -webkit-animation: online 2.5s ease-in-out infinite;
        animation: online 2.5s ease-in-out infinite
    }
@-webkit-keyframes online
    {
          0% {opacity: 1;-webkit-transform: scale(0)}
         50% {opacity: .7}
        100% {opacity: 0;-webkit-transform: scale(1)}
    }

@keyframes online
    {
          0% {opacity: 1;transform: scale(0)}
         50% {opacity: .7}
        100% {opacity: 0;transform: scale(1)}
    }
 
Moderatör tarafında düzenlendi:
  • Like
Tepkiler: io
Üst Alt