taking a look now…
Update:
Took a look real quick.
“ul.bbp-replies-widget li a.bbp-reply-topic-title:link” does work to target unvisited links.
“ul.bbp-replies-widget li a.bbp-reply-topic-title:hover” does not work.
“ul.bbp-replies-widget li a.bbp-reply-topic-title:active” does not work.
“ul.bbp-replies-widget li a.bbp-reply-topic-title:visited” does not work.
Not even any basic standard “a:hover”, “a:visited”, or “a:active” target elements are working. That’s very telling that something isn’t right.
It’s as if you have something preventing/overwriting specific pseudo elements. Will look into it a little more tomorrow, but it’s time for me to get some sleep tonight.
-
This reply was modified 3 years, 2 months ago by
codejp3. Reason: added update
Thread Starter
cj74
(@cj74)
Good Morning
Tried again to see if it may have changed. Problem still there. I’ve left it as is so you can see what’s going on. Also, i tried changing widget titles many times by that code but nothing is happening. By widget titles we mean the words “Recent replies” and “recent topics”, correct?
@cj74 – looked at the site.
1.) the :hover : active :visited appear to be working properly.
However, like I said above, the “visited” may confuse people and not look right with your site, so I would probably remove that, or make it a different color to distinguish it apart from hover/active links. Here’s a revised version of that:
/* Topics & Replies Widget Links */
ul.bbp-replies-widget li a.bbp-reply-topic-title, ul.bbp-topics-widget li a.bbp-forum-title {
color: #3a3a3a;
}
/* Topics & Replies Widget Links Hover/Active */
ul.bbp-replies-widget li a.bbp-reply-topic-title:hover, ul.bbp-replies-widget li a.bbp-reply-topic-title:active,
ul.bbp-topics-widget li a.bbp-forum-title:hover, ul.bbp-topics-widget li a.bbp-forum-title:active {
color: #010203;
}
/* Topics & Replies Widget Links Visited */
ul.bbp-replies-widget li a.bbp-reply-topic-title:visited,
ul.bbp-topics-widget li a.bbp-forum-title:visited {
color: red;
}
2.) The title will work, but requires adding “!important;” on the end of the value like this:
/* ALL Widget Titles */
aside.widget h2.widget-title {
color: red !important;
}
/* ONLY Replies Widget Title */
aside.widget_display_replies h2.widget-title {
color: red !important;
}
/* ONLY Topics Widget Title */
aside.widget_display_topics h2.widget-title {
color: red !important;
}
/* BOTH Topics & Replies Widget Titles */
aside.widget_display_replies h2.widget-title, aside.widget_display_topics h2.widget-title {
color: red !important;
}
I won’t be around much for the rest of the day. Dog-watching for someone and have a doggy emergency to tend to. 🙁
Thread Starter
cj74
(@cj74)
@codejp3
Once i removed the “visited” and added the “important” to the code everything seems to be working perfectly. I have done some changes and will go with them for now. Thanks
Thread Starter
cj74
(@cj74)
At your convenience please let me know if the homepage looks alright or if you would suggest something different.
What’s wrong with the “red” “green” “blue” “purple” colors I used in my code snippets? You didn’t use them! 🙂
Seriously though, I thought it looked fine before but I think it looks slightly better now, just because there’s subtle contrast between the elements that it didn’t have with your default styling. Even though that particular red for widget titles doesn’t seem to be used anywhere else on your site that I could see….it works pretty well.
As for suggestions, you could add subtle transitions to make the hover/active links change colors with a subtle effect. Just a thought.
There’s really no limit on what you can style with CSS other than what CSS can/can’t do. It’s a balance between how picky you are and if it’s worth the time to make the changes you want. If your goal is more about the learning experience than the end result, then really dig into CSS documentation and play around with it.
Thread Starter
cj74
(@cj74)
“What’s wrong with the “red” “green” “blue” “purple” colors I used in my code snippets? You didn’t use them!“
Ha! I am gonna plead the 5th on that one 😉
You’re right about the subtlety and that shade of red. I did try a few shades including one that is already there, but it came out different in this case. Some of them were too bold and some you could barely see. This one was just about right.
Thanks a lot @codejp3
