• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Hover over url change color

Sway

Active member
#1
I have created a little border around my Like, Reply, Report, and other links on threads but i would like to remove the text-decoration: underline; and replace that with a color changing link. I would like these to look more like buttons rather than links within buttons. How would i go about doing this?
 

Sway

Active member
#3
Code:
.publicControls .like:hover {
  text-underline: none;
  color: pink;
}
In extra.css should do it.
Alright that seems to work but the rest of the buttons are not working that way.
Code:
.publicControls .like:hover {
  text-decoration: none;
  color: limegreen;
}
 

MagnusB

Well-known member
#5
You can do comma seperation to add more:

Code:
.publicControls .like:hover, .publicControls .ReplyQuote:hover, .publicControls .hasPermalink:hover {
  text-underline: none;
  color: pink;
}
 

Sway

Active member
#6
You can do comma seperation to add more:

Code:
.publicControls .like:hover, .publicControls .ReplyQuote:hover, .publicControls .hasPermalink:hover {
  text-underline: none;
  color: pink;
}
Oh i got it to work. :)
Code:
.publicControls .like:hover {
  text-decoration: none;
  color: #009417;
}
.publicControls .ReplyQuote:hover {
  text-decoration: none;
  color: #009417;
}
.message .privateControls .item:hover {
  text-decoration: none;
  color: #009417;
}
I shall post this here for anyone else that stumbles upon this thread looking to do the same.
 

MagnusB

Well-known member
#7
Oh i got it to work. :)
Code:
.publicControls .like:hover {
  text-decoration: none;
  color: #009417;
}
.publicControls .ReplyQuote:hover {
  text-decoration: none;
  color: #009417;
}
.message .privateControls .item:hover {
  text-decoration: none;
  color: #009417;
}
I shall post this here for anyone else that stumbles upon this thread looking to do the same.
You can compress that code to:
Code:
.publicControls .like:hover, .publicControls .ReplyQuote:hover, .message .privateControls .item:hover {
  text-decoration: none;
  color: #009417;
}
Does the same and can be easier to manage.
 

Sway

Active member
#8
You can compress that code to:
Code:
.publicControls .like:hover, .publicControls .ReplyQuote:hover, .message .privateControls .item:hover {
  text-decoration: none;
  color: #009417;
}
Does the same and can be easier to manage.
I'm very lazy =/ I don't usually look into this hahaha. Thanks! :)