Closed
Bug 613358
Opened 15 years ago
Closed 15 years ago
Polish the mailNews search dialog on Mac and also fix some obsolete styles (all OS)
Categories
(SeaMonkey :: Themes, defect)
SeaMonkey
Themes
Tracking
(Not tracked)
RESOLVED
FIXED
seamonkey2.1b2
People
(Reporter: stefanh, Assigned: stefanh)
Details
Attachments
(8 files, 1 obsolete file)
117.26 KB,
image/png
|
Details | |
12.80 KB,
patch
|
mnyromyr
:
review-
|
Details | Diff | Splinter Review |
13.05 KB,
patch
|
mnyromyr
:
review-
|
Details | Diff | Splinter Review |
13.52 KB,
image/png
|
Details | |
13.38 KB,
image/png
|
Details | |
13.65 KB,
patch
|
mnyromyr
:
review+
|
Details | Diff | Splinter Review |
1.36 KB,
image/png
|
Details | |
4.86 KB,
image/png
|
Details |
No point of filing 2 bugs ;-)
The search dialog needs some polish on Mac (css file needs to be forked):
- The +/- buttons should not be push buttons, they should rather look like gradient buttons
- I don't think the listrows should be highlighted when selected (that would have been OK if it was one remove button, though)
- The resultstree lacks borders
We also have a bunch have bunch of obsolete/wrong style rules:
#dirtree is "plain", so we don't need to remove borders etc, resultsTree should be abResultsTree (win/mac and Modern), we also don't seem to have any .tree-container-treerows anymore and we don't need to import dialog.css.
Assignee | ||
Updated•15 years ago
|
OS: Mac OS X → All
Hardware: x86 → All
Assignee | ||
Comment 1•15 years ago
|
||
Btw selectAddressesDialog.css contains this rule:
#resultsBox {
border: 1px solid #000000;
}
Does that looks nice on win/nix (another bug, just asking)?
Attachment #491678 -
Flags: superreview?(neil)
Attachment #491678 -
Flags: review?(mnyromyr)
Assignee | ||
Comment 2•15 years ago
|
||
Assignee | ||
Comment 3•15 years ago
|
||
Btw, Karsten: I've tried to mimic the +/- buttons in the OS prefs (Language/text). No bold label text, though.
Assignee | ||
Comment 4•15 years ago
|
||
JFTR, I have some slight modifications of the .small-button's coming up in the next days.
Updated•15 years ago
|
Attachment #491678 -
Flags: superreview?(neil) → superreview+
Assignee | ||
Comment 5•15 years ago
|
||
OK, so I made some adjustments to the buttons (mac default). That includes adjusting the width of the remove button. The "native" ones have an extra top/bottom border, but the visual effect is nearly the same (makes it look less high than wide) and I can't get the same effect anyway since the "content" background is of a different color. Note that the label text isn't 100% horizontally centered, but I don't think it's noticeable.
I did some changes to the widths of the menulists in the dialog (mac default):
+menulist {
+ width: 18em;
+}
That is for the abPopup and the searchableFolders popups. I figured they could be a bit wider so we at least can see the whole labels of the included addressbooks in en-US.
I then overrule the above rule with this, to keep the width of the search condition menulists:
+.search-menulist {
+ width: 12em;
}
Attachment #491678 -
Attachment is obsolete: true
Attachment #492189 -
Flags: review?(mnyromyr)
Attachment #491678 -
Flags: review?(mnyromyr)
Assignee | ||
Comment 6•15 years ago
|
||
Btw, the filter dialog has the same issue and the css also contains obsolete rules. I'll file a separate bug for that.
Comment 7•15 years ago
|
||
Comment on attachment 492189 [details] [diff] [review]
v1.1 - Slightly adjusted version
> - The +/- buttons should not be push buttons, they should rather look like
> gradient buttons
If I tab through the widget items, the buttons now don't give visual feedback anymore where the keyboard focus is. This is bad.
Attachment #492189 -
Flags: review?(mnyromyr) → review-
Comment 8•15 years ago
|
||
Comment on attachment 492189 [details] [diff] [review]
v1.1 - Slightly adjusted version
>-/* This should not be needed on trunk once Mac styles are moved to button.css */
I wonder whether I ever intended to land bug 520371 on the 1.9.1 branch.
I guess it's a bit too late for that now ;-)
Assignee | ||
Comment 9•15 years ago
|
||
(In reply to comment #7)
> If I tab through the widget items, the buttons now don't give visual feedback
> anymore where the keyboard focus is. This is bad.
Yeah, missed that. It's certainly doable, though - will look at it.
Assignee | ||
Comment 10•15 years ago
|
||
OK, so I spent the whole evening playing with colors since the -moz-mac-focusring color looks awful in the aqua color scheme. I think it's ok in graphite, and all the darker colors I tried made the corners look strange (there where a 1px darker spot in them).
Attachment #492754 -
Flags: review?(mnyromyr)
Assignee | ||
Comment 11•15 years ago
|
||
(In reply to comment #6)
> Btw, the filter dialog has the same issue and the css also contains obsolete
> rules. I'll file a separate bug for that.
Filed bug 614382.
Comment 12•15 years ago
|
||
Comment on attachment 492754 [details] [diff] [review]
Now with focus indication
>diff --git a/suite/themes/classic/messenger/searchDialog.css b/suite/themes/classic/mac/messenger/searchDialog.css
>copy from suite/themes/classic/messenger/searchDialog.css
>copy to suite/themes/classic/mac/messenger/searchDialog.css
>--- a/suite/themes/classic/messenger/searchDialog.css
>+++ b/suite/themes/classic/mac/messenger/searchDialog.css
I wish Bugzilla's visual diff would understand that... :-(
>+.small-button:focus {
>+ box-shadow: 0 0 3px #457FDE,
>+ inset 0 0 2px #457FDE;
> }
Hm, this colour doesn't fit in - and actually, the -moz-mac-focusring colour is a much better fit?
Like
.small-button:focus {
box-shadow: 0 0 3px -moz-mac-focusring,
inset 0 0 2px -moz-mac-focusring;
}
Assignee | ||
Comment 13•15 years ago
|
||
You mean that you don't think the blue -moz-mac-focusring have a different tone than the one in the focusring around the adjacent search field?
Assignee | ||
Comment 14•15 years ago
|
||
Assignee | ||
Comment 15•15 years ago
|
||
Assignee | ||
Comment 16•15 years ago
|
||
it's not the end of the world, but i think the custom one looks better.
Assignee | ||
Comment 17•15 years ago
|
||
pick the one you like!
Comment 18•15 years ago
|
||
Comment on attachment 492754 [details] [diff] [review]
Now with focus indication
Minussing due to the ongoing colour discussion.
>+.small-button:focus {
>+ box-shadow: 0 0 3px #457FDE,
>+ inset 0 0 2px #457FDE;
> }
I toyed around a bit and this colour and shadow looks okay for me (notice the spread value!):
.small-button:focus {
box-shadow: 0 0 2px 2px #79b1dd;
}
It has issues, though, when applied to the [-] button - the left edge hides behind the [+] button then?! Maybe you know why... ;-)
Attachment #492754 -
Flags: review?(mnyromyr) → review-
Assignee | ||
Comment 19•15 years ago
|
||
(In reply to comment #18)
> Comment on attachment 492754 [details] [diff] [review]
> Now with focus indication
>
> Minussing due to the ongoing colour discussion.
>
> >+.small-button:focus {
> >+ box-shadow: 0 0 3px #457FDE,
> >+ inset 0 0 2px #457FDE;
> > }
>
> I toyed around a bit and this colour and shadow looks okay for me (notice the
> spread value!):
>
> .small-button:focus {
> box-shadow: 0 0 2px 2px #79b1dd;
> }
>
> It has issues, though, when applied to the [-] button - the left edge hides
> behind the [+] button then?! Maybe you know why... ;-)
With this styling, I don't see any right shadow on the + button. This is why I used a blur of 3px and no spread value and an inset with 2px blur. Also, your suggested color looks too bright - it doesn't fit at all with the focus ring color of the text filed to the left.
Assignee | ||
Comment 20•15 years ago
|
||
None of the colors that you have suggested fits for me - this discussion can go on forever. In comment #12, you suggest that the -moz-mac-focusring color fits for you. I don't think it fits, but how about we go for that color?
Assignee | ||
Comment 21•15 years ago
|
||
Try this one, I think the color is the right. I played with the shadows and found out that I could have another shadow pointing right/left. For me, it didn't worked for the left button, though (shadow still appears behind right button). I then apply an inset shadow on the right button while the left button has focus (doesn't seem to be needed when the right button is focused).
I used the sampled webkit graphite color, but it might be better to use the -moz one, since I think the button borders shines through in an slightly ugly way.
Attachment #493406 -
Flags: review?(mnyromyr)
Comment 22•15 years ago
|
||
The colour difference is still quite visible for me, for whatever reason.
But I agree, this is going nowhere. We should just pick one static colour and probably file a bug against toolkit for a "-moz-appearance: focusring"...
Assignee | ||
Comment 23•15 years ago
|
||
Comment 24•15 years ago
|
||
Comment on attachment 493406 [details] [diff] [review]
New version, with sampled '-webkit-focus-ring-color'
Okay, let's go with that for now and try to fix the actual issue (non-fitting hardcoded colour for Mac focusrings) on the toolkit level.
Attachment #493406 -
Flags: review?(mnyromyr) → review+
Assignee | ||
Comment 25•15 years ago
|
||
Status: ASSIGNED → RESOLVED
Closed: 15 years ago
Resolution: --- → FIXED
You need to log in
before you can comment on or make changes to this bug.
Description
•