Closed Bug 590742 Opened 10 years ago Closed 10 years ago

Incorporate new CSS for Tab Candy appearance polish

Categories

(Firefox Graveyard :: Panorama, defect)

defect
Not set

Tracking

(blocking2.0 -)

VERIFIED FIXED
Firefox 4.0b7
Tracking Status
blocking2.0 --- -

People

(Reporter: smartell, Assigned: mitcho)

References

Details

Attachments

(1 file, 6 obsolete files)

Just wanted to make a few suggestions re: the default look of Tabcandy on OSX.

1) the style is based on the original CSS mockups I did which were meant for a much lighter bg - the current OSX build has a darker bg gradient, which I LOVE, so the tabs and tableaus are very strong over top of it. I tweaked them.

2) the favicon indent, when the tab is "active", has a blue glow around it breaking the indent look.  I've proposed the blue be on the outside of the tab, not the inside screenshot.

3) I had CSS transition subtle fades in the original mockup.  was there a reason to leave those out? (perf, usability, etc)

Here is a side-by-side of the current/new CSS: http://mozilla.seanmartell.com/tabcandy/tc-revised.png

Revised code is here: http://mozilla.seanmartell.com/tabcandy/

Let me know what works, what doesn't. I can make Win7 friendly tweaks also if desired. All just suggestions. Use as you'd like.
Windows: http://mozilla.seanmartell.com/tabcandy/index-win.html

- background colors sampled from Aero Basic
- tabs and tableau bg color sampled from Aero FF active tab color
- disregard font - should be standard Win7 Segoe UI I am assuming?
http://mozilla.seanmartell.com/tabcandy/index-win2.html <-- matches more closely to the upcoming discovery pane theme styling
Duplicate of this bug: 590784
Summary: Default CSS styling update → Incorporate new CSS for Tab Candy appearance polish
Assignee: nobody → mitcho
Target Milestone: --- → Firefox 4.0b5
Depends on: 586455
I copied most of the styling from Sean's mockup, though not the spacing (padding/margin) values, as that may (at this point) involve editing some code in GroupItem.arrange, not just CSS. My thoughts:

- we do need to adjust padding/spacing
- the group background is too dark?
Attachment #469715 - Flags: feedback?(aza)
Also:
- the new tab button icon in groups must have its color rematched to the group background color.
- if the group stays this dark, the group title must be made darker
* The padding/spacing is a great piece of polish that we need to do.
* Agree that the groups are a bit too dark with the new design. Mart3ll: can you give us a lighter color?
Frank had been looking at how the hilight-glow should work for the selected tab, this looks quite nice!
http://mozilla.seanmartell.com/tabcandy/index.html
http://mozilla.seanmartell.com/tabcandy/index-win2.html

both revised:
- got rid of using box-shadow for the white edge, replaced with border
- brightened the bg color in the group, brightened the color in the group tab
favicon area
Updated based on Sean's updated mockup, including a lighter background color for the groups. Spacing still has not been updated.
Attachment #469715 - Attachment is obsolete: true
Attachment #469715 - Flags: feedback?(aza)
Attachment #469732 - Flags: feedback?(aza)
Depends on: 591147
Attachment #469732 - Attachment is obsolete: true
Attachment #469891 - Flags: review?(dolske)
Attachment #469891 - Flags: feedback?(aza)
Attachment #469732 - Flags: feedback?(aza)
Duplicate of this bug: 588294
Duplicate of this bug: 586528
Attachment #469891 - Attachment is obsolete: true
Attachment #471848 - Flags: review?(dolske)
Attachment #469891 - Flags: review?(dolske)
Attachment #469891 - Flags: feedback?(aza)
blocking2.0: --- → ?
Target Milestone: Firefox 4.0b5 → Firefox 4.0b6
Comment on attachment 471848 [details] [diff] [review]
Patch for mac and win, updated to apply cleanly. Please apply patch for 591147 first to test.

Aza, I pushed this to try so you can get builds to try on Mac and Win. They're starting to get built:

