The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Chatbox Detail Color Changes

+2
Ace
TheCrow
6 posters

Go down

chatbox - Chatbox Detail Color Changes Empty Chatbox Detail Color Changes

Post by Guest December 6th 2015, 12:25 am

Hello,

I'd like to edit two things on my forum's chatbox, so I'm hoping someone could help me by providing a code. I am wanting to change the color of the border that goes around the chatbox avatars and then I also wish to change the color of the line that separates the chat from the "online/offline" status list.

My forum's version is phpBB3, the url is listed below, and I want to say thank you to anyone that has the time to assist with this feature. I really appreciate your time.

www.gatewaytoroleplay.com


Last edited by Leah7 on December 6th 2015, 1:34 am; edited 1 time in total
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by TheCrow December 6th 2015, 12:28 am

Hello @Leah7,

Add this in your CSS:
Code:
#chatbox .cb-avatar {
border:1px solid XXXXXX!important; /*for the avatar border*/
}
#chatbox_members{
border-right:1px solid XXXXXX!important; /*for the line that separates chatbox from memberlist*/
}

That should fix both of your problems! Smile


Luffy
TheCrow
TheCrow
Manager
Manager

Male Posts : 6898
Reputation : 794
Language : Greek, English

https://forumote.forumotion.com

Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 6th 2015, 1:33 am

Thanks!  Both codes seem to work perfectly, but I seem to have a white line above and to the left side of the avatar, for some odd reason.  O-o Is there any way I can fix that?

chatbox - Chatbox Detail Color Changes Dx10

Here is the code that I have, at this time:
Code:
/* Chatbox Avatar */
    #chatbox .cb-avatar img{
    border:1px solid #303030!important;}    
   #chatbox .cb-avatar {background:none !important }
   #chatbox .cb-avatar {border:none!important;}
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Ace December 6th 2015, 2:39 am

Good evening Leah,

Apply this to your CSS Stylesheet:

#chatbox .cb-avatar{
border: 0px !important;
}

Regards.
Ace
Ace
Forumember

Posts : 250
Reputation : 49
Language : Portuguese & English

http://ajuda.forumeiros.com/u39577

Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 6th 2015, 2:42 am

There was no change. :/
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 6th 2015, 2:53 am

Leah7 wrote:There was no change. :/

Try replacing your code with this:

Code:
/* Chatbox Avatar */
    #chatbox .cb-avatar img{
    border:0px solid #333!important;}   
  #chatbox .cb-avatar {background:none !important }
  #chatbox .cb-avatar {border:none!important;}
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 6th 2015, 3:12 am

That also had no change, but thank you for trying. =)
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 6th 2015, 4:00 am

This should do the trick:

Code:
#chatbox .cb-avatar {
    background: none repeat scroll 0 0 #fff;
    box-shadow: 0 2px 2px rgba(0,0,0,0.1);
    float: left;
    height: 30px;
    margin-right: 4px;
    padding: 1px;
    vertical-align: middle;
    width: 30px;
}
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 6th 2015, 4:38 am

No luck. Sad
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 6th 2015, 12:20 pm

Try to put this at the first line of your CSS stylesheet:
Code:
#chatbox .cb-avatar {
border: 0px !important;
}
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 6th 2015, 5:47 pm

This didn't remove it, either. According to some, I probably won't be able to fix it, because the stupid border appears in the code that comes from the option to make avys activated in the admin panel option. >( Grrr.
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Rhino.Freak December 6th 2015, 5:51 pm

Leah7 wrote:This didn't remove it, either. According to some, I probably won't be able to fix it, because the stupid border appears in the code that comes from the option to make avys activated in the admin panel option. >( Grrr.

If that's the case, try this code. It's a javascript that gets the highest priority and can overwrite the styles.

Modules > JS codes management > New
Placement: All
Code:

$(function() {
  $(document.body).append('<style>#chatbox .cb-avatar {border: 0px !important;}</style>');
});
Rhino.Freak
Rhino.Freak
Helper
Helper

Male Posts : 1248
Reputation : 104
Language : English
Location : Mumbai, India

http://freetest.forumotion.net/

Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 6th 2015, 8:07 pm

That didn't work, either. :/ No change.
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 6th 2015, 11:18 pm

May I ask for the script you're currently using?
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 7th 2015, 12:24 am

As in all of my CSS, or all javascripts?
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Ape December 7th 2015, 1:21 am

@Leah7 do you have a test account i can use to take a look ? if so please pm me it XX


chatbox - Chatbox Detail Color Changes Left1212chatbox - Chatbox Detail Color Changes Center11chatbox - Chatbox Detail Color Changes Right112
chatbox - Chatbox Detail Color Changes Ape_b110
chatbox - Chatbox Detail Color Changes Ape1010
Ape
Ape
Administrator
Administrator

Male Posts : 19084
Reputation : 1988
Language : fluent in dork / mumbojumbo & English haha

http://chatworld.forumotion.co.uk/

Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Ace December 7th 2015, 1:37 am

APE wrote:@Leah7 do you have a test account i can use to take a look ? if so please pm me it XX

@APE This border appears in every chatbox avatar. Just activate a chatbox in any FM forum, use the Inspect Element and you'll see. Mark, there's no script -- it's a Admin CP function and it comes with an external CSS that, even with JS, seems very hard to override (just the border part).

@Leah7 would you be willing to deactivate the native avatar function from the chatbox and we rebuild it using JS? Smile

Regards.
Ace
Ace
Forumember

Posts : 250
Reputation : 49
Language : Portuguese & English

http://ajuda.forumeiros.com/u39577

Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 7th 2015, 4:13 am

@APE
If I can't get the Js for this to work, then I'll make you a test account and let you know!

@Ace
I won't mind using the Javascript code, instead of the admin panel feature. ^^
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Ange Tuteur December 7th 2015, 12:28 pm

Hi @Leah7,

See if the following CSS rules work for you.

1. Avatar border color
Code:
body.chatbox #chatbox .cb-avatar {
  border-color:#333 !important;
}

2. Memberlist division line
Code:
#chatbox_members {
  border-color:#333 !important;
}
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 7th 2015, 3:35 pm

Thank you, Ange~

The separation bar is changed nicely, but the avatar border doesn't go away, unfortunately. Sad
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Guest December 8th 2015, 5:12 pm

Since this cannot be resolved, it can be closed.
avatar
Guest
Guest


Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by Rhino.Freak December 8th 2015, 6:06 pm

Should be reported to @Buttercup tho.
Rhino.Freak
Rhino.Freak
Helper
Helper

Male Posts : 1248
Reputation : 104
Language : English
Location : Mumbai, India

http://freetest.forumotion.net/

Back to top Go down

chatbox - Chatbox Detail Color Changes Empty Re: Chatbox Detail Color Changes

Post by brandon_g December 8th 2015, 6:41 pm

@Rhino.Freak, since this is not really a bug, it is not worth really bothering Buttercup over. If you want this to be changed (within the feature), I would suggest making a suggestion about it in the suggestions section Very Happy.

Topic locked on topic starter request ~brandon_g

-Brandon


chatbox - Chatbox Detail Color Changes Brando10
Remember to mark your topic chatbox - Chatbox Detail Color Changes Solved15 when a solution is found.
General Rules | Tips & Tricks | FAQ | Forgot Founder Password?

chatbox - Chatbox Detail Color Changes Scre1476
Team Leader
Review Section Rules | Request A Review | Sticker Points
brandon_g
brandon_g
Manager
Manager

Male Posts : 10106
Reputation : 923
Language : English
Location : USA

https://www.broadcastingduo.com

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum