.avatar img, .avatar:not(.medium) > img, .b-avatar:not(.b-avatar--m) > img, .b-avatar--thread > img, .b-comment .b-avatar img, .b-comp-menu-dropdown__trigger-avatar, .profile-sidebar-widget .profileContainer .profile-photo-wrapper .profile-photo { border-radius: 100%; } .avatar,.b-avatar:not(.b-avatar--m){height:50px; width:50px;border:0} .avatar img{border-radius:100%;box-shadow:0px 0px 3px rgba(0,0,0,.2);background:#fff} .avatar:not(.medium) > img,.b-avatar:not(.b-avatar--m) > img,img.avatar{max-height:50px !important; max-width:50px !important;border-radius:100%;border:1px solid #fff; margin:-1px} img.avatar{margin-right:10px;}.forum-list-container .forum-item .lastpost > .lastpost-wrapper > .avatar + .lastpost-info{padding-left:60px} .b-comment__author,.b-avatar--thread{height:100px; width:100px} .b-avatar--thread > img{max-height:100px; max-width:100px !important; width:100px; height:100px; box-shadow:0 3px 8px rgba(0,0,0,.18),0 4px 16px rgba(0,0,0,.36);border-radius:100%;border:1px solid #C8CCCE;background:#fff} .l-desktop .b-avatar--thread{height:150px; width:150px;border:0}.l-desktop .b-avatar--thread > img{max-height:150px; max-width:150px !important; width:150px; height:150px;border-radius:100%} .avatar img,.b-comment .b-avatar img,.b-avatar--s > img{box-shadow:0 3px 4px rgba(0,0,0,.10),0 -1px 10px rgba(0,0,0,.2);border-radius:100%;background:#fff;border:1px solid #fff} .b-comment .b-avatar img{width:100%;height:100%} .l-small .b-userinfo .b-avatar{border:0} .l-desktop .b-avatar--thread > img,.l-desktop .avatar img,.l-desktop .b-avatar img,.b-avatar--s > img,.l-desktop .slider-avatar{transition:transform .2s ease,box-shadow .2s ease} .l-desktop .b-avatar--thread > img:hover{transform:scale(1.05) !important;box-shadow:0 4px 14px rgba(0,0,0,.18),0 6px 18px rgba(0,0,0,.36) !important} .l-desktop .avatar img:hover,.l-desktop .b-avatar img:hover,.l-desktop .slider-avatar:hover,.l-desktop .forum-list-container .forum-item:hover .avatar img,.l-desktop .b-post-sm:hover .avatar img,.l-desktop .topic-list-container .topic-list .topic-item:hover .avatar img,.l-desktop .js-memberlist-table-body .b-table__row:hover .b-avatar--s > img{transform:scale(1.15); box-shadow:0 5px 6px rgba(0,0,0,.10),0 -3px 12px rgba(0,0,0,.2)} .l-desktop .js-memberlist-table-body .b-table__row:hover{background:rgba(230,249,255,0.4)} .l-desktop .slider-avatar:hover,.l-desktop .b-content-slider__slide:hover .slider-avatar{transform:scale(1.05) !important} .l-desktop .b-comment .b-media{padding:5px} .b-comp-menu-dropdown__trigger-avatar{border-radius:100%} }
header
Collapse
Tip for round avatars
Collapse
X
-
UPDATEDCopy this code into your ADDITIONAL CSS, it will show round avatars and when you hover it zooms in.
Code:Last edited by chicoynano; 15.03.21, 02:31. -
-
UPDATEDCopy this code into your ADDITIONAL CSS, it will show round avatars and when you hover it zooms in.
Code:.avatar img, .avatar:not(.medium) > img, .b-avatar:not(.b-avatar--m) > img, .b-avatar--thread > img, .b-comment .b-avatar img, .b-comp-menu-dropdown__trigger-avatar, .profile-sidebar-widget .profileContainer .profile-photo-wrapper .profile-photo { border-radius: 100%; } .avatar,.b-avatar:not(.b-avatar--m){height:50px; width:50px;border:0} .avatar img{border-radius:100%;box-shadow:0px 0px 3px rgba(0,0,0,.2);background:#fff} .avatar:not(.medium) > img,.b-avatar:not(.b-avatar--m) > img,img.avatar{max-height:50px !important; max-width:50px !important;border-radius:100%;border:1px solid #fff; margin:-1px} img.avatar{margin-right:10px;}.forum-list-container .forum-item .lastpost > .lastpost-wrapper > .avatar + .lastpost-info{padding-left:60px} .b-comment__author,.b-avatar--thread{height:100px; width:100px} .b-avatar--thread > img{max-height:100px; max-width:100px !important; width:100px; height:100px; box-shadow:0 3px 8px rgba(0,0,0,.18),0 4px 16px rgba(0,0,0,.36);border-radius:100%;border:1px solid #C8CCCE;background:#fff} .l-desktop .b-avatar--thread{height:150px; width:150px;border:0}.l-desktop .b-avatar--thread > img{max-height:150px; max-width:150px !important; width:150px; height:150px;border-radius:100%} .avatar img,.b-comment .b-avatar img,.b-avatar--s > img{box-shadow:0 3px 4px rgba(0,0,0,.10),0 -1px 10px rgba(0,0,0,.2);border-radius:100%;background:#fff;border:1px solid #fff} .b-comment .b-avatar img{width:100%;height:100%} .l-small .b-userinfo .b-avatar{border:0} .l-desktop .b-avatar--thread > img,.l-desktop .avatar img,.l-desktop .b-avatar img,.b-avatar--s > img,.l-desktop .slider-avatar{transition:transform .2s ease,box-shadow .2s ease} .l-desktop .b-avatar--thread > img:hover{transform:scale(1.05) !important;box-shadow:0 4px 14px rgba(0,0,0,.18),0 6px 18px rgba(0,0,0,.36) !important} .l-desktop .avatar img:hover,.l-desktop .b-avatar img:hover,.l-desktop .slider-avatar:hover,.l-desktop .forum-list-container .forum-item:hover .avatar img,.l-desktop .b-post-sm:hover .avatar img,.l-desktop .topic-list-container .topic-list .topic-item:hover .avatar img,.l-desktop .js-memberlist-table-body .b-table__row:hover .b-avatar--s > img{transform:scale(1.15); box-shadow:0 5px 6px rgba(0,0,0,.10),0 -3px 12px rgba(0,0,0,.2)} .l-desktop .js-memberlist-table-body .b-table__row:hover{background:rgba(230,249,255,0.4)} .l-desktop .slider-avatar:hover,.l-desktop .b-content-slider__slide:hover .slider-avatar{transform:scale(1.05) !important} .l-desktop .b-comment .b-media{padding:5px} .b-comp-menu-dropdown__trigger-avatar{border-radius:100%} }
this code
.avatar.xx-small > img
is disabled
have you some tip?
Comment
-
-
X
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: 6
widgetinstance 297 (Related Topics) skipped due to lack of content & hide_module_if_empty option.
multiplex reklam paga
Collapse
Comment