Add this in css_additional or via Sitebuilder > Style > CSS Editor
Using a custom images:
OR using pure CSS (for online icon only):
To increase icon size (optional, applicable to both solutions above):
Using a custom images:
Code:
/* For online icon */ .b-icon__status--green { background: transparent url('/path/to/the/image.png') no-repeat; width: 15px; /* specify width if not 12px */ height: 15px; /* specify height if not 12px */ } /* For offline icon */ .b-icon__status--gray { background: transparent url('/path/to/the/image2.png') no-repeat; width: 15px; /* specify width if not 12px */ height: 15px; /* specify height if not 12px */ }
Code:
/* For online icon */ .b-icon__status--green { background: #0f0; border-radius: 100%; border: 2px solid #fff; box-sizing: border-box; }
Code:
.b-userinfo__icon.online, .b-userinfo__icon.offline { -webkit-transform: scale(1.3); -ms-transform: scale(1.3); transform: scale(1.3); }
Comment