Hi guys.. Wanted to know if theres a css that can change the background color of the words that are searched in 'search-as-you-type.' Take a look at the example circled in red in the screen shot. Thanks.
.
CSS to Color Background of Searched Words?
- jscher2000
- Posts: 11760
- Joined: December 19th, 2004, 12:26 am
- Location: Silicon Valley, CA USA
- Contact:
- dickvl
- Posts: 54161
- Joined: July 18th, 2005, 3:25 am
Re: CSS to Color Background of Searched Words?
Changing those colors can be difficult because there is code present to ensure proper contrast (this can swap text and background color) and using a dark theme can make things more complicated (on a light background you can use almost all colors).
It is usually the background set via ui.textSelectBackgroundAttention
https://searchfox.org/mozilla-release/s ... ndFeel.cpp
It is usually the background set via ui.textSelectBackgroundAttention
https://searchfox.org/mozilla-release/s ... ndFeel.cpp
Last edited by dickvl on October 11th, 2020, 2:42 pm, edited 1 time in total.
- zlaer
- Posts: 505
- Joined: June 29th, 2018, 11:11 am
Re: CSS to Color Background of Searched Words?
Hi jscher. Appreciate the input. Unfortunately the code from link you provided doesnt change the background color. Thanks for trying anyway.jscher2000 wrote:Does this still work (I have not tested it):
https://www.reddit.com/r/firefox/commen ... _color_is/
- zlaer
- Posts: 505
- Joined: June 29th, 2018, 11:11 am
Re: CSS to Color Background of Searched Words?
Hi. Appreciate the link.. but the link is broken.dickvl wrote: It is usually the background set via ui.textSelectBackgroundAttention
https://sxr.mozilla.org/mozilla-release ... ndFeel.cpp
I tried 'ui.textSelectBackgroundAttention' which does change the background color but does so randomly as its a shot in the dark trying to find the right hexadecimal color code with a dark background that appeals to me. Sadly I found an adequate color but it will work on sites with light backgrounds while the background color changes to white on sites with light background colors.
It appears that the code adjusts to the website's background color. So basically I'm back to square 1. Wish there were a way to turn off this adjustment and just apply a static background color without it dynamically changing according to a site's background color. If thats possible let me know. Thanks.
- dickvl
- Posts: 54161
- Joined: July 18th, 2005, 3:25 am
Re: CSS to Color Background of Searched Words?
Sorry, I tried to convert a DXR link and went wrong.
https://searchfox.org/mozilla-release/s ... ndFeel.cpp
https://searchfox.org/mozilla-release/s ... ndFeel.cpp
- zlaer
- Posts: 505
- Joined: June 29th, 2018, 11:11 am
Re: CSS to Color Background of Searched Words?
Wow.. theres hundreds of lines. Is it possible for you to point me to the right codes? Thanks.dickvl wrote:Sorry, I tried to convert a DXR link and went wrong.
https://searchfox.org/mozilla-release/s ... ndFeel.cpp
- dickvl
- Posts: 54161
- Joined: July 18th, 2005, 3:25 am
Re: CSS to Color Background of Searched Words?
My point is to get a list of ui.text prefs that are used for various cases and search the source code to see what they are about.
https://searchfox.org/mozilla-release/s ... tion&path=
https://searchfox.org/mozilla-release/s ... rFrame.cpp
https://searchfox.org/mozilla-release/s ... tion&path=
https://searchfox.org/mozilla-release/s ... rFrame.cpp
- zlaer
- Posts: 505
- Joined: June 29th, 2018, 11:11 am
Re: CSS to Color Background of Searched Words?
I checked out the links. Maybe you can still help. The line that works for me is "ui.textSelectBackgroundAttention." But you can only apply a few color codes that are darkish but the grand majority of color codes will turn to white background. Do you know any color codes that are dark that actually work?dickvl wrote:My point is to get a list of ui.text prefs that are used for various cases and search the source code to see what they are about.
https://searchfox.org/mozilla-release/s ... tion&path=
https://searchfox.org/mozilla-release/s ... rFrame.cpp
-
- Posts: 253
- Joined: January 29th, 2016, 4:36 pm
Re: CSS to Color Background of Searched Words?
This works well for me on various color themes:
ui.textHighlightBackground: blue
ui.textHighlightForeground: white
ui.textSelectBackgroundAttention: blue
ui.textHighlightBackground: blue
ui.textHighlightForeground: white
ui.textSelectBackgroundAttention: blue