Jump to content

Firefox 3 Skins


Recommended Posts

Thx Kinsemon!!

I was just waiting for this...

Here it is...

Preview:

th_Firefox3toSafari-Preview.png

It includes a basic guide explaining how to apply the new settings

and scripts for Stylish and Chrome.css

** Important:

It DOES NOT include any theme/skin.

Comments will be much appreciated

Thx!!

_____________________________________________________________

Update 1:

- Changed Bookmark and Tab Fonts Color and Shadow

- Fixed Menu separator height

- Fixed Bookmark Itens positions

Link to comment
  • Replies 187
  • Created
  • Last Reply

Top Posters In This Topic

Hi,

i have tried this stuff on XP and it work more or less, but

without "Hide Menu-Bar" and without the Lucida Grande font looks it terrible.

Please make it more complete!

It would have otherwise the side effect that i receive countless support question and when way too many Windows support questions arrive will i add code in the themes, which make it impossible to install it on Windows or Linux.

change for example;

font-family: Lucida Grande !important;

to:

font-family: "Lucida Grande", "Lucida Sans", Arial, sans-serif !important;

add a download link for the Lucida Grande font

make it usable without "Hide Menu-Bar"

and fix some other bugs ... and so on

and change by the way:

tree:not([hidecolumnpicker=true]) treechildren::-moz-tree-row(odd) {

background-color: -moz-oddtreerow;

}

richlistitem[type=download][alternate=true]:not([selected=true]) {

background-color: -moz-oddtreerow;

}

replace the -moz-oddtreerow with a CSS color

Cheers

Link to comment

WOW!!

First of all Thx so much for the theme!!!

Really great job!!

And Its an honor hearing from you!!!

Sorry..

But I really didnt undertand many things you said..

Once you are a professional and im a beginner.

Actually this is the first time i working with this...

So I cant do much about it.

im trying to do this changing the minimum code as possible...

To not to turn a good code into a horrible one...

Although, Ill give my best to modify somethings like making the menu usable without hide menu-bar...

but the only things ive managed to understand how it work, until now, are margin, padding, color, font, shadow.... I dont have any idea about the code you posted do... (after the fonts...)

My challenge is to fix the major bugs the theme have on Windows

To make it minimally usable and with a Safari look..

No matter how many and wich plugins/fonts i have to use..

Because i think the kind of people that will use this theme on Windows arent the same that will use it on Mac...

For example, Im sure many people here on Aqua-Sof are using this

with the same propose that im using: to simply emulate a Safari look

But personally i think its quite functional, good looking and the best Safari theme for Firefox 3 on Windows by far.

Your help would be MUCH appreciated, not just by me but for everybody who tries to emulate Mac on Windows.

Thx again for the theme and for the comment!!!

Link to comment

use for example

tree:not([hidecolumnpicker=true]) treechildren::-moz-tree-row(odd) {

background-color: #ECF3FE !important;

}

or use #F0F0F0

and look then for example in the Download-Manager or the Dom-Inspector to see why.

---

and use #BFBFBF for the main menu background and for the inactive state #E1E1E1,

when you (or other) add something to support it without the "Hide Menu-Bar" extension is it necessary.

(and remove the borders there)

----

and

"To make it minimally usable ...

Yes, that is the main problem with nearly all these Mac Firefox themes, which are build for Windows.

They are countless, which have these "minimally usable " demand. Nearly all are only terrible ;-)

When you or other here have the same demand ... Ok, but is then waste of time.

The main reason, why i build no windows versions are support questions .. i don`t want to answer every day countless Windows/Linux support questions ..

I would help here (a little), but not with these "minimally usable" demand

Cheers

Link to comment

I see..

But "Minimally usable" its the only i can do...

Sry for that...

Im doing my best, but ,just like you probably did, i would have to study a lot to do something better...

Last night ive spent 3 hours to just change shadows and fonts color...

Im not even working with the whole code...

Just with the codes that was posted here and some other that i got on the site that kinsemon posted...

Also i really dont see the need of so much work, once i think the theme is very good and without major bugs... (not anymore, i think)

Thx

Link to comment

@Darkfire,

As per Aronnnax hints.

If you can open tha .jar file, find and edit this lines...

> In globaltree.css:

tree:not([hidecolumnpicker=true]) treechildren::-moz-tree-row(odd) {

background-color: #ECF3FE !important;

}

> in mozappsdownloadsdownloads.css:

richlistitem[type=download][alternate=true]:not([selected=true]) {

background-color: #ECF3FE !important;

}

This is supposed to make the alternate lightblue-white-lightblue rows in the specified list or menu.

@Aronnax

Instead of Hide MenuBar, most (if not all) windows firefox users trying to simulate/emulate the safari look use Compact Menu2 which by the way just got updated for Firefox3.

And your skin indeed look much better than even Safari for Windows 3. People being people, they will skin and/customize your theme in every whichway possible (look at Monstr's version, LOL!). So just watch and enjoy (or feel indignant!) the whole show, and probably wonder if they'll give you credit for the original theme or not.

Link to comment

Hmm..

Now ive got it Kinsemon..

Ill try it later..

But is there a way to use it without changing the original theme files?

Im trying to fix menu colors now..

And im almost there..

Ive managed to change background color for both window states

But i cant figure out how to take off the line separator...

Also ive noticed that the size of hover:active menu light is bigger than hover light...

Maybe thats the problem, but i dont know how to change it either...

Any Help???

Oh..

One more thing..

Is there a way to add some shadows to Menu fonts??

@Aronnax

See..

Im not the only one who think like that...

Link to comment

Could I list the things that I have faced and couldn't fix yet.

1. Bookmarks icon

Do you know howt to make it like in Safari on bookmarks panel with hover effect ?

2. Progress bar problem

can't see that progress blue line in downloads section.

3. Sidebar on the right problem

and a wish

4. Highlighted active form on a page

Is it possible to make stylish to highlight any active form field like in Safari. like on Aqua-soft search filed.

Link to comment
Could I list the things that I have faced and couldn't fix yet.

1. Bookmarks icon

Do you know howt to make it like in Safari on bookmarks panel with hover effect ?

2. Progress bar problem

can't see that progress blue line in downloads section.

3. Sidebar on the right problem

and a wish

4. Highlighted active form on a page

Is it possible to make stylish to highlight any active form field like in Safari. like on Aqua-soft search filed.

1 if you mean this...

http://www.kwikpiks.com/files/32/favicon.png

/* Show favicons on bookmarks */

.bookmark-item > .toolbarbutton-icon {

display: -moz-box !important;

max-width: 20px;

max-height: 16px;

padding-right: 6px !important;

}

/* Show a minimalistic background on hover on bookmarks */

.bookmark-item:hover > .toolbarbutton-icon {

background: url("chrome://global/skin/toolbar/toolbarbutton-customhover-mid.png");

}

.bookmark-item:hover:active > .toolbarbutton-icon {

background: url("chrome://browser/skin/bookmark-open-mid.png");

}

Note the references to images in GrApple skin.

2. For the following, in userChrome.css. You have create an image (eg. "progresschunk.png") and place it in your Chrome folder...

progressmeter {

-moz-appearance: progressbar;

margin: 2px 4px;

min-width: 128px;

height: 13px;

progressmeter[mode=undetermined] {

background: url("progresschunk.png") repeat-y top left;

height: 13px;

}

.progress-bar {

-moz-appearance: none;

height: 13px;

background: url("progresschunk.png") repeat;

}

Haven't tried userchrome.css. I just extracted my tweaks from inside the skin's .jar.

3./4. Well....

EDIT: Here, use this for progresschunk.png

http://www.kwikpiks.com/files/32/chunks.png

Link to comment
@Aronnax

Instead of Hide MenuBar, most (if not all) windows firefox users trying to simulate/emulate the safari look use Compact Menu2 which by the way just got updated for Firefox3.

And your skin indeed look much better than even Safari for Windows 3. People being people, they will skin and/customize your theme in every whichway possible (look at Monstr's version, LOL!). So just watch and enjoy (or feel indignant!) the whole show, and probably wonder if they'll give you credit for the original theme or not.

Do whatever you want ;-)

(but don`t build theme ports with the GrApple name)

i wonder only, why all these windows themes are crap,

and here is one example more, why it happen.

by the way,

/* Show favicons on bookmarks */

the suggestion here is as well incomplete (crap)

use for example the stuff from:

http://www.takebacktheweb.org/CaE.html

Cheers

Link to comment
You would have noticed..

It changes a lot from the original one..

The shadows gets to the right place, the navigation bar fonts changes, menus isnt transparent anymore..

If you really dont know if it worked post a screen and i will tell you...

Nah, it sure didn't work. I tried to do the stylish one. How do you do the one w/o using stylish? It's confusing what you mean on the guide.

Link to comment

Good News!!!

Ive Updated the script!!

I Think it is much better now...

Preview:

th_Firefox3ToSafari-Preview2.png

The main change is the addition of Bookmark Icon.

The bookmark's name have to be "bookmark" to work, but it is possible to configure it to use with any name. To do it simply change "label="bookmark"" to "label="YourName"" in the end of the code.

Ive also included the code to add another "Icon Only" bookmark.

Its configured to use the name "Teste" but you can change it the same way ive explained before

It also uses a Little House Icon, but you can change that modifying the code:

list-style-image: url("chrome://browser/skin/home.png") !important;

To add more icons, just copy any times you want the "Change Icons For other Itens" and change name and image value.

_________________________________________________________

Update 2:

- Added the bookmark icon and the code for other icons

- Fixed fonts/shadows (once again... but now i think it is Ok)

- Fixed Download Bar Background color

- Included the necessary Fonts

Firefox 3 to Safari - Guide - Update 2.zip

Link to comment
Good News!!!

Ive Updated the script!!

I Think it is much better now...

Preview:

th_Firefox3ToSafari-Preview2.png

The main change is the addition of Bookmark Icon.

The bookmark's name have to be "bookmark" to work, but it is possible to configure it to use with any name. To do it simply change "label="bookmark"" to "label="YourName"" in the end of the code.

Ive also included the code to add another "Icon Only" bookmark.

Its configured to use the name "Teste" but you can change it the same way ive explained before

It also uses a Little House Icon, but you can change that modifying the code:

list-style-image: url("chrome://browser/skin/home.png") !important;

To add more icons, just copy any times you want the "Change Icons For other Itens" and change name and image value.

_________________________________________________________

Update 2:

- Added the bookmark icon and the code for other icons

- Fixed fonts/shadows (once again... but now i think it is Ok)

- Fixed Download Bar Background color

- Included the necessary Fonts

Where can I find the Lucida Grande Font I looked on Google.

Link to comment

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now

×
×
  • Create New...