[RESOLVED] Firefox (12) Color

[bk]

Hello,

Please, i search desperate how to change this...
http://img822.imageshack.us/img822/3404/blueqb.png

I would like this to be like this...
http://img806.imageshack.us/img806/1097/with.png
(as is the case with this Visual Style : http://garbanzox.deviantart.com/art/Seven-Squared-A-Windows-7-VS-141426813)
... but despite my research, i cannot find where it is located.

If someone can help me to solve this problem, it would be terrible.

Sorry for my english, i am french.

[JoCe-from-France]

Hi bk,

Have you tried this 3am map in the 'Tutorials>Maps' section ?

http://vistastylebuilder.com/forum/index.php?topic=1462.0

otherwise, it's a good occasion to go deep into UserChrome.css & UserContent.css stylesheets...
http://www.tweakguides.com/Firefox_12.html
& perhaps https://addons.mozilla.org/fr/firefox/addon/stylish/

[3am]

That map is only good for FF3 not FF12

The areas in FF12 you want are affected by msstyles by Fonts & System Metrics > BTNFACE:COLOR and images at Windows & Caption Buttons > Aero > DWM Window > Frames > Window > Top. Otherwise it is images and gradients in Firefox GUI that can be changed only by using Stylish script.

If you want it to look EXACTLY like it does using this guy's msstyles then:

1) Replace your BTNFACE color with his color and your Top Frame images with his images ( using the Import button). Don't forget that this will also change all your top frames and BTNFACES too

2) Or learn how to use Stylish script and skin Firefox on your own

[bk]

Thank you for your answers.

Have you tried this 3am map in the 'Tutorials>Maps' section ?

http://vistastylebuilder.com/forum/index.php?topic=1462.0

No, but other more topical non-more.

otherwise, it's a good occasion to go deep into UserChrome.css & UserContent.css stylesheets...
http://www.tweakguides.com/Firefox_12.html
& perhaps https://addons.mozilla.org/fr/firefox/addon/stylish/

Thx for the links (i have already Stylish).

Fonts & System Metrics > BTNFACE:COLOR

Apparently... http://img152.imageshack.us/img152/7375/btnface.jpg ... it is identical.

Windows & Caption Buttons > Aero > DWM Window > Frames > Window > Top

I did not / This stops at, Frames
http://img543.imageshack.us/img543/2025/nowindow.jpg

It may be required that i should do this http://vistastylebuilder.com/forum/index.php?topic=1507.0 ?
(the latest version of WSB is well the 1.5 ?)

If you want it to look EXACTLY like it does using this guy's msstyles then:

1) Replace your BTNFACE color with his color and your Top Frame images with his images ( using the Import button). Don't forget that this will also change all your top frames and BTNFACES too

That is exactly what i would like to, but...

2) Or learn how to use Stylish script and skin Firefox on your own

"At worst", it remains for me to learn this solution, but if the guy who has made Seven Squared y arrived, is that it is possible.

---

A follow-up / Thank you again...



Off-topic : 3am, after watching your video http://www.screencast.com/users/am3am3/folders/Default/media/28018492-de16-4d8f-9336-61e229da58af (found by searching on the forum), i now know how to select a zone is to make it transparent with The Gimp

[Dave Senior]

Fonts, Colors, & System Metrics > Fonts & System Metrics > BTNFACE:COLOR    colors those  locations for me.
The  difference in tab color  is created by a different colored transparent overlay in the Firefox UI.
NOTE: Stylish scripts and/or firefox themes will override this location if themed to do so,are you using default Firefox?.
You could upload your theme  and I'm sure someone will take a look for you

>  BTNFACE:COLOR
  

[bk]

Fonts, Colors, & System Metrics > Fonts & System Metrics > BTNFACE:COLOR

It is in this place. Yesterday, saw that it was white, i have not even tried to change the color, but i was wrong.

are you using default Firefox?.

No, is not my default browser, because i use its portable version. Therefore, even if i don't use, it is IE.

Otherwise, i like this (it is done with Stylish ?) : http://img843.imageshack.us/img843/8763/58726027.jpg

Ca also, i like : http://img855.imageshack.us/img855/5920/39794600.jpg


Thank you very much to all.

:edit: Now, if you please, possibly, someone knows or can we change the color of the inactive tabs ?

[Dave Senior]

Yeah,my Firefox  is done with a large script in stylish or added to firefox user chrome,not something I could give  a tutorial on(it's about a   1000 lines of code ).

You can do the tabs with stylish,you'll find many  scripts and info about how to do this  at the stylish/userstyles  forums.

The VSB   web page can be set in the  Look  and Layout preferences in your VSB  profile (Dark Theme)

Note : When I asked if Firefox was default  I meant is it  standard/not customized,,as soon as you start customizing it there's a strong  chance the default  elements will get overridden.The answers you'll get here will  be for standard apps  etc .

[bk]

Yeah,my Firefox  is done with a large script in stylish or added to firefox user chrome,not something I could give  a tutorial on(it's about a   1000 lines of code ).

Ok, i understand, but if it does not bother you, can you give me at least the lines of code for the font size and the thickness of your Firefox button ?
http://img407.imageshack.us/img407/1051/boutonff.jpg

The VSB   web page can be set in the  Look  and Layout preferences in your VSB  profile (Dark Theme)

Thx 

Note : When I asked if Firefox was default  I meant is it  standard/not customized

Ok, my Firefox is very slightly customized. In addition to the button (that i changed with userChrome.css), i only use this style... http://userstyles.org/styles/48247/firefox-4-squared-appearance ... a little edited.

[Dave Senior]

Everything in  the screen I posted  is standard firefox ui (apart from  the back/forward buttons),that picture was just to show that  BTNFACE:COLOR   worked.As I said,when answering questions  here members    will assume you are using a standard firefox and you want  a way to  theme it using WSB ,Firefox mainly uses it's own Ui so there's not much you can do  to it with WSB.

Try this for the button Height (if you want to change the button  width  replace 'Height' with 'Width') and font size.

#main-window #appmenu-button
{
font-size: ?px !important;
max-height: ?px !important;
 }

[bk]

Everything in  the screen I posted  is standard firefox ui (apart from  the back/forward buttons),

Ah good, surprising.

that picture was just to show that  BTNFACE:COLOR

I had well understood  

Try this for the button Height (if you want to change the button  width  replace 'Height' with 'Width') and font size.

#main-window #appmenu-button
{
font-size: ?px !important;
max-height: ?px !important;
 }

Thank you very much, with this...

#main-window #appmenu-button
{
background: -moz-linear-gradient(top, rgba(255,255,255,.7), rgba(0,0,0,.7)) !important;
border-radius: 0px !important;
font-size: 11px !important;
max-height: 4px !important;
padding: 1px 7px 1px 3px !important;
}

... i have obtained :

---

About, i take this opportunity to ask you another question (and after i stop, to abuse your helpfulness / the off-topic) :

Do you know how to host an image / icon in mozilla ?
In order to, for example, replace the Firefox icon, of this Style... http://userstyles.org/styles/43303/ff4-little-button ... by :

[Dave Senior]

Easiest way:
In the script you linked to  delete the "chrome://branding/content/icon16.png"  between the brackets,now  left click between the brackets and use the ' insert ' button in stylish ,select 'Data url'  from the dropdown and  select your  white Firefox .png , now  preview and save.

Option 2:
 "chrome://branding/content/icon16.png"  is an address in your Firefox omni.ja file pointing to  a firefox icon with the name icon16,you  could look in the omni file and replace the icon with the one you want to use (make sure to rename it  icon16).This  way is not so good because when Firefox updates the omni file will be replaced with a  new standard file and you'll have to repeat the process.

      

[bk]

Too strong !
I know not if i have done well, but in any case it works :smiley-very-happy:
As i have not found a  branding folder (With portable Firefox and not portable)...
... before applying your option 1, i created [in the chrome folder, that i had already created (here : \FirefoxPortable\Data\profile) to place inside, userChrome.css] one branding folder.
Then, in this folder, i have created another folder named content.
And finally, i placed inside, the white icon named icon16.png

At the risk of repeating myself ^^, thank you very much

I will finally add the tag resolved, in the hope of obtaining any of even an answer to my questions to the intention to 3am.

:edit: In watching again your capture, i see that i am wrong in the creation of the tree of folders (i have reverse content and branding). So apparently, the path of icon16.png is not important (i hope that it is the same thing for about-logo ...)

[Dave Senior]

If you used the easy way ( insert >data url ) you can  forget about option 2.

Option 2 was just that,another option.

[bk]

Because of what you said about the updates of FF, i said to myself, as much choose option 1 (given the choice, i prefer not to have to start again  ).

Otherwise, here is the result :

I have tried to ensure that the icon is really white (and not gray), but tried only... Too complicated for me (fortunately, i found that finally it is not bad in gray also ^^)

See you...