Tips on Changing Find bar_buttons location & highlights
Taking the archived topic a bit farther https://support.mozilla.org/en-US/questions/976166?page=1, I added code for the "phrase not found" background & text color.
Thanks to cor-el & all others that contributed. I wanted the "Phrase not found" label to show up better. So I played around & added this to the already great code to bring back old Find bar characteristics, offered by others in the above topic. It all still works in Fx 30 - for me.
Added to code in the link, this colors background of "Phrase not found" (yellow) & makes font red, bold. Colors or bolding are easily changed.
* Add background color to "Phrase not found;" set font color & make bold */
.findbar-container>.findbar-find-status {
background-color:#ff8 !important;
color: red;
font-weight: bold;
}
Don't know why, but using "code block" formatting in this forum, inserts blank line after, "...findbar-find-status {"
The following is for "coding-challenged" users - like me. Changes up background color & font weight for active "Highlight All" & "Match Case" labels. Can change text color as well, if desired.
/* add a background color to the checked Highlight and Case sensitive buttons.
Make checked buttons' font bold; change font color if desired. */
.findbar-highlight[checked]>label {
background-color: lightgreen !important;
color: black;
font-weight: bold;
}
.findbar-case-sensitive[checked]>label {
background-color: lightgreen !important;
font-weight: bold;
}
.findbar-case-sensitive[checked]+label { display:none !important; } /* hide "(Case sensitive)" label
Those now using userChrome.css to add code for GUI changes might try Stylish addon https://addons.mozilla.org/en-US/firefox/addon/stylish/?src=search. It allows instantly previewing new code ("styles") effect on Fx or Tb, rather than having to restart. Important! - it also alerts to errors in the entered code; giving indication of error type & the line, space where the error exists. Easier to find mistakes - why code isn't working.
Very simple - just click "Write new style," give it a name; copy / paste code like from this topic; then click Preview to see effect (or it may point out errors). Also, many custom styles for almost anything, available on Userstyles.org - can be instantly loaded.
Modified by cor-el
All Replies (11)
Hi Joebt, This is awesome! Thank you for investigating this! Have you ever considered adding to MDN's site?
Hee, hee. No one's ever mistaken me for someone that knows anything about coding.
Where on MDN do you mean & in what form? I've been there many times, but never seen user content posted. Do you think anyone would be interested?
I only came up w/ the part about changing background color & font weight on the highlight / match case & "phrase not found" buttons. Working off the code submitted by the hard working people in the other linked discussion.
Without their input, I'd never have figured it out (not exactly). I'll take a little credit for reading between the lines, but that's it.
Modified by JoeB
Unable to add an image. UPDATE 7/18/2014 - problems posting images: Using a 3rd party image host: Screen of Find Bar changes, using cor-el's code from other linked discussion and my additional code in this discussion. If you don't like the color choices or bold font, just change them or "comment out" specific lines. If you want the change back, just uncomment. Like: background-color:#ff8 !important;
color: fuchsia; /*font-weight: bold;*/
[IMG]http://i59.tinypic.com/dyucfn.jpg/IMG
Note: adding image link from hosting site (copying the host's usual full path "[IMG]... /IMG" , doesn't imbed the image - only inserts the link (if embedding by that method ever worked on this forum). Though I can follow the above link.
Note: my entry in the edit screen for the closing "IMG" in brackets (just above) is entered correctly - inside brackets. Forum software appears to change the closing bracket statement into a forum help link.
Below, using html code to insert an image (using a formatting toolbar) seems to work here, but most users wouldn't have that capability.
Modified by JoeB
See also
- Can't post images in Firefox support /forums/contributors/710493
I will try to add an image myself to this thread see what happens.
John99, was the smilie face inside a thin border box, the image you intentionally added? Or just an emoticon?
It is an image I use as an avtar. The image seen is a thumbnail, but in this case is small anyway. I note it fails to expand I guess it is too small for the software to deal with it properly.
Forum markup links may be put within a single pair of brackets with optional anchor after an intervening space. So this question can use
- This [/questions/10897 sometext]
produces sometext - Whereas /questions/10897 some text is not a link
- But full https://support.mozilla.org/en-US/questions/1010897 is a link
- KB articles use double brackets and the article title
[[markup chart]]
Gives markup chart
The attach image feature is intended to be used by uploading an actual file not by using a link. The html you used is a largely undocumented feature. It is used in canned responses and by some contributors.
Here's an attempt at direct uploading a small image. I'll wait a good while to see if gets added (they aren't added right away).
Modified by JoeB
Are you using the Browse button to attach the image or do you want to use HTML code or an image uploaded to the Media upload (/media/uploads/) to embed the image directly?
I am "waiting" to see if the last test image is eventually added, by using the Browse / add image method. That's easiest, if a forum supports it - not all do.
It's been 20 min since I added the test image, in (new) reply, just above your last comment. Still hasn't shown up. If it takes that long for images to be added, users may not want to fool with it??
We could / probably should move this (about images) to its own discussion?
Modified by JoeB
Did you see the image with using Preview?
No, at least not before.
Until Noah_SUMO (see post about it at link below) figured out the problem of not being able to post images on Mozilla.org was related to having DOM storage disabled in Firefox (which I did). https://support.mozilla.org/en-US/forums/contributors/710493#post-60996
Testing re-enabling DOM storage in about:config ("dom.storage.enabled" = true), images upload OK & preview works.
I won't pretend to know why Mozilla.org must store a 20 kb image in DOM storage while most forums don't. Nor why preview would completely fail due to DOM storage. But then, I haven't tried direct image posting on every single forum on the web. :D
Modified by JoeB