Support Forums - Classified Ads Script Osclass
Osclass plugin support => Online Chat Plugin => Topic started by: Nijam Utheen on July 31, 2017, 01:28:56 PM
-
instead of big online icon http://prntscr.com/g2hgec i want to resize and move my online chat plugin icon to left side on mobile becouse this is hiding listing icon and whatsapp share icon but desktop no need resize that chat icon only move location is better becouse is hiding scroll top icon
desktop icon screen shot http://prntscr.com/g2kaer
mobile icon http://prntscr.com/g2hgec
-
@Nijam
Check CSS guides and do such modifications by yourself.
-
If I want to study css means first I will study all functionality of yours template and plugin so it will take 3 month ,so can u guide me how to resize particular plugin icon on mobile only ? Pleases
-
@Nijam
https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries
https://www.w3schools.com/cssref/pr_dim_width.asp
-
i tried last 2 days it did not clear still now :-[ after that i gave this following code it hidden only chat icon on mobile theme but chat window will not open
@media screen and (max-width:767px) {
.oc-chat {display:none!important;}
}
thanks for ur good support
-
@nijamutheen
You probably did not tried enough :-X
@media screen and (max-width:767px) {
body .oc-chat { left: 5px; right: auto; bottom: 120px;width:80px;}
body .oc-chat.oc-open {width:280px;}
body .oc-global-head {border-radius:5px;}
body .oc-global-head > span {display:none;}
body .oc-chat.oc-open .oc-global-head > span {display:block;}
body .oc-chat.oc-closed .oc-global-head > i.oc-dir:before { content: "\f105"; }
body .oc-global-head > i.oc-dir:before { content: "\f104"; }
}
-
it is worked thanks thanks .... and lot of thanks to "frosticek", my first big problem is cleared
-
How to Move this onlinechat icon from left center to below http://prntscr.com/gbmm9a ?
becouse it gave some disturbance when posting,register new user,logging when typing any thing see http://prntscr.com/gbmpf7
or do u have any ideas about this ?
sorry for bad english Bro
-
@nijamuteen
@media screen and (max-width:767px) {
body .oc-chat { left: 5px; right: auto; bottom: 5px;width:80px;}
body .oc-chat.oc-open {width:280px;}
body .oc-global-head {border-radius:5px;}
body .oc-global-head > span {display:none;}
body .oc-chat.oc-open .oc-global-head > span {display:block;}
body .oc-chat.oc-closed .oc-global-head > i.oc-dir:before { content: "\f105"; }
body .oc-global-head > i.oc-dir:before { content: "\f104"; }
}
-
:)
The abive code is still hiding the Whatsapp sharer icon on single listing,
What to do to make it clearly visible?
-
bottom: 5px; .... increase it to i.e. 30px;