http://ftp.mozilla.org/pub/mozilla.org/firefox/tryserver-builds/mmitcho@mozilla.com-0055dbe809c7/
Attachment #471848 - Flags: feedback?(aza)
Attachment #471848 - Flags: review?(dolske) → review?(dietrich)
Comment on attachment 471848 [details] [diff] [review]
Patch for mac and win, updated to apply cleanly. Please apply patch for 591147 first to test.

get feedback+ from aza and ian first, then re-request review.
Attachment #471848 - Flags: review?(dietrich)
Attachment #471848 - Flags: feedback?(aza) → feedback+
Looks good!
Attachment #471848 - Flags: review?(dietrich)
Attachment #471848 - Flags: review?(dietrich)
Attachment #471848 - Flags: review+
Attachment #471848 - Flags: approval2.0+
OS: Mac OS X → All
Hardware: x86 → All
Version: unspecified → Trunk
Attached patch Patch for checkin (obsolete) — Splinter Review
Attachment #471848 - Attachment is obsolete: true
http://hg.mozilla.org/mozilla-central/rev/d0394b66e5d3
Status: NEW → RESOLVED
Closed: 10 years ago
Keywords: checkin-needed
Resolution: --- → FIXED
test failed again: http://pastebin.mozilla.org/783925

backed out: http://hg.mozilla.org/mozilla-central/rev/c3e21097bb78
Status: RESOLVED → REOPENED
Resolution: FIXED → ---
This may be a bit late to bring up, but if you're going to make OS-specific backgrounds for tab candy, perhaps for Linux you could use the dialog background colour, with a gradient above it going from transparent to semi-transparent white/black?
(In reply to comment #20)
> This may be a bit late to bring up, but if you're going to make OS-specific
> backgrounds for tab candy, perhaps for Linux you could use the dialog
> background colour, with a gradient above it going from transparent to
> semi-transparent white/black?

Michael, there's a bug for that. ;) bug 593597.
Not going to hold the release for this polish bug. However, as indicated in current patch, definitely will give approval to a patch that's passing tests.
blocking2.0: ? → -
OK, this is silly.  I just updated to d0394b66e5d3, rebuilt, and I can't seem to reproduce this problem...
I created a patch for checkin which doesn't assume 591147 has applied yet. If we push this without bug 591147, it will produce some weird crowding of tabs within groups, but that's why bug 591147 exists. :/

I've pushed this to try to verify that it passes tests. Will request checkin if it passes.
Attachment #472413 - Attachment is obsolete: true
So to clarify? If bug 591147 has landed, we still apply this patch?
(In reply to comment #25)
> So to clarify? If bug 591147 has landed, we still apply this patch?

If 591147 lands first, the prior "patch for checkin" should then apply cleanly.

Not really an issue, though, as 591147 hasn't landed yet and is in my court (currently pushing some mods to the test to try to test).
Updated for rot. Please apply 591147 first.
Attachment #472800 - Attachment is obsolete: true
http://hg.mozilla.org/mozilla-central/rev/d2c04c661081
Status: REOPENED → RESOLVED
Closed: 10 years ago10 years ago
Keywords: checkin-needed
Resolution: --- → FIXED
Comment on attachment 473289 [details] [diff] [review]
Patch for checkin, after 591147

>diff --git a/browser/themes/winstripe/browser/tabview/grain.png b/browser/themes/winstripe/browser/tabview/grain.png
>new file mode 100644

...

> #bg {
>-  background: -moz-linear-gradient(top,#F1F5FB,#EDF4FB);
>+  background: url("chrome://browser/skin/tabview/grain.png") repeat scroll center top, -moz-linear-gradient(center top , #CCD9EA, #C7D5E7) repeat scroll 0 0 transparent;
> }

This doesn't actually work, since grain.png isn't packaged.
Blocks: 595876
(In reply to comment #29)
> Comment on attachment 473289 [details] [diff] [review]
> Patch for checkin, after 591147
>
> This doesn't actually work, since grain.png isn't packaged.

Opened a new bug for this. Bug 595876
Duplicate of this bug: 580065
verified on recent nightly builds of minefield
Status: RESOLVED → VERIFIED
Product: Firefox → Firefox Graveyard
You need to log in before you can comment on or make changes to this bug.