GrayModern for Firefox

[adam_tomlinson]

Nice one, i really like this theme. It will be perfect when any little bugs that exist have been fixed.

[Zeron]

Something I noticed in .2 as well but forgot to mention (oops!): All buttons (OK, cancel, etc. etc.) are vertically larger than the original Moz Suite GM.

Small icons mode's Home button looks much better, but still isn't perfect. Actually, it looks of better quality than the other buttons (comparatively speaking). It has more shading to it, and looks more raised than the others. Also, when compared to large icons mode, the Back and Foward buttons' dropdown list arrows make the icons space out unevenly. This is very noticable when the back/foward buttons are in the inactive state and the drop arrow does not appear.

As chuonthis said, text-only isn't aligned vertically properly.

Bookmarks|Add Bookmark (CTRL-D): Hovering over the dropdown arrow for the folder list makes it jump very noticably.

<b>Edit:</b> You might consider making the Go and Print buttons actual "buttons" like "OK" and "Cancel" in dialogs. Also, the throbber should have a large icon version like the original GM for Suite's 32x32 icon.

[Bernie]

...the words for Back, Forward, Reload, etc are still not aligned vertically but I don't use it anyway.

I spent quite a bit of time trying to make text-only mode work the way I wanted it to, and I noticed that even when I got them all lined up if I restarted the application they'd be offset again. I'm going to work on this a bit more for the next release (0.4), trying to make text-only mode work a lot more like it does in the Qute theme. In the meantime, though, hopefully there aren't a lot of people using that mode anyway.

Thanks once again for your feedback, chuonthis.

[Bernie]

Something I noticed in .2 as well but forgot to mention (oops!): All buttons (OK, cancel, etc. etc.) are vertically larger than the original Moz Suite GM.

I took a look at the original theme and you're right. I narrowed the problem down to the following in button.css:

Code: Select all

.button-box {
  border: 1px solid transparent;
  padding: 1px 4px 2px 3px;
}

This definition wasn't in the original theme (probably a Firefox only thing?) and when I remove it, it fixes the problem but creates a whole slew of problems with several of the other button derivations. Any suggestions as to how I can fix this button size problem?

Small icons mode's Home button looks much better, but still isn't perfect. Actually, it looks of better quality than the other buttons (comparatively speaking). It has more shading to it, and looks more raised than the others.

This is because I generated the small Home button from the larger one, wheras I believe the other small icons were generated from scratch (in the original theme). I will obviously have to look at these closer at some point, but right now it isn't a high priority.

Also, when compared to large icons mode, the Back and Foward buttons' dropdown list arrows make the icons space out unevenly. This is very noticable when the back/foward buttons are in the inactive state and the drop arrow does not appear.

I originally had the icons spaced out evenly and someone complained. Now I changed them so they're closer together and you don't like it I agree with you, though, so I've spaced them out again and they will appear as you requested in v0.4.

As chuonthis said, text-only isn't aligned vertically properly.

I'm aware of this, but it's low priority at the moment.

Bookmarks|Add Bookmark (CTRL-D): Hovering over the dropdown arrow for the folder list makes it jump very noticably.

This has been fixed...look for it in v0.4.

You might consider making the Go and Print buttons actual "buttons" like "OK" and "Cancel" in dialogs.

Good suggestion! I'll look into making that change. Do you know of a way to do this off the top of your head?

Also, the throbber should have a large icon version like the original GM for Suite's 32x32 icon.

Typically I'd agree with you, but I don't like the way a large throbber makes the Menu bar so large, so I'm sticking with the small throbber until some unofficial Firefox throbbers come out that I can replace it with.

Thanks for all your feedback, Zeron. It's appreciated. If you notice anything else, please let me know.

[steppenwulf241]

Typically I'd agree with you, but I don't like the way a large throbber makes the Menu bar so large, so I'm sticking with the small throbber until some unofficial Firefox throbbers come out that I can replace it with.

I seem to remember a theme (I believe it was Bluemonkey) that had the ability to change (resize?) icons based on where you put them. For example, if you placed a button in the Bookmark bar, it would appear different than if you had placed it in the Navigation bar. I believe the implementation in that theme was to change the icon to better match a differing color style - but, if you can have it completely change icons, then it appears as though you should also be able to have it resize as well. This would be nice if you wanted to place the throbber in the main Navigation bar like it is in Mozilla.

Besides, even if the dynamic resize option wouldnt be feasible, I also remember that your original intention for this theme was to make it look as much like the original Greymodern as possible. This being the case, one would assume that the throbber shouldn't be in the menu bar to begin with.

All this being said - I am VERY impressed with the progress you have been able to make thusfar, and I'm eagerly awaiting the next release.

[Bernie]

I...remember that your original intention for this theme was to make it look as much like the original Greymodern as possible. This being the case, one would assume that the throbber shouldn't be in the menu bar to begin with.

How right you are, steppenwulf241! Because I based my port on the Qute theme, I didn't even realize that I needed to move the throbber down to the primary toolbar. I used Mozilla 1.6 today and noticed the difference right away, so I'll try and get the throbber issues resolved for the next release.

All this being said - I am VERY impressed with the progress you have been able to make thusfar, and I'm eagerly awaiting the next release.

Glad to hear you like it

[Zeron]

The <a href="http://www.intraplanar.net/projects">Luna</a> theme (terribly outdated, but works with FX 0.8) has a different look for the throbber when placed in the menu toolbar.

This definition wasn't in the original theme (probably a Firefox only thing?) and when I remove it, it fixes the problem but creates a whole slew of problems with several of the other button derivations. Any suggestions as to how I can fix this button size problem?

I don't know for sure, but maybe if you instead just lower the size of the padding (I assume those are the 4 sides of the buttons) instead of taking out that whole code block, it'll work out with the other button problems you had.

You might consider making the Go and Print buttons actual "buttons" like "OK" and "Cancel" in dialogs.

Good suggestion! I'll look into making that change. Do you know of a way to do this off the top of your head?

Not a clue. Using actual graphics is the only thing I can think of, but obviously that won't work out right with users having different fonts, sizes, etc. Sorry I can't help here, but there are plenty of smart themers in there that should be able to.... (Get cracking, people!)

[Bernie]

You might consider making the Go and Print buttons actual "buttons" like "OK" and "Cancel" in dialogs.

Good suggestion! I'll look into making that change. Do you know of a way to do this off the top of your head?

Not a clue. Using actual graphics is the only thing I can think of, but obviously that won't work out right with users having different fonts, sizes, etc. Sorry I can't help here, but there are plenty of smart themers in there that should be able to.... (Get cracking, people!)

I actually already changed the Go button to a regular button and I found an old print icon from the original GrayModern theme that I can use. These will most likely make it into v0.4.

[Bernie]

Anyone know how to change the autocomplete dropmarker when the autocomplete drop-down is open? I have this right now, but the dropmarker stays the same in both open and closed modes:

Code: Select all

.autocomplete-history-dropmarker {
  margin: 0px 3px 0px 0px;
  list-style-image: url("chrome://global/skin/toolbar/ubhist-arrow.gif");
}

.autocomplete-history-dropmarker[open="true"] {
  list-style-image: url("chrome://global/skin/toolbar/ubhist-arrow-act.gif");
}

[Zeron]

Bump.

[aaron]

This works for Lyncknot on the new prolcd theme to change the autocomplete dropmarker when the drop down is open:

Code: Select all

#urlbar > .autocomplete-history-dropmarker[focused="true"]

[Bernie]

Thanks for bumping this thread, Zeron, and thanks for sending along that CSS rule, aaron. I'll give it a try and see what happens.

As for my status with the GrayModern theme, it is coming along quite nicely. I've made a whole bunch of fixes/adjustments since v0.3, and v0.4 is pretty much ready to go out the door once I figure out the dropmarker issue (which I'm guessing will be fixed now thanks to aaron's suggestion).

I've been kinda busy at work and I'm doing some contract work on top of that, but look forward to a new release sometime soon...

[Bernie]

This works for Lyncknot on the new prolcd theme to change the autocomplete dropmarker when the drop down is open:

Code: Select all

#urlbar > .autocomplete-history-dropmarker[focused="true"]

Hmm...that doesn't work either. Any other ideas as to how I can make the down arrow in the urlbar change state when the autocomplete history dropdown is open?

[Bernie]

GrayModern 0.4 Released

It took a little longer than I would have liked, but nevertheless, version 0.4 of the GrayModern theme is now available. The fixes in this version as well as up-and-coming fixes for v0.5 are outlined below:

Fixed/Added in 0.4
- New tab button from original GrayModern theme
- Small icons are now spaced evenly as they were in early versions
- Main toolbar no longer gets taller when dropmarkers appear
- Fixed inconsistencies with arrow images
- Made "Go" a regular button and added new Print icon
- Added active state for autocomplete dropdown marker
- Icons now properly included in Add Bookmark (CTRL-D) dialog

Planned Fixes/Additions for 0.5
- Fix height of regular buttons
- Make listboxes look more like original GrayModern
- Add open state for autocomplete dropdown marker
- Move throbber (large) to main navbar
- Other requests/suggestions?

Download and Install
Download GrayModern 0.4 here.
Install GrayModern 0.4 here.

[Legoguy]

Bernie, if you don't mind, can I do a backport of your GrayModern into a Modern theme? I've already completed it, however it wasn't based on the latest version you just released... so I want to make sure it's up-to-complete-date.

By the way, I've created a "small" home button that looks...somewhat...well...better than yours if you'd like to use it