Change colour of forum categories

[markoroots]

Hi there can some one say me how to change the colour of the forum categories?

https://vborg.vbsupport.ru/external/2015/02/22.png4

Thanks in advance.

[ozzy47]

That is the stylevar, forumhead_background

[markoroots]

Hi Ozzy and thanks for the reply.
I have just tried to modify the forumhead_background but only the colour of the last category of my forum change, the others are still like before.

[ozzy47]

Then there is something different with the custom style, provide a link.

[HM666]

Also provide what you changed it from and what you changed the stylevars to for the forumhead_background. It could be something really simple like putting it into the field incorrectly.

[markoroots]

Hi guys and thanks for your replies.
My forum is www.eliquid-forum.com
If you see the last category have changed the colour.
I have set the colour in this way. Or better I have tried to set the colour...
Style and Templates - Style Manager - Style variable Editor - Go - forumhead_background -
and I put inside this colour #21262b

But only the last category of the forum (in the home page), have changed colour. :(

[HM666]

Weird. Did you clear your cache in the AdminCP? Try that and then refresh your page.

[markoroots]

Yes I have done this, but nothing change.
I think that maybe the problem is that to colour that part in this template, is used an image and not a colour.
But I'm not sure...

[ozzy47]

In your additional.css you have this:

.tcat {
background: url("images/styles/Movara/style/tcatBG.gif") repeat-x scroll left top rgba(0, 0, 0, 0);
border: 0 none;
clear: both;
color: #343b42;
float: left;
height: 47px;
margin-top: 8px;
width: 100%;
}

.tcatLeft {
background: url("images/styles/Movara/style/tcatLeft.gif") no-repeat scroll left top rgba(0, 0, 0, 0);
height: 47px;
}

So change the values for the background there.

[markoroots]

Sorry but I don't know how to change values for the background.
The only think that I can do alone is try to change the colour there.. and I have also done it but still nothing change.

[ozzy47]

Like this.

background: red;

[HM666]

Try this then since Chris found the info:)

Open your additional.css template and look for the code he posted:

.tcat {
background: url("images/styles/Movara/style/tcatBG.gif") repeat-x scroll left top rgba(0, 0, 0, 0);
border: 0 none;
clear: both;
color: #343b42;
float: left;
height: 47px;
margin-top: 8px;
width: 100%;
}

.tcatLeft {
background: url("images/styles/Movara/style/tcatLeft.gif") no-repeat scroll left top rgba(0, 0, 0, 0);
height: 47px;
}

And try changing it to this:

.tcat {
background: #21262b;
border: 0 none;
clear: both;
color: #343b42;
float: left;
height: 47px;
margin-top: 8px;
width: 100%;
}

.tcatLeft {
background: #21262b;
height: 47px;
}

[markoroots]

Thanks for your replies guys.
But I have tried to change the code like HM66 says but still nothing change.

--------------- Added 1423751801 at 1423751801 ---------------

Ozzy I have tried also in your way but nothing change. :(
I don't know why Vb don't make a good graphic interface to control all these settings by the acp.
It's really incredible...

[ozzy47]

They did, but the style developer choose to not use it properly. :)

[HM666]

Er yeah have to agree 100% why on earth they did it that way who knows. Honestly if you are not well versed in something like this and you just have to have it changed you might want to look into hiring someone to change it for you. Its almost impossible to diagnose it without actually being in your admin panel and looking right at it I'd bet.

Try replacing the earlier code with this code:

.tcat {
background-color: #21262b;
border: 0 none;
clear: both;
color: #343b42;
float: left;
height: 47px;
margin-top: 8px;
width: 100%;
}

.tcatLeft {
background-color: #21262b;
height: 47px;
}

[John Lester]

Try changing it to this:


.tcatRight {
background:#21262b !important;
height:47px;
}

[ozzy47]

Really should not need the !important as the css is already defined in the additional.css file, all we are doing is changing it. But it won't hurt.

[HM666]

Really should not need the !important as the css is already defined in the additional.css file, all we are doing is changing it. But it won't hurt.

If the other css does not work though the OP may need that as it will force it to look at that css instead of some other rogue code elsewhere. Who knows where/what the original designer did exactly so using that edit might just help or it might not. Would not hurt to try if all else fails. :)

[markoroots]

Great! It works!
Many thanks guys. :)
Sure that for me is better to hire some one, because I'm going crazy...
but believe me in this period, I have really few money.. :( :)
Another little thing if it is possible is:
how to make the up corners of this element roundish?
Thanks in advance.

[HM666]

Just the top?

.tcatRight {
background:#21262b !important;
height:47px;
border:1px solid #000000;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}

You can change the border color to what color you want and the radius to a larger number if you find that 5px is not enough. I use 8px or sometimes 10px depending upon how I want the style to look.

[markoroots]

Hi HM and many thanks for your reply and also sorry for my delay reply...
But like you know back on the forums there are always 1000 things to do.

So I have tried your last code for the corners, but nothing change.

[Black Snow]

That is because you have 2 pieces of CSS that are conflicting and overlapping each other.

Find .tcat in your CSS, and delete: background-color: #21262b;

Then change the code that HM666 suggested and replace it with this:
.tcatLeft {
background-color: #21262b;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
height: 47px;
}

[markoroots]

Thanks to you all guys, now it work! :)
You are magics. :)