How do I change the go-top:hover Icon color?

Question

I'm trying to change the go top icon when the cursor is hovering over to a white background and green arrow but the code below does not seem to be working;

.go-top:hover {
    background-color: #fff;
    color: #069146;
    opacity: 100;
}

Instead I am getting an orange arrow. Any advice on how to fix it?

Thanks

Answer 1

You forgot to set fill on .go-top:hover svg :

Replace

.go-top:hover svg {
fill: #d65050
}

with

.go-top:hover svg {
fill: #069146
}

opacity: 100 isn't valid. I think you meant 1 . See How to define Opacity by percentage in CSS?

Optionally you can use white in color instead of #fff