More Readable ShoutBox Text Colors
Filter
Show All PostsReplies
<p>This is the code I use to make the shoutbox a little prettier and easier to read. It keeps the background colors (since those are fun) but mutes the color beneath the text. You kinda have to see it to know what I mean, so give it a try :)</p>
<p>
.shoutbox_shout{color:!important;position:relative;margin:3px;border:0!important;}
.shoutbox_shout:before{content:&;&;;background-color:;position:absolute;right:0;top:20px;left:0;bottom:0;z-index:-3;}
.shoutbox_user{border-radius:unset!important;border:0!important;font-weight:normal;}
.shoutbox_user a{color:!important;font-size:110%;}Hey !! So as you know, the SB has a problem where text is sometimes unreadable or makes your eyes hurt on darker or more vibrant background colors.
We don't want to disallow any background colors, so I've been thinking about how to officially solve this problem.
The custom CSS quoted above is something I had written a while back to solve this very problem. I hesitate to make it "official" CSS since it started as a custom CSS, but I think it makes the SB more readable and easier on the eyes, and I haven't been able to improve on it much.
I like that, with custom CSS, you can opt in and opt out of using it. I love that we all have that choice. In this case, though, it seems like there's a huge benefit to making this the default for everyone: it means you don't have to worry about picking a background color that looks nice with the CSS but will look bad/unreadable to people who aren't using it.
I wanted to ask the community to give the CSS above a try, and let me know: would you like to see this become the official CSS? If we go ahead and make this the default SB style, are there any downsides you can foresee that I don't? I want to be sure to hear your thoughts and concerns before going through with something like this.
Thanks <3
🐝 ☕ bug (he/him) | your friendly neighborhood code wrangler. stay in the loop! join and check out the latest admin post highlights