CSS in unit_line

[riczam]

Hi, I am trying to change the colours in the units name lines of the curriculum at the "Course status templates > Default". I have been playing and unsucceed with: .unit_line a:hover{color:#78c8c9 !important;} .unit_line a:focus{color:#78c8c9 !important;} .unit_line a:active{color:#78c8c9 !important;} The problem is a lack of contrast between the blue and the background. I want to change it when it is active, when it is approached and when it has hovered. What is the right code? Regards Ricardo Film showing the case: https://screencast-o-matic.com/watch/cYXllvMEyh

[Veronica]

hi yes the above code is fine but can you please explain what you want to change? the color of the text or the background?

[riczam]

Hi Veronica, It is the colour of the text when approaching and when immediately over (both). My problem is the contrast between the colour of the text and the background. I managed to change it when the cursor is just over the text. I guess this is the hoover function. Nevertheless, when I approach the cursor, I mean in the area but not exactly the text, I do not know how to change it and still remains dark blue. Thanks Ricardo

[Veronica]

yes i can check it please provide your details i will take a look

[riczam]

This reply has been marked as private.

[Veronica]

thanks for sharing details checking

[Veronica]

on hover you can use this: https://prnt.sc/vn7lnh .page-template li a.unit:hover { color:#435; } and remove this one: https://prnt.sc/vn7miv

[riczam]

Hi Veronica, Thanks for the code. I used it in a different colour: .page-template li a.unit:hover {color:#78c8c9;} Nevertheless, it is not enough. While this code is changing the colour when receiving the hoover, it is still dark when is active or when you approach the area. Then I tried with this code and get identical results. .page-template li a.unit:hover {color:#78c8c9;!important;} .page-template li a.unit:active {color:#78c8c9 !important;} .page-template li a.unit:focus{color:#78c8c9 !important;} What I do not know is how to do when you say: "and remove this one: https://prnt.sc/vn7miv" This is probably the key because is the color that is provoking the problem but I do not know which code will remove it. Thanks Ricardo

[Ada]

Please append this code to change the color when the list element is active and when you hover on the list

.course_timeline li.active a{
    color:#f8e5e5;
}

.course_timeline li:hover a{
    color:#84c6c0;
}

[riczam]

Hi Ada, This code works fine. Thanks a lot Ricardo

[Veronica]

thanks for your confirmation topic closed

[Author]

Posts