Custom colour

Hi

Add this code:

Code: Select all

.nspLinks ul li h4:hover,
#gkBottom2 ul li:hover {
background-color: #AA1A1A;
}

.nspLinks ul li h4:hover a,
.nspLinks ul li h4:hover a:hover,
#gkBottom2 ul li:hover a,
#gkBottom2 ul li:hover a:hover {
color: #ffffff;
}


That looks really good, Thanks I appreciate all your help.

Is there a way to make the calender change as well?

Hi

This code will do:

Code: Select all

.k2CalendarBlock table.calendar tr td.calendarDateLinked a:hover {
    background: none repeat scroll 0 0 #AA1A1A;
}


Hi

This code will do:

Code: Select all

.k2CalendarBlock table.calendar tr td.calendarDateLinked a:hover {
    background: none repeat scroll 0 0 #AA1A1A;
}


That works Teitbite

Is there anyway to make todays date be the same, as the previous dates now work thanks to your code. But today's date shows black and white.

Cheers

Hi

Sure, with this code:

Code: Select all

.k2CalendarBlock table.calendar tr td.calendarTodayLinked a:hover {
    background: none repeat scroll 0 0 #AA1A1A;
}


Brilliant, that worked perfect.

Another colour question.

When you highlight words on this forum to copy paste it is orange and white. How do I change that to the red and white?

Thanks.

Hi

Please add this to css:

Code: Select all

::selection,
::-o-selection,
::-ms-selection,
::-moz-selection,
::-webkit-selection {
    background: #AA1A1A;
    color: #FFFFFF;
}


I added it to css/overide but nothing has changed yet.

Hi

Ok. Please try to split it like this:

Code: Select all

p::selection {
    background: none repeat scroll 0 0 #AA1A1A;
}

p::-moz-selection {
    background: none repeat scroll 0 0 #AA1A1A;
}

p::-webkit-selection {
    background: none repeat scroll 0 0 #AA1A1A;
}

p::-ms-selection {
    background: none repeat scroll 0 0 #AA1A1A;
}

p::-o-selection {
    background: none repeat scroll 0 0 #AA1A1A;
}


Hi,
Its working now but the text isnt white and its not working on some sections on the homepage and article pages.

Hi

To be honest, I've never been using that, so You are the tester Try this maybe:

Code: Select all

body::selection {
    background: none repeat scroll 0 0 #AA1A1A;
    color: #FFFFFF;
}

body::-moz-selection {
    background: none repeat scroll 0 0 #AA1A1A;
    color: #FFFFFF;
}

body::-webkit-selection {
    background: none repeat scroll 0 0 #AA1A1A;
    color: #FFFFFF;
}

body::-ms-selection {
    background: none repeat scroll 0 0 #AA1A1A;
    color: #FFFFFF;
}

body::-o-selection {
    background: none repeat scroll 0 0 #AA1A1A;
    color: #FFFFFF;
}


I removed the previous code and added the new code, but its went back to the normal.

Hi

Than I'm afraid that I do not know an answer to that. I've been using this as a reference to my answer: http://www.w3schools.com/cssref/sel_selection.asp hope You will learn more of it. My last chance try would be an exact code as they are shearing there:

Code: Select all

::selection {
color: #ffffff !important;
background-color: #AA1A1A !important;
}

::-moz-selection {
    background-color: #AA1A1A !important;
    color: #ffffff !important;
}


but I think we have tried that already, but without !important rule which I think may help.

Fantastic that worked.

When I hit Control A on the front page.

The images are a light shade of blue, can that be changed to a light shade of red to match the recent changes that we have made?

Hi

Sorry. I do not know how to do that. Uncle google does not help to find the solution either

Appreciate you looking, thanks.

The 4 big red boxes at the bottom, the category (when red part is up) at the bottom is grey and when you hover over it, it turns orange.

When the red block is up, is it possible to keep white before and after it is hovered over.

Hi

I think this should help:

Code: Select all

.nspArt:hover p.nspInfo a,
.nspArt:hover p.nspInfo a:hover {
color: #fff !important;
}


Perfect.

My last question on custom colours.

Were the images are 'TOP' and 'POPULAR' on the front page, how do I change them to red?

Hi

Here is the code:

Code: Select all

.box.badge-popular .header:after {
    background: none repeat scroll 0 0 #AA1A1A;
}

.box.badge-top .header:after {
    background: none repeat scroll 0 0 #AA1A1A;
}


Thanks that worked.

Front Page looks great now with your help .

Hi

I'm glad I could help. Please do not hesitate to ask if You will need me again.