Closed
Bug 771284
Opened 12 years ago
Closed 12 years ago
Use light coloring for Mac OS X arrow panels
Categories
(Toolkit :: Themes, defect)
Tracking
()
RESOLVED
FIXED
mozilla17
People
(Reporter: cleer, Assigned: cleer)
References
()
Details
Attachments
(4 files, 19 obsolete files)
Per dao's recommendation in https://bugzilla.mozilla.org/show_bug.cgi?id=767321, splitting up a large Mac OS X arrow panel patch into separate parts. This bug refers to the coloring of the panel, which is being changed from black "HUD" style to a lighter color similar to that seen in iCal, Safari, and Firefox for Windows.
The attached patch simply changes the background color and adds new arrow images. It seems like the Windows implementation uses SVG, so that should probably be updated. This patch doesn't touch button, dropdowns, or UI elements specific to certain panels like the downloads or bookmarks panels.
Attachment #639440 -
Flags: review?
Assignee | ||
Comment 1•12 years ago
|
||
This version of the patch also changes the @hudButton@ style that is used exclusively in arrow panels. I'm not sure if it should go with this bug, so let me know if you think otherwise.
This is the also a change that affects arrow panels in general; other UI element styles are defined in specific arrow panels where they are used. This makes it a little tricky to make a global arrow panel UI element restyle without including lots of specific files.
Attachment #639526 -
Flags: review?
Assignee | ||
Comment 2•12 years ago
|
||
Some of the panel (border-radius and background color) and button (essentially all of it) styling were influenced by the iCal/Safari/Quick Look Mac system styles. I checked this with Stephen and I think he seemed to think it made sense. We can continue to think about how closely to replicate OS X with this and how much to preserve consistency with Firefox on Windows/Linux.
If we go with replicating OS X, the ideal would be using the native system panels if at all possible: https://bugzilla.mozilla.org/show_bug.cgi?id=723061
dolske also sort of figured out how to mimic the OS X blurred translucency: http://cl.ly/3H2R0o0q201e1e0E1E1P
3:33:01 PM dolske: I just disabled the check at the top of nsCocoaWindow::SetUpWindowFilter so everything blurs.
3:33:34 PM dolske: for a real patch, you'd need to figure out how to make that code know it's <panel>
Comment 4•12 years ago
|
||
Chris,
When you set the review flag, you also need to set the reviewer (e-mail). The reviewer will then get an e-mail.
Assignee | ||
Updated•12 years ago
|
Assignee: nobody → chlee
QA Contact: chlee
Assignee | ||
Updated•12 years ago
|
QA Contact: chlee
Assignee | ||
Updated•12 years ago
|
Attachment #639526 -
Flags: review? → review?(jaws)
Assignee | ||
Updated•12 years ago
|
Attachment #639526 -
Flags: review?(fryn)
Updated•12 years ago
|
Attachment #639440 -
Attachment is obsolete: true
Attachment #639440 -
Flags: review?
Comment 5•12 years ago
|
||
Comment on attachment 639526 [details] [diff] [review]
Patch v2
Review of attachment 639526 [details] [diff] [review]:
-----------------------------------------------------------------
Frank, can you test this out on OS X? The CSS changes look fine to me.
Attachment #639526 -
Flags: review?(jaws) → feedback+
Comment 6•12 years ago
|
||
Comment on attachment 639526 [details] [diff] [review]
Patch v2
The arrow image is lighter than the panel background. The colors need to match.
While you're at it, you could unify panelarrow-down.png and panelarrow-up.png to panelarrow-vertical.png and mirror the image like it's done for panelarrow-horiz.png.
You also need to adjust the popup-notification-menubutton styling and some bookmarks panel styles / resources that assume a dark background.
Attachment #639526 -
Flags: review?(fryn) → review-
Assignee | ||
Comment 7•12 years ago
|
||
The color difference is intentional and accounts for the header background in the mockup, which I can't implement without changing the XUL structure of each individual arrow panel. Changing the image will just mean changing it back to this color when that work is done.
Updated•12 years ago
|
Status: NEW → ASSIGNED
Assignee | ||
Comment 8•12 years ago
|
||
Also, the point of splitting up these bugs (which was done on your suggestion) was to keep separate components separate from the general arrow panel-wide patch. If we want to mix them in (which would be necessary for that consistency), that was the intent of the original patch that I already submitted in https://bugzilla.mozilla.org/show_bug.cgi?id=767321
Status: ASSIGNED → NEW
Assignee | ||
Updated•12 years ago
|
Status: NEW → ASSIGNED
Comment 9•12 years ago
|
||
(In reply to Chris Lee (:cleer) from comment #7)
> Changing the image will just mean changing it back to this color when that work is done.
That's fine. In the meantime we need to keep the styling in a ship-able shape, i.e. the colors need to match.
(In reply to Chris Lee (:cleer) from comment #8)
> Also, the point of splitting up these bugs (which was done on your
> suggestion) was to keep separate components separate from the general arrow
> panel-wide patch. If we want to mix them in (which would be necessary for
> that consistency), that was the intent of the original patch that I already
> submitted in https://bugzilla.mozilla.org/show_bug.cgi?id=767321
That patch does significantly more things than those needed for this bug.
Assignee | ||
Comment 10•12 years ago
|
||
Updated patch with some styling of the bookmarks and downloads panel (making them look somewhat consistent while not actually implementing what we want to implement eventually...) Also modified the arrow color and consolidated arrow images.
Where does "popup-notification-menubutton" appear?
Attachment #640427 -
Flags: feedback?(dao)
Assignee | ||
Updated•12 years ago
|
Attachment #640427 -
Attachment is patch: true
Comment 11•12 years ago
|
||
(In reply to Chris Lee (:cleer) from comment #10)
> Where does "popup-notification-menubutton" appear?
In the geolocation prompt, for instance, or any other popup notification with secondary actions.
Assignee | ||
Comment 12•12 years ago
|
||
+ styling for generic popup notification (ex. geolocation) and dropdown arrow image
Attachment #639526 -
Attachment is obsolete: true
Attachment #640427 -
Attachment is obsolete: true
Attachment #640427 -
Flags: feedback?(dao)
Attachment #640447 -
Flags: feedback?(dao)
Updated•12 years ago
|
Attachment #640447 -
Attachment is patch: true
Comment 13•12 years ago
|
||
A very important bug in the previous implementation was the fact that the arrow didn't always indicate the center of the attached icon (e.g. In full screen mode or in maximized mode with the download button on the far right). It shouldn't be the case : the arrow should be centered in most possible case (there is always some cases where the identity globe is half out of the screen so unless there is a diagonal arrow implemented, the arrow won't be centered).
Comment 14•12 years ago
|
||
I just noticed that Google Chrome chooses to cut the panel if a part of it is off-screen. Firefox tries to always show it completely. Some thoughts about that.
Comment 15•12 years ago
|
||
Comment on attachment 640447 [details] [diff] [review]
Patch v4
>+#editBookmarkPanelGrid row {
>+ margin-bottom: 8px;
>+}
>+
>+#editBookmarkPanelGrid row:last-of-type {
>+ margin-bottom: 0;
>+}
>+
>+/**** Input elements ****/
>+
>+#editBookmarkPanel textbox {
Avoid the descendant selector.
>+ skin/classic/global/arrow/arrow-dn-panel.png (arrow/arrow-dn-panel.png)
We already have arrow-dn-sharp.gif, arrow-dn.gif and arrow-dn.png. Can you use or update one of these?
>- skin/classic/global/arrow/panelarrow-up.png (arrow/panelarrow-up.png)
>- skin/classic/global/arrow/panelarrow-down.png (arrow/panelarrow-down.png)
> skin/classic/global/arrow/panelarrow-horiz.png (arrow/panelarrow-horiz.png)
>+ skin/classic/global/arrow/panelarrow-vert.png (arrow/panelarrow-vert.png)
s/vert/vertical/
Attachment #640447 -
Flags: feedback?(dao)
Assignee | ||
Comment 16•12 years ago
|
||
(In reply to Dão Gottwald [:dao] from comment #15)
the descendant selector.
>
> >+ skin/classic/global/arrow/arrow-dn-panel.png (arrow/arrow-dn-panel.png)
>
> We already have arrow-dn-sharp.gif, arrow-dn.gif and arrow-dn.png. Can you
> use or update one of these?
>
These are different images used in different cases. Changing them probably alters another element that we don't want to alter.
> >- skin/classic/global/arrow/panelarrow-up.png (arrow/panelarrow-up.png)
> >- skin/classic/global/arrow/panelarrow-down.png (arrow/panelarrow-down.png)
> > skin/classic/global/arrow/panelarrow-horiz.png (arrow/panelarrow-horiz.png)
> >+ skin/classic/global/arrow/panelarrow-vert.png (arrow/panelarrow-vert.png)
>
> s/vert/vertical/
Why "horiz" and "vertical"?
Assignee | ||
Comment 17•12 years ago
|
||
Updated image names to panelarrow-horizontal.png and panelarrow-vertical.png to mirror winstripe/gnomestripe filenames. Using child selector instead of descendant selector in CSS.
Attachment #640447 -
Attachment is obsolete: true
Attachment #640748 -
Flags: review?(fryn)
Attachment #640748 -
Flags: feedback?(dao)
Assignee | ||
Comment 18•12 years ago
|
||
Comment on attachment 640748 [details] [diff] [review]
Patch v5
# HG changeset patch
# User Chris Lee <chlee@mozilla.com>
# Date 1341952017 25200
# Node ID dc75bb2b5e6bc6ef8de0e48b0b0c48a1daa71aea
# Parent 6d7fae9764b34ce5d6e25d19a1c86fbcfabbf829
Bug 771284 - Use light coloring for Mac OS X arrow panels
diff --git a/browser/themes/pinstripe/browser.css b/browser/themes/pinstripe/browser.css
--- a/browser/themes/pinstripe/browser.css
+++ b/browser/themes/pinstripe/browser.css
@@ -1268,23 +1268,44 @@ window[tabsontop="false"] richlistitem[t
list-style-image: url("chrome://browser/skin/places/unstarred48.png");
}
#editBookmarkPanelTitle {
font-size: 130%;
font-weight: bold;
}
+#editBMPanel_rows > row {
+ margin-bottom: 8px;
+}
+
+#editBMPanel_rows > row:last-of-type {
+ margin-bottom: 0;
+}
+
+/**** Input elements ****/
+
+#editBookmarkPanel textbox {
+ -moz-appearance: none;
+ background: -moz-linear-gradient(#fafafa, #fff);
+ border-radius: 3px;
+ border: 1px solid rgba(0, 0, 0, 0.3) !important;
+ box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.05),
+ 0 1px rgba(255, 255, 255, 0.3);
+ margin: 0;
+ padding: 3px 6px;
+}
+
/**** HUD style buttons ****/
.editBookmarkPanelHeaderButton,
.editBookmarkPanelBottomButton {
@hudButton@
- margin: 6px;
- min-width: 79px;
+ margin: 0;
+ min-width: 82px;
min-height: 22px;
}
.editBookmarkPanelHeaderButton:hover:active,
.editBookmarkPanelBottomButton:hover:active {
@hudButtonPressed@
}
@@ -1296,35 +1317,37 @@ window[tabsontop="false"] richlistitem[t
.editBookmarkPanelBottomButton[default="true"] {
background-color: #666;
}
#editBookmarkPanelHeader {
margin-bottom: 6px;
}
+.editBookmarkPanelBottomButton:last-child {
+ -moz-margin-start: 8px;
+}
+
/* The following elements come from editBookmarkOverlay.xul. Styling that's
specific to the editBookmarkPanel should be in browser.css. Styling that
should be shared by all editBookmarkOverlay.xul consumers should be in
editBookmarkOverlay.css. */
#editBMPanel_newFolderBox {
background-image: -moz-linear-gradient(rgb(90,90,90), rgb(40,40,40));
background-origin: padding-box;
background-clip: padding-box;
border-radius: 0 0 3px 3px;
border: 1px solid rgba(0,0,0,.3);
border-top: none;
box-shadow: inset 0 -1px 2px rgba(0,0,0,.2),
inset 0 1px 0 rgba(255,255,255,.15),
0 1px 0 rgba(255,255,255,.15);
+ margin: 0;
padding: 0;
- margin-left: 4px;
- margin-right: 4px;
- margin-bottom: 8px;
height: 20px;
}
#editBMPanel_newFolderButton {
-moz-appearance: none;
border: 0;
-moz-border-end-width: 3px;
border-style: solid;
@@ -1350,20 +1373,21 @@ window[tabsontop="false"] richlistitem[t
}
#editBMPanel_newFolderButton .button-text {
display: none;
}
#editBMPanel_folderMenuList {
@hudButton@
- border-radius: 3px;
+ margin: 0;
min-height: 22px;
- -moz-padding-start: 4px;
- -moz-padding-end: 0;
+ padding: 2px 4px 1px 8px;
+ -moz-padding-start: 8px;
+ -moz-padding-end: 4px;
}
#editBMPanel_folderMenuList:-moz-focusring {
@hudButtonFocused@
}
#editBMPanel_folderMenuList[open="true"],
#editBMPanel_folderMenuList:hover:active {
@@ -1375,30 +1399,31 @@ window[tabsontop="false"] richlistitem[t
display: -moz-box;
background-color: transparent;
border: 0;
margin: 0;
padding: 0;
}
#editBMPanel_folderMenuList > .menulist-dropmarker > .dropmarker-icon {
- list-style-image: url("chrome://browser/skin/hud-style-dropmarker-double-arrows.png");
+ list-style-image: url("chrome://global/skin/arrow/arrow-dn-panel.png");
}
/**** folder tree ****/
#editBMPanel_folderTree {
-moz-appearance: none;
- border-radius: 2px 2px 0 0;
- background-color: rgba(50,50,50,.9);
- border: 1px solid rgba(0,0,0,.3);
+ background: -moz-linear-gradient(#fafafa, #fff);
+ border-radius: 3px 3px 0 0;
+ border: 1px solid rgba(0, 0, 0, 0.3);
border-bottom: none;
- box-shadow: inset 0 1px 2px rgba(0,0,0,.15);
- color: #fff;
+ box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.05),
+ 0 1px rgba(255, 255, 255, 0.3);
/* Implements editBookmarkPanel resizing on folderTree un-collapse. */
+ margin: 0 !important;
min-width: 27em;
position: relative;
}
#editBMPanel_folderTree:-moz-focusring {
box-shadow: 0 0 4px 1px -moz-mac-focusring,
0 0 2px 1px -moz-mac-focusring;
}
@@ -1420,23 +1445,24 @@ window[tabsontop="false"] richlistitem[t
}
#editBMPanel_folderTree > treechildren::-moz-tree-twisty(selected, open) {
-moz-image-region: rect(0px, 40px, 10px, 30px);
}
#editBMPanel_tagsSelector {
-moz-appearance: none;
- border-radius: 2px;
- background-color: rgba(50,50,50,1);
- border: 1px solid rgba(0,0,0,.3);
+ border-radius: 3px;
+ background: -moz-linear-gradient(#fafafa, #fff);
+ border-radius: 3px 3px 0 0;
+ border: 1px solid rgba(0, 0, 0, 0.3) !important;
border-bottom: none;
- box-shadow: inset 0 1px 2px rgba(0,0,0,.15),
- 0 1px 0 rgba(255,255,255,.15);
- color: #fff;
+ box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.05),
+ 0 1px rgba(255, 255, 255, 0.3);
+ margin: 0;
}
#editBMPanel_tagsSelector:-moz-focusring {
@hudButtonFocused@
}
#editBMPanel_tagsSelector .listcell-check {
-moz-appearance: none;
@@ -1474,23 +1500,21 @@ window[tabsontop="false"] richlistitem[t
background-color: #b3b3b3;
}
/**** expanders ****/
#editBookmarkPanel .expander-up,
#editBookmarkPanel .expander-down {
@hudButton@
- border-radius: 3px;
-moz-margin-start: 4px;
- -moz-margin-end: 2px;
padding: 0;
- -moz-padding-start: 4px;
- min-width: 10px;
- min-height: 20px;
+ -moz-padding-start: 3px;
+ min-width: 26px;
+ min-height: 22px;
}
#editBookmarkPanel .expander-up:-moz-focusring,
#editBookmarkPanel .expander-down:-moz-focusring {
@hudButtonFocused@
}
#editBookmarkPanel .expander-up:hover:active,
@@ -1504,23 +1528,23 @@ window[tabsontop="false"] richlistitem[t
#editBookmarkPanel .expander-down {
list-style-image: url("chrome://browser/skin/hud-style-expander-closed.png");
}
#editBMPanel_tagsField {
-moz-appearance: none !important;
-moz-padding-start: 3px !important;
- margin: 2px !important;
border: 1px solid rgba(0,0,0,.5) !important;
box-shadow: inset 0 1px 0 rgba(0,0,0,.3);
background-color: #666 !important;
background-clip: padding-box;
background-origin: padding-box;
color: #fff !important;
+ margin: 0;
min-height: 20px;
}
#editBMPanel_tagsField > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input:-moz-placeholder {
color: #bbb;
}
#editBMPanel_tagsField[focused="true"] {
@@ -2307,20 +2331,24 @@ toolbarbutton.chevron > .toolbarbutton-m
#geo-notification-icon {
list-style-image: url(chrome://browser/skin/Geolocation-16.png);
}
.geolocation-text-link {
color: #fff;
-moz-margin-start: 0; /* override default label margin to match description margin */
+ color: #0073e6;
+ text-decoration: none;
}
.telemetry-text-link {
color: #fff;
+ color: #0073e6;
+ text-decoration: none;
}
#addons-notification-icon {
list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric-16.png);
}
#password-notification-icon {
list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png);
diff --git a/browser/themes/pinstripe/downloads/buttons.png b/browser/themes/pinstripe/downloads/buttons.png
index 0fdb1b4c138eee18daf481dc503d24fb631bef57..0b5161ff01e345592da15d696a7f8de985f5db5d
GIT binary patch
literal 1669
zc$@)+27394P)<h;3K|Lk000e1NJLTq001fg001}$1^@s6i`{C=000I|Nkl<Zc-qyN
zX>62L6ozHmPCK1$w4G^%ickqDV5%a5Q4wTqEf^yD!$i|q3#ddXV3DmT$ReeHVgzi(
zg_HnV1R?@PT!M<YAw>kOK}16$CI%#N`G;?lXUv!3-nldWnR=2ZckZ2gI`4Ovb56g@
zE?&I&zu?~wNw99<14|!6Xfi~mih#%#L6HGL#sbXgW)nJE<VHF;jTJ7d79meRU({IU
z`b2>Fv&10L6Rs7rMVL80lhAQut5_{^5!u98m9W`laY1}8LWn%X*ffjKY%zy9$3+DT
za*VNs%rOeh5evjR@w8aR=O;v-uvwwlEq)ZAiBH67@wNzCga*ZR;ywJ1i(~j55Q9aQ
zS*VOJXNr}gQPlGQF3T5f;yc*I1K7@JhUm#E?)CV+BPvA+bF61H$aXcrBW!`ox{EF1
z5Nu08=x&eSTcW}xG$`gEaEhqq^E`*xeDM)ybd%V~5jZG9wyo#l9Ko+mY{jo#Tpw%e
zhl%-OGLtez4PzsO&1%KR;zdN~i4BN<IL2jq9KX$6<S}9seht>kgbm_pBbLdS%f=%T
zlUR*8!c$mOv$7>n&RCe=_I0IzpT*}4k;Pc1E#N0Ztk0N2!I(n3s@a4lb7j-m{!Ci+
zS=FQq<*XtuBzlQb+K>oF&Z$)>acq^?L92dTHjeP}7p?kM^C9wb;&!|ETeQ>ffmokS
z=ndjE(L$_ip?|YO<n7`Q@w0fNv!y@DGT+b2J;=N>;@!@c{tUkN+k`ff>+?J@v5E0m
zc8Dxf+}WZ1k|M=q0k-)l8R`x(l=i4-=lg(7=vtoAYf~AIW#5YCsIm2on=DK8r5M>R
zZWPxb_I1WfMbIX6mRRb^H2L%&a|mr?MSIX!OCC3$&pa_e>}5qKA$B7DJ+W3aD5i_W
z;(0NLnsm7+cN8Yu+3IuR{mz#D7=y?R9%Pi*$GqRg;m(%+1I9Co$hj2C)0nuFc0e4}
z(-&e3+x->ot%i`~rv$u7wBxr^Y{suu+-tn`49upao67ld8X`aBBE3xCZj^YO#l!e*
zV`T@5zOFcW3nFU~8L!o{nk{CL_7V@jR>EFSk>@E;{4p{UC7#RNB_8H3@mSdqXV&M+
z^~o;r(h=z_N|IjUS>}LOX!0wkbV&2yXZ3xF3N8ANg8G=wD#CI&uO(1SKg6BM5@{x(
zelb?m!C2u(<V(V40Z}71LX8L@@{}du7m9(z?Om{l_*z9#Q*6piSBmEdystp3c$Vzc
zY!P|2_(q%;XW=|!KZw&&+nvseP2l@zzf<B2ex)MYE7UL6P<T{|Jh+>&)wHISJW2ua
zkSKx%M4aTih^2^J9<D=tFII^0<oFFyeq|!ZD|CW*CMqw7c>lDVw#guLCV#NjGuE55
z__Y9xV<ejJTO!Iy(RX@%pkMTgPT|E^c0?q?8^tnMX%O0sr~;434nYnFjI()#Xk&aN
zM{cM%W$-HznO>pQVi7{)HXi067sF}>p_}j<Nxy(J+K*#V#&}Njtsl;-n~DU5-Y-6&
zhP9eu>*wRQmYd&;mF+_tX3^53<7gU}VKJ3V4vZF6jum=UoS=>^g6W9CFfJ3~wsB6^
z@S7t%N36T>+frzlOR<Q_D-k}^@glcWv~V^rKnE2%)&8a73306kzx`}~daM+h$}Oyb
za>iViPQ<8#F^pl>fZw0vvjnQeRqSSJ@`@673Jo(xJ&JY7qJ)a7E0uXEUQu1K9!=ql
z=0YYbiD0+Tdx&R=S_3ICUP~8+grzECXMy+StxM<@V%s$0SiE+QcSY+d%Ul)|z47~#
z@@^D?zB{X(66;0oI#OZ_LHsV9Ty_%9ir>UM$A7ZfqAbeqJij|clyD^c=6CoMA<!gV
zK>SFD&=V2JG{1_Uh>s@A5d$oKzYtIRMzWLX{pbquR20h)+ep!1vLgnL@x$$+ze%XW
zuY;5txI`$z7DTa-lv+<ZG})&y*dfYHLLGkl#Biffgw?}rF_%0)#PNUk0Rub5M57-<
zEq;6W&3@LcM_e5fXNcRF=(7DD-sEfsT$jn~hrlPr;CL=mJt8X;e6_O|>O_9r;R!$P
z#xTNDzB4>Axj-ap_fd@}8t@<GwPYXqhJc^^6dDk@5Ok!_<QFC2EK2?Xygf(jN!5Jn
P00000NkvXXu0mjf!Q?U<
diff --git a/browser/themes/pinstripe/downloads/downloads.css b/browser/themes/pinstripe/downloads/downloads.css
--- a/browser/themes/pinstripe/downloads/downloads.css
+++ b/browser/themes/pinstripe/downloads/downloads.css
@@ -74,17 +74,16 @@ richlistitem[type="download"]:last-child
#downloadsListBox:-moz-focusring > richlistitem[type="download"][selected] {
outline: 1px #999 dotted;
outline-offset: -1px;
-moz-outline-radius: 3px;
}
.downloadInfo {
- color: white;
padding: 8px;
-moz-padding-end: 0;
}
.downloadTypeIcon {
-moz-margin-end: 8px;
/* Prevent flickering when changing states. */
min-height: 32px;
diff --git a/browser/themes/pinstripe/hud-style-expander-closed.png b/browser/themes/pinstripe/hud-style-expander-closed.png
index 25219fea2257b75ec400cd71c2c98d9ce4f15fba..f0e97b22e161028728a92d5032d7ecd6cfc343f0
GIT binary patch
literal 155
zc%17D@N?(olHy`uVBq!ia0vp^oIuRR!2%?ApR4f$Qc0dJjv*Y;$rsjK+_`?{IR>^_
znhs^WhwGmnaJ@Et>t6|pEq~YOvFrU>&oiZZ<?HRI9xka|_1E+NQ~lC|r~VtqZu}7Y
zeDnSMtI3c5`v@pY{M#&3^fA8blAInx*vWtQAJ}WVurjcyE8g{&{{97M8-u5-pUXO@
GgeCwu-9MiI
diff --git a/browser/themes/pinstripe/hud-style-expander-open.png b/browser/themes/pinstripe/hud-style-expander-open.png
index 168b53a5e8b9bba12051917b323ad64222ace4ca..e3febf4ffb85360ef5245b5563c3799f4b7da59f
GIT binary patch
literal 155
zc%17D@N?(olHy`uVBq!ia0vp^oIuRR!2%?ApR4f$Qc0dJjv*Yf$q5Y1yqsq%r49+0
z&A9T!^yZs_gB87M>>&Z&S5x+#-uOsu`D3@sTOtlN9h3EQm*)C++FZm!&iEAz*URUT
zb57*{&_8$JL%hxYgO6J3<PO&_{m=LRsY2SH>CBs^GU%GfIbJqe_5f%bgQu&X%Q~lo
FCICvgI_dxb
diff --git a/browser/themes/pinstripe/shared.inc b/browser/themes/pinstripe/shared.inc
--- a/browser/themes/pinstripe/shared.inc
+++ b/browser/themes/pinstripe/shared.inc
@@ -1,6 +1,6 @@
%include ../../../toolkit/themes/pinstripe/global/shared.inc
%include ../browserShared.inc
-%define hudButton -moz-appearance: none; color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.5); border-radius: 12px; border: 1px solid rgba(0,0,0,.65); background: -moz-linear-gradient(rgba(110,110,110,.9), rgba(70,70,70,.9) 49%, rgba(50,50,50,.9) 51%, rgba(40,40,40,.9)); box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 0 1px rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1); background-clip: padding-box; background-origin: padding-box; padding: 2px 9px;
-%define hudButtonPressed background: -moz-linear-gradient(rgba(40,40,40,.9), rgba(70,70,70,.9)); box-shadow: inset 0 0 3px rgba(0,0,0,.2), inset 0 1px 7px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.1);
+%define hudButton -moz-appearance: none; color: #434343; border-radius: 4px; border: 1px solid #b5b5b5; background: -moz-linear-gradient(#fff, #f2f2f2); box-shadow: inset 0 1px rgba(255, 255, 255, 0.8), inset 0 0 1px rgba(255, 255, 255, 0.25), 0 1px rgba(255, 255, 255, 0.3); background-clip: padding-box; background-origin: padding-box; padding: 2px 6px;
+%define hudButtonPressed box-shadow: inset 0 1px 4px -3px #000, 0 1px rgba(255, 255, 255, 0.3);
%define hudButtonFocused box-shadow: 0 0 1px -moz-mac-focusring inset, 0 0 4px 1px -moz-mac-focusring, 0 0 2px 1px -moz-mac-focusring;
diff --git a/toolkit/themes/pinstripe/global/arrow/arrow-dn-panel.png b/toolkit/themes/pinstripe/global/arrow/arrow-dn-panel.png
new file mode 100644
index 0000000000000000000000000000000000000000..b0a9c837836a7b6803bf11b91c664130fa810d26
GIT binary patch
literal 1083
zc$}3}&r1|h9AD5hBu`<OmtJFmQM>cr?9R;2;3n(NZZ5cH>q2{MoO!O3&b--~XS*60
z)Fn@LjPPLpfY7O+Lq#486hk^hBuE5y3yNyVir%Pe5+U@3H}8GFd_UjsXTCpX1_v&*
zwsf?FLZQ}dpO$BLGdqV4H?i-`y|1s?b)2S)bcl@5itgc1(j>zeWNp2K^H?`0%P(+u
zDAZ823PoDX^{WQ4BYNNysoHKRknWzUs~cmOf?-^;oCNpr@e>YMW`esc=3vfE;Zdt^
z%ELob0|jGh%ur0O=RD}Hsw{wwsSc|4xZ|tU1h*YmW$(bub70$rjwQGqQpMaLND&VM
zF#^K|lpv5$1Vv-AET01cM39F9kAyIi)u^CC2zG^I**tSZ&1;$6Tue)Fqm;TT&sQpy
zNF^E}UWrGFq69GnA<R6&{-i_oYS{5R>k%~U8=mD-i#Q<A^<gqW6C79n1>4Q#_5wTp
zZlPGo_^R&mC<1xg=Ih=*&Et`Sz5T+Zi}^hE$%JRHevEYPOLZ_baAa)Mi=M@rqK|9D
zn6R-!vs!|alyqE4X`+~tqiHCKk|e{7n2{ABu4G_JsblwJm?dIbriwI8ff|&0<A_Nb
zDPl(Gm7$1GQbCdyt7Ef{Pj$z@b*%LVD;|hdQy$hS@d|{D*E>HrN+|J1i3?Ig66nh5
zhUEl?GeKi^xnj?{hRuveY_MHf)%phmD8wN`atz7>lo*S+AS9D=uYh85Oo}EMgB`5-
zKh@$H3I4C~sGHc#1<$=<XUg8XV2AC9$ClxGSF)Wg(qvXk7OHQCU#+cO)k~$>jg5`k
z%F<Hp#NqZEKWfjuf8JbeTYl)QPfdS#d9rPKdioeb4`%1)=6V_%8yCpiN9C5Icgn`Q
z#hLZ~{{GcpKexU$Yqx5k+%%8CGX3;EyEQ*Qe;RZwHqSgimAu<_`^)`U@d$VtI=hm)
TG_={>5Ug`HJ)kZ0Ub*=j`dDC<
diff --git a/toolkit/themes/pinstripe/global/arrow/panelarrow-down.png b/toolkit/themes/pinstripe/global/arrow/panelarrow-down.png
deleted file mode 100644
Binary file toolkit/themes/pinstripe/global/arrow/panelarrow-down.png has changed
diff --git a/toolkit/themes/pinstripe/global/arrow/panelarrow-horiz.png b/toolkit/themes/pinstripe/global/arrow/panelarrow-horiz.png
deleted file mode 100644
Binary file toolkit/themes/pinstripe/global/arrow/panelarrow-horiz.png has changed
diff --git a/toolkit/themes/pinstripe/global/arrow/panelarrow-horizontal.png b/toolkit/themes/pinstripe/global/arrow/panelarrow-horizontal.png
new file mode 100644
index 0000000000000000000000000000000000000000..5050ec169f1076a0495a50aead1dc2141e86078d
GIT binary patch
literal 200
zc%17D@N?(olHy`uVBq!ia0vp^0zj<J!3HGRdQOx8seVrv$B>F!Z?A6TJ**(X`q0P8
zEU96Q(__v}E>k`>aNWB9G&GM-Wa);b;gR1tIlb##j$F!1U|uk9%B9y9efkX@$0aUC
zbuZm<O-kFap@T8zObQU{Jq|kc+$zlo47m*t7(f3ruh{MV-0Aym8Xe5;H#wNqcM361
u;An7RP+?LKWawq6U^$@h{r%tg24VKuxmu#z{?!1T#^CAd=d#Wzp$P!P>r1Qv
diff --git a/toolkit/themes/pinstripe/global/arrow/panelarrow-up.png b/toolkit/themes/pinstripe/global/arrow/panelarrow-up.png
deleted file mode 100644
Binary file toolkit/themes/pinstripe/global/arrow/panelarrow-up.png has changed
diff --git a/toolkit/themes/pinstripe/global/arrow/panelarrow-vertical.png b/toolkit/themes/pinstripe/global/arrow/panelarrow-vertical.png
new file mode 100644
index 0000000000000000000000000000000000000000..ea4fb2d0f44ab775e09dd2948caaca58811a2c76
GIT binary patch
literal 213
zc%17D@N?(olHy`uVBq!ia0vp^>Od^O!3HF!-bqscQgb|A978H@9X+>^_kaQq%K;xJ
zv!sSKPKQ|{l}=SSu&!0UK4H%z_d}OnKRxs*SIMZSu<Y>J)rnH)EXyn2`@cQ9Lr%<T
zM^yHrwZENW_*ZZB(sbRzSYXC?xai!Zpi68Ha_LQ(1{03YOq4kBm?MI}$MBx)gad*G
zEKdqqc$h0?+5#Q8+7oRi97>en-|~PVNAH6<-+^UJjCnFVj~nCv%WJyiYR$ancn9cC
N22WQ%mvv4FO#sCPPyYY_
diff --git a/toolkit/themes/pinstripe/global/jar.mn b/toolkit/themes/pinstripe/global/jar.mn
--- a/toolkit/themes/pinstripe/global/jar.mn
+++ b/toolkit/themes/pinstripe/global/jar.mn
@@ -56,16 +56,17 @@ toolkit.jar:
skin/classic/global/toolbarbutton.css
skin/classic/global/TopLevelImageDocument.css
skin/classic/global/TopLevelVideoDocument.css
* skin/classic/global/tree.css
* skin/classic/global/viewbuttons.css
skin/classic/global/wizard.css
skin/classic/global/arrow/arrow-dn-dis.gif (arrow/arrow-dn-dis.gif)
skin/classic/global/arrow/arrow-dn-dis.png (arrow/arrow-dn-dis.png)
+ skin/classic/global/arrow/arrow-dn-panel.png (arrow/arrow-dn-panel.png)
skin/classic/global/arrow/arrow-dn-sharp.gif (arrow/arrow-dn-sharp.gif)
skin/classic/global/arrow/arrow-dn-white.png (arrow/arrow-dn-white.png)
skin/classic/global/arrow/arrow-dn.gif (arrow/arrow-dn.gif)
skin/classic/global/arrow/arrow-dn.png (arrow/arrow-dn.png)
skin/classic/global/arrow/arrow-lft-dis.gif (arrow/arrow-lft-dis.gif)
skin/classic/global/arrow/arrow-lft-hov.gif (arrow/arrow-lft-hov.gif)
skin/classic/global/arrow/arrow-lft-sharp-end.gif (arrow/arrow-lft-sharp-end.gif)
skin/classic/global/arrow/arrow-lft-sharp.gif (arrow/arrow-lft-sharp.gif)
@@ -73,19 +74,18 @@ toolkit.jar:
skin/classic/global/arrow/arrow-rit-dis.gif (arrow/arrow-rit-dis.gif)
skin/classic/global/arrow/arrow-rit-hov.gif (arrow/arrow-rit-hov.gif)
skin/classic/global/arrow/arrow-rit-sharp-end.gif (arrow/arrow-rit-sharp-end.gif)
skin/classic/global/arrow/arrow-rit-sharp.gif (arrow/arrow-rit-sharp.gif)
skin/classic/global/arrow/arrow-rit.gif (arrow/arrow-rit.gif)
skin/classic/global/arrow/arrow-up-dis.gif (arrow/arrow-up-dis.gif)
skin/classic/global/arrow/arrow-up-sharp.gif (arrow/arrow-up-sharp.gif)
skin/classic/global/arrow/arrow-up.gif (arrow/arrow-up.gif)
- skin/classic/global/arrow/panelarrow-up.png (arrow/panelarrow-up.png)
- skin/classic/global/arrow/panelarrow-down.png (arrow/panelarrow-down.png)
- skin/classic/global/arrow/panelarrow-horiz.png (arrow/panelarrow-horiz.png)
+ skin/classic/global/arrow/panelarrow-horizontal.png (arrow/panelarrow-horizontal.png)
+ skin/classic/global/arrow/panelarrow-vertical.png (arrow/panelarrow-vertical.png)
skin/classic/global/checkbox/cbox-check.gif (checkbox/cbox-check.gif)
skin/classic/global/checkbox/cbox-check-dis.gif (checkbox/cbox-check-dis.gif)
skin/classic/global/console/console-error-caret.gif (console/console-error-caret.gif)
skin/classic/global/console/console-error-dash.gif (console/console-error-dash.gif)
* skin/classic/global/console/console.css (console/console.css)
skin/classic/global/dirListing/dirListing.css (dirListing/dirListing.css)
skin/classic/global/dirListing/folder.png (dirListing/folder.png)
skin/classic/global/dirListing/local.png (dirListing/folder.png)
diff --git a/toolkit/themes/pinstripe/global/notification.css b/toolkit/themes/pinstripe/global/notification.css
--- a/toolkit/themes/pinstripe/global/notification.css
+++ b/toolkit/themes/pinstripe/global/notification.css
@@ -110,27 +110,27 @@ notification[type="warning"] .messageClo
.popup-notification-menubutton > .button-menubutton-button:-moz-focusring {
box-shadow: @focusRingShadow@;
position: relative;
}
.popup-notification-menubutton:not([type="menu-button"]),
.popup-notification-menubutton > .button-menubutton-button,
.popup-notification-menubutton > .button-menubutton-dropmarker {
- color: #fff;
- text-shadow: 0 -1px 0 rgba(0,0,0,.5);
- border-radius: 12px;
- border: 1px solid rgba(0,0,0,.65);
- background: -moz-linear-gradient(rgba(110,110,110,.9), rgba(70,70,70,.9) 49%,
- rgba(50,50,50,.9) 51%, rgba(40,40,40,.9));
- box-shadow: inset 0 1px 0 rgba(255,255,255,.2),
- inset 0 0 1px rgba(255,255,255,.1),
- 0 1px 0 rgba(255,255,255,.1);
+ -moz-appearance: none;
+ color: #434343;
+ border-radius: 4px;
+ border: 1px solid #b5b5b5;
+ background: -moz-linear-gradient(#fff, #f2f2f2);
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.8),
+ inset 0 0 1px rgba(255, 255, 255, 0.25),
+ 0 1px rgba(255, 255, 255, 0.3);
background-clip: padding-box;
background-origin: padding-box;
+ padding: 2px 6px;
}
.popup-notification-menubutton:not([type="menu-button"]) {
padding: 2px 9px;
}
.popup-notification-menubutton > .button-menubutton-button {
-moz-appearance: none;
@@ -145,17 +145,17 @@ notification[type="warning"] .messageClo
.popup-notification-menubutton > .button-menubutton-dropmarker {
padding-top: 7px;
padding-bottom: 7px;
-moz-padding-start: 5px;
-moz-padding-end: 8px;
margin-top: 0;
margin-bottom: 0;
-moz-margin-start: -1px;
- list-style-image: url("chrome://global/skin/arrow/arrow-dn-white.png");
+ list-style-image: url("chrome://global/skin/arrow/arrow-dn-panel.png");
}
.popup-notification-menubutton > .button-menubutton-button:-moz-locale-dir(ltr),
.popup-notification-menubutton > .button-menubutton-dropmarker:-moz-locale-dir(rtl) {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
@@ -163,20 +163,17 @@ notification[type="warning"] .messageClo
.popup-notification-menubutton > .button-menubutton-dropmarker:-moz-locale-dir(ltr) {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.popup-notification-menubutton:not([type="menu-button"]):hover:active,
.popup-notification-menubutton > .button-menubutton-button:hover:active,
.popup-notification-menubutton[open="true"] > .button-menubutton-dropmarker {
- background: -moz-linear-gradient(rgba(40,40,40,.9), rgba(70,70,70,.9));
- box-shadow: inset 0 0 3px rgba(0,0,0,.2),
- inset 0 1px 7px rgba(0,0,0,.4),
- 0 1px 0 rgba(255,255,255,.1);
+ box-shadow: inset 0 1px 4px -3px #000, 0 1px rgba(255, 255, 255, 0.3);
}
.popup-notification-closebutton {
-moz-margin-end: -12px;
margin-top: -13px;
}
.popup-notification-closeitem > .menu-iconic-left {
diff --git a/toolkit/themes/pinstripe/global/popup.css b/toolkit/themes/pinstripe/global/popup.css
--- a/toolkit/themes/pinstripe/global/popup.css
+++ b/toolkit/themes/pinstripe/global/popup.css
@@ -47,53 +47,50 @@ panel[type="arrow"][side="bottom"] {
panel[type="arrow"][side="left"],
panel[type="arrow"][side="right"] {
margin-top: -26px;
margin-bottom: -26px;
}
.panel-arrowcontent {
-moz-appearance: none;
- color: white;
- background: -moz-linear-gradient(rgba(85,85,85,1), rgba(75,75,75,.97) 5px, rgba(58,58,58,.97) 17px, rgba(43,43,43,.97) 40px, rgba(40,40,40,.97) 80px, rgba(40,40,40,.97));
- border-radius: 6px;
- box-shadow: 0 0 0 1px rgba(255,255,255,.15) inset,
+ background: #ededed;
+ border-radius: 5px;
+ box-shadow: 0 0 0 1px rgba(255,255,255,.5) inset,
0 1px 0 rgba(255,255,255,.05) inset,
0 0 0 1px rgba(0,0,0,.25);
+ color: #666;
padding: 16px;
margin: 1px;
}
-.panel-arrow {
- opacity: 0.97;
-}
-
.panel-arrow[side="top"] {
- list-style-image: url("chrome://global/skin/arrow/panelarrow-up.png");
+ list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.png");
margin-left: 6px;
margin-right: 6px;
margin-bottom: -2px;
}
.panel-arrow[side="bottom"] {
- list-style-image: url("chrome://global/skin/arrow/panelarrow-down.png");
+ list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.png");
+ -moz-transform: scaleY(-1);
margin-left: 6px;
margin-right: 6px;
margin-top: -2px;
}
.panel-arrow[side="left"] {
- list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png");
+ list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.png");
margin-top: 6px;
margin-bottom: 6px;
margin-right: -2px;
}
.panel-arrow[side="right"] {
- list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png");
+ list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.png");
-moz-transform: scaleX(-1);
margin-top: 6px;
margin-bottom: 6px;
margin-left: -2px;
}
/* ::::: tooltip ::::: */
Assignee | ||
Comment 19•12 years ago
|
||
Oops. Sorry, don't know how to use all the Bugzilla functionality.
Assignee | ||
Comment 20•12 years ago
|
||
Previous patch accidentally didn't include image files. Otherwise the same. Sorry about the spam.
Attachment #640748 -
Attachment is obsolete: true
Attachment #640748 -
Flags: review?(fryn)
Attachment #640748 -
Flags: feedback?(dao)
Attachment #640756 -
Flags: review?(fryn)
Attachment #640756 -
Flags: feedback?(dao)
Assignee | ||
Comment 21•12 years ago
|
||
Comment on attachment 640756 [details] [diff] [review]
Patch v5.1
># HG changeset patch
># User Chris Lee <chlee@mozilla.com>
># Date 1341952017 25200
># Node ID dc75bb2b5e6bc6ef8de0e48b0b0c48a1daa71aea
># Parent 6d7fae9764b34ce5d6e25d19a1c86fbcfabbf829
>Bug 771284 - Use light coloring for Mac OS X arrow panels
>
>diff --git a/browser/themes/pinstripe/browser.css b/browser/themes/pinstripe/browser.css
>--- a/browser/themes/pinstripe/browser.css
>+++ b/browser/themes/pinstripe/browser.css
>@@ -1268,23 +1268,44 @@ window[tabsontop="false"] richlistitem[t
> list-style-image: url("chrome://browser/skin/places/unstarred48.png");
> }
>
> #editBookmarkPanelTitle {
> font-size: 130%;
> font-weight: bold;
> }
>
>+#editBMPanel_rows > row {
>+ margin-bottom: 8px;
>+}
>+
>+#editBMPanel_rows > row:last-of-type {
>+ margin-bottom: 0;
>+}
>+
>+/**** Input elements ****/
>+
>+#editBookmarkPanel textbox {
>+ -moz-appearance: none;
>+ background: -moz-linear-gradient(#fafafa, #fff);
>+ border-radius: 3px;
>+ border: 1px solid rgba(0, 0, 0, 0.3) !important;
>+ box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.05),
>+ 0 1px rgba(255, 255, 255, 0.3);
>+ margin: 0;
>+ padding: 3px 6px;
>+}
>+
> /**** HUD style buttons ****/
>
> .editBookmarkPanelHeaderButton,
> .editBookmarkPanelBottomButton {
> @hudButton@
>- margin: 6px;
>- min-width: 79px;
>+ margin: 0;
>+ min-width: 82px;
> min-height: 22px;
> }
>
> .editBookmarkPanelHeaderButton:hover:active,
> .editBookmarkPanelBottomButton:hover:active {
> @hudButtonPressed@
> }
>
>@@ -1296,35 +1317,37 @@ window[tabsontop="false"] richlistitem[t
> .editBookmarkPanelBottomButton[default="true"] {
> background-color: #666;
> }
>
> #editBookmarkPanelHeader {
> margin-bottom: 6px;
> }
>
>+.editBookmarkPanelBottomButton:last-child {
>+ -moz-margin-start: 8px;
>+}
>+
> /* The following elements come from editBookmarkOverlay.xul. Styling that's
> specific to the editBookmarkPanel should be in browser.css. Styling that
> should be shared by all editBookmarkOverlay.xul consumers should be in
> editBookmarkOverlay.css. */
>
> #editBMPanel_newFolderBox {
> background-image: -moz-linear-gradient(rgb(90,90,90), rgb(40,40,40));
> background-origin: padding-box;
> background-clip: padding-box;
> border-radius: 0 0 3px 3px;
> border: 1px solid rgba(0,0,0,.3);
> border-top: none;
> box-shadow: inset 0 -1px 2px rgba(0,0,0,.2),
> inset 0 1px 0 rgba(255,255,255,.15),
> 0 1px 0 rgba(255,255,255,.15);
>+ margin: 0;
> padding: 0;
>- margin-left: 4px;
>- margin-right: 4px;
>- margin-bottom: 8px;
> height: 20px;
> }
>
> #editBMPanel_newFolderButton {
> -moz-appearance: none;
> border: 0;
> -moz-border-end-width: 3px;
> border-style: solid;
>@@ -1350,20 +1373,21 @@ window[tabsontop="false"] richlistitem[t
> }
>
> #editBMPanel_newFolderButton .button-text {
> display: none;
> }
>
> #editBMPanel_folderMenuList {
> @hudButton@
>- border-radius: 3px;
>+ margin: 0;
> min-height: 22px;
>- -moz-padding-start: 4px;
>- -moz-padding-end: 0;
>+ padding: 2px 4px 1px 8px;
>+ -moz-padding-start: 8px;
>+ -moz-padding-end: 4px;
> }
>
> #editBMPanel_folderMenuList:-moz-focusring {
> @hudButtonFocused@
> }
>
> #editBMPanel_folderMenuList[open="true"],
> #editBMPanel_folderMenuList:hover:active {
>@@ -1375,30 +1399,31 @@ window[tabsontop="false"] richlistitem[t
> display: -moz-box;
> background-color: transparent;
> border: 0;
> margin: 0;
> padding: 0;
> }
>
> #editBMPanel_folderMenuList > .menulist-dropmarker > .dropmarker-icon {
>- list-style-image: url("chrome://browser/skin/hud-style-dropmarker-double-arrows.png");
>+ list-style-image: url("chrome://global/skin/arrow/arrow-dn-panel.png");
> }
>
> /**** folder tree ****/
>
> #editBMPanel_folderTree {
> -moz-appearance: none;
>- border-radius: 2px 2px 0 0;
>- background-color: rgba(50,50,50,.9);
>- border: 1px solid rgba(0,0,0,.3);
>+ background: -moz-linear-gradient(#fafafa, #fff);
>+ border-radius: 3px 3px 0 0;
>+ border: 1px solid rgba(0, 0, 0, 0.3);
> border-bottom: none;
>- box-shadow: inset 0 1px 2px rgba(0,0,0,.15);
>- color: #fff;
>+ box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.05),
>+ 0 1px rgba(255, 255, 255, 0.3);
> /* Implements editBookmarkPanel resizing on folderTree un-collapse. */
>+ margin: 0 !important;
> min-width: 27em;
> position: relative;
> }
>
> #editBMPanel_folderTree:-moz-focusring {
> box-shadow: 0 0 4px 1px -moz-mac-focusring,
> 0 0 2px 1px -moz-mac-focusring;
> }
>@@ -1420,23 +1445,24 @@ window[tabsontop="false"] richlistitem[t
> }
>
> #editBMPanel_folderTree > treechildren::-moz-tree-twisty(selected, open) {
> -moz-image-region: rect(0px, 40px, 10px, 30px);
> }
>
> #editBMPanel_tagsSelector {
> -moz-appearance: none;
>- border-radius: 2px;
>- background-color: rgba(50,50,50,1);
>- border: 1px solid rgba(0,0,0,.3);
>+ border-radius: 3px;
>+ background: -moz-linear-gradient(#fafafa, #fff);
>+ border-radius: 3px 3px 0 0;
>+ border: 1px solid rgba(0, 0, 0, 0.3) !important;
> border-bottom: none;
>- box-shadow: inset 0 1px 2px rgba(0,0,0,.15),
>- 0 1px 0 rgba(255,255,255,.15);
>- color: #fff;
>+ box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.05),
>+ 0 1px rgba(255, 255, 255, 0.3);
>+ margin: 0;
> }
>
> #editBMPanel_tagsSelector:-moz-focusring {
> @hudButtonFocused@
> }
>
> #editBMPanel_tagsSelector .listcell-check {
> -moz-appearance: none;
>@@ -1474,23 +1500,21 @@ window[tabsontop="false"] richlistitem[t
> background-color: #b3b3b3;
> }
>
> /**** expanders ****/
>
> #editBookmarkPanel .expander-up,
> #editBookmarkPanel .expander-down {
> @hudButton@
>- border-radius: 3px;
> -moz-margin-start: 4px;
>- -moz-margin-end: 2px;
> padding: 0;
>- -moz-padding-start: 4px;
>- min-width: 10px;
>- min-height: 20px;
>+ -moz-padding-start: 3px;
>+ min-width: 26px;
>+ min-height: 22px;
> }
>
> #editBookmarkPanel .expander-up:-moz-focusring,
> #editBookmarkPanel .expander-down:-moz-focusring {
> @hudButtonFocused@
> }
>
> #editBookmarkPanel .expander-up:hover:active,
>@@ -1504,23 +1528,23 @@ window[tabsontop="false"] richlistitem[t
>
> #editBookmarkPanel .expander-down {
> list-style-image: url("chrome://browser/skin/hud-style-expander-closed.png");
> }
>
> #editBMPanel_tagsField {
> -moz-appearance: none !important;
> -moz-padding-start: 3px !important;
>- margin: 2px !important;
> border: 1px solid rgba(0,0,0,.5) !important;
> box-shadow: inset 0 1px 0 rgba(0,0,0,.3);
> background-color: #666 !important;
> background-clip: padding-box;
> background-origin: padding-box;
> color: #fff !important;
>+ margin: 0;
> min-height: 20px;
> }
>
> #editBMPanel_tagsField > .autocomplete-textbox-container > .textbox-input-box > html|*.textbox-input:-moz-placeholder {
> color: #bbb;
> }
>
> #editBMPanel_tagsField[focused="true"] {
>@@ -2307,20 +2331,24 @@ toolbarbutton.chevron > .toolbarbutton-m
>
> #geo-notification-icon {
> list-style-image: url(chrome://browser/skin/Geolocation-16.png);
> }
>
> .geolocation-text-link {
> color: #fff;
> -moz-margin-start: 0; /* override default label margin to match description margin */
>+ color: #0073e6;
>+ text-decoration: none;
> }
>
> .telemetry-text-link {
> color: #fff;
>+ color: #0073e6;
>+ text-decoration: none;
> }
>
> #addons-notification-icon {
> list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric-16.png);
> }
>
> #password-notification-icon {
> list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png);
>diff --git a/browser/themes/pinstripe/downloads/buttons.png b/browser/themes/pinstripe/downloads/buttons.png
>index 0fdb1b4c138eee18daf481dc503d24fb631bef57..0b5161ff01e345592da15d696a7f8de985f5db5d
>GIT binary patch
>literal 1669
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
>P00000NkvXXu0mjf!Q?U<
>
>diff --git a/browser/themes/pinstripe/downloads/downloads.css b/browser/themes/pinstripe/downloads/downloads.css
>--- a/browser/themes/pinstripe/downloads/downloads.css
>+++ b/browser/themes/pinstripe/downloads/downloads.css
>@@ -74,17 +74,16 @@ richlistitem[type="download"]:last-child
>
> #downloadsListBox:-moz-focusring > richlistitem[type="download"][selected] {
> outline: 1px #999 dotted;
> outline-offset: -1px;
> -moz-outline-radius: 3px;
> }
>
> .downloadInfo {
>- color: white;
> padding: 8px;
> -moz-padding-end: 0;
> }
>
> .downloadTypeIcon {
> -moz-margin-end: 8px;
> /* Prevent flickering when changing states. */
> min-height: 32px;
>diff --git a/browser/themes/pinstripe/hud-style-expander-closed.png b/browser/themes/pinstripe/hud-style-expander-closed.png
>index 25219fea2257b75ec400cd71c2c98d9ce4f15fba..f0e97b22e161028728a92d5032d7ecd6cfc343f0
>GIT binary patch
>literal 155
>zc%17D@N?(olHy`uVBq!ia0vp^oIuRR!2%?ApR4f$Qc0dJjv*Y;$rsjK+_`?{IR>^_
>znhs^WhwGmnaJ@Et>t6|pEq~YOvFrU>&oiZZ<?HRI9xka|_1E+NQ~lC|r~VtqZu}7Y
>zeDnSMtI3c5`v@pY{M#&3^fA8blAInx*vWtQAJ}WVurjcyE8g{&{{97M8-u5-pUXO@
>GgeCwu-9MiI
>
>diff --git a/browser/themes/pinstripe/hud-style-expander-open.png b/browser/themes/pinstripe/hud-style-expander-open.png
>index 168b53a5e8b9bba12051917b323ad64222ace4ca..e3febf4ffb85360ef5245b5563c3799f4b7da59f
>GIT binary patch
>literal 155
>zc%17D@N?(olHy`uVBq!ia0vp^oIuRR!2%?ApR4f$Qc0dJjv*Yf$q5Y1yqsq%r49+0
>z&A9T!^yZs_gB87M>>&Z&S5x+#-uOsu`D3@sTOtlN9h3EQm*)C++FZm!&iEAz*URUT
>zb57*{&_8$JL%hxYgO6J3<PO&_{m=LRsY2SH>CBs^GU%GfIbJqe_5f%bgQu&X%Q~lo
>FCICvgI_dxb
>
>diff --git a/browser/themes/pinstripe/shared.inc b/browser/themes/pinstripe/shared.inc
>--- a/browser/themes/pinstripe/shared.inc
>+++ b/browser/themes/pinstripe/shared.inc
>@@ -1,6 +1,6 @@
> %include ../../../toolkit/themes/pinstripe/global/shared.inc
> %include ../browserShared.inc
>
>-%define hudButton -moz-appearance: none; color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.5); border-radius: 12px; border: 1px solid rgba(0,0,0,.65); background: -moz-linear-gradient(rgba(110,110,110,.9), rgba(70,70,70,.9) 49%, rgba(50,50,50,.9) 51%, rgba(40,40,40,.9)); box-shadow: inset 0 1px 0 rgba(255,255,255,.2), inset 0 0 1px rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.1); background-clip: padding-box; background-origin: padding-box; padding: 2px 9px;
>-%define hudButtonPressed background: -moz-linear-gradient(rgba(40,40,40,.9), rgba(70,70,70,.9)); box-shadow: inset 0 0 3px rgba(0,0,0,.2), inset 0 1px 7px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.1);
>+%define hudButton -moz-appearance: none; color: #434343; border-radius: 4px; border: 1px solid #b5b5b5; background: -moz-linear-gradient(#fff, #f2f2f2); box-shadow: inset 0 1px rgba(255, 255, 255, 0.8), inset 0 0 1px rgba(255, 255, 255, 0.25), 0 1px rgba(255, 255, 255, 0.3); background-clip: padding-box; background-origin: padding-box; padding: 2px 6px;
>+%define hudButtonPressed box-shadow: inset 0 1px 4px -3px #000, 0 1px rgba(255, 255, 255, 0.3);
> %define hudButtonFocused box-shadow: 0 0 1px -moz-mac-focusring inset, 0 0 4px 1px -moz-mac-focusring, 0 0 2px 1px -moz-mac-focusring;
>diff --git a/toolkit/themes/pinstripe/global/arrow/arrow-dn-panel.png b/toolkit/themes/pinstripe/global/arrow/arrow-dn-panel.png
>new file mode 100644
>index 0000000000000000000000000000000000000000..b0a9c837836a7b6803bf11b91c664130fa810d26
>GIT binary patch
>literal 1083
>zc$}3}&r1|h9AD5hBu`<OmtJFmQM>cr?9R;2;3n(NZZ5cH>q2{MoO!O3&b--~XS*60
>z)Fn@LjPPLpfY7O+Lq#486hk^hBuE5y3yNyVir%Pe5+U@3H}8GFd_UjsXTCpX1_v&*
>zwsf?FLZQ}dpO$BLGdqV4H?i-`y|1s?b)2S)bcl@5itgc1(j>zeWNp2K^H?`0%P(+u
>zDAZ823PoDX^{WQ4BYNNysoHKRknWzUs~cmOf?-^;oCNpr@e>YMW`esc=3vfE;Zdt^
>z%ELob0|jGh%ur0O=RD}Hsw{wwsSc|4xZ|tU1h*YmW$(bub70$rjwQGqQpMaLND&VM
>zF#^K|lpv5$1Vv-AET01cM39F9kAyIi)u^CC2zG^I**tSZ&1;$6Tue)Fqm;TT&sQpy
>zNF^E}UWrGFq69GnA<R6&{-i_oYS{5R>k%~U8=mD-i#Q<A^<gqW6C79n1>4Q#_5wTp
>zZlPGo_^R&mC<1xg=Ih=*&Et`Sz5T+Zi}^hE$%JRHevEYPOLZ_baAa)Mi=M@rqK|9D
>zn6R-!vs!|alyqE4X`+~tqiHCKk|e{7n2{ABu4G_JsblwJm?dIbriwI8ff|&0<A_Nb
>zDPl(Gm7$1GQbCdyt7Ef{Pj$z@b*%LVD;|hdQy$hS@d|{D*E>HrN+|J1i3?Ig66nh5
>zhUEl?GeKi^xnj?{hRuveY_MHf)%phmD8wN`atz7>lo*S+AS9D=uYh85Oo}EMgB`5-
>zKh@$H3I4C~sGHc#1<$=<XUg8XV2AC9$ClxGSF)Wg(qvXk7OHQCU#+cO)k~$>jg5`k
>z%F<Hp#NqZEKWfjuf8JbeTYl)QPfdS#d9rPKdioeb4`%1)=6V_%8yCpiN9C5Icgn`Q
>z#hLZ~{{GcpKexU$Yqx5k+%%8CGX3;EyEQ*Qe;RZwHqSgimAu<_`^)`U@d$VtI=hm)
>TG_={>5Ug`HJ)kZ0Ub*=j`dDC<
>
>diff --git a/toolkit/themes/pinstripe/global/arrow/panelarrow-down.png b/toolkit/themes/pinstripe/global/arrow/panelarrow-down.png
>deleted file mode 100644
>Binary file toolkit/themes/pinstripe/global/arrow/panelarrow-down.png has changed
>diff --git a/toolkit/themes/pinstripe/global/arrow/panelarrow-horiz.png b/toolkit/themes/pinstripe/global/arrow/panelarrow-horiz.png
>deleted file mode 100644
>Binary file toolkit/themes/pinstripe/global/arrow/panelarrow-horiz.png has changed
>diff --git a/toolkit/themes/pinstripe/global/arrow/panelarrow-horizontal.png b/toolkit/themes/pinstripe/global/arrow/panelarrow-horizontal.png
>new file mode 100644
>index 0000000000000000000000000000000000000000..5050ec169f1076a0495a50aead1dc2141e86078d
>GIT binary patch
>literal 200
>zc%17D@N?(olHy`uVBq!ia0vp^0zj<J!3HGRdQOx8seVrv$B>F!Z?A6TJ**(X`q0P8
>zEU96Q(__v}E>k`>aNWB9G&GM-Wa);b;gR1tIlb##j$F!1U|uk9%B9y9efkX@$0aUC
>zbuZm<O-kFap@T8zObQU{Jq|kc+$zlo47m*t7(f3ruh{MV-0Aym8Xe5;H#wNqcM361
>u;An7RP+?LKWawq6U^$@h{r%tg24VKuxmu#z{?!1T#^CAd=d#Wzp$P!P>r1Qv
>
>diff --git a/toolkit/themes/pinstripe/global/arrow/panelarrow-up.png b/toolkit/themes/pinstripe/global/arrow/panelarrow-up.png
>deleted file mode 100644
>Binary file toolkit/themes/pinstripe/global/arrow/panelarrow-up.png has changed
>diff --git a/toolkit/themes/pinstripe/global/arrow/panelarrow-vertical.png b/toolkit/themes/pinstripe/global/arrow/panelarrow-vertical.png
>new file mode 100644
>index 0000000000000000000000000000000000000000..ea4fb2d0f44ab775e09dd2948caaca58811a2c76
>GIT binary patch
>literal 213
>zc%17D@N?(olHy`uVBq!ia0vp^>Od^O!3HF!-bqscQgb|A978H@9X+>^_kaQq%K;xJ
>zv!sSKPKQ|{l}=SSu&!0UK4H%z_d}OnKRxs*SIMZSu<Y>J)rnH)EXyn2`@cQ9Lr%<T
>zM^yHrwZENW_*ZZB(sbRzSYXC?xai!Zpi68Ha_LQ(1{03YOq4kBm?MI}$MBx)gad*G
>zEKdqqc$h0?+5#Q8+7oRi97>en-|~PVNAH6<-+^UJjCnFVj~nCv%WJyiYR$ancn9cC
>N22WQ%mvv4FO#sCPPyYY_
>
>diff --git a/toolkit/themes/pinstripe/global/jar.mn b/toolkit/themes/pinstripe/global/jar.mn
>--- a/toolkit/themes/pinstripe/global/jar.mn
>+++ b/toolkit/themes/pinstripe/global/jar.mn
>@@ -56,16 +56,17 @@ toolkit.jar:
> skin/classic/global/toolbarbutton.css
> skin/classic/global/TopLevelImageDocument.css
> skin/classic/global/TopLevelVideoDocument.css
> * skin/classic/global/tree.css
> * skin/classic/global/viewbuttons.css
> skin/classic/global/wizard.css
> skin/classic/global/arrow/arrow-dn-dis.gif (arrow/arrow-dn-dis.gif)
> skin/classic/global/arrow/arrow-dn-dis.png (arrow/arrow-dn-dis.png)
>+ skin/classic/global/arrow/arrow-dn-panel.png (arrow/arrow-dn-panel.png)
> skin/classic/global/arrow/arrow-dn-sharp.gif (arrow/arrow-dn-sharp.gif)
> skin/classic/global/arrow/arrow-dn-white.png (arrow/arrow-dn-white.png)
> skin/classic/global/arrow/arrow-dn.gif (arrow/arrow-dn.gif)
> skin/classic/global/arrow/arrow-dn.png (arrow/arrow-dn.png)
> skin/classic/global/arrow/arrow-lft-dis.gif (arrow/arrow-lft-dis.gif)
> skin/classic/global/arrow/arrow-lft-hov.gif (arrow/arrow-lft-hov.gif)
> skin/classic/global/arrow/arrow-lft-sharp-end.gif (arrow/arrow-lft-sharp-end.gif)
> skin/classic/global/arrow/arrow-lft-sharp.gif (arrow/arrow-lft-sharp.gif)
>@@ -73,19 +74,18 @@ toolkit.jar:
> skin/classic/global/arrow/arrow-rit-dis.gif (arrow/arrow-rit-dis.gif)
> skin/classic/global/arrow/arrow-rit-hov.gif (arrow/arrow-rit-hov.gif)
> skin/classic/global/arrow/arrow-rit-sharp-end.gif (arrow/arrow-rit-sharp-end.gif)
> skin/classic/global/arrow/arrow-rit-sharp.gif (arrow/arrow-rit-sharp.gif)
> skin/classic/global/arrow/arrow-rit.gif (arrow/arrow-rit.gif)
> skin/classic/global/arrow/arrow-up-dis.gif (arrow/arrow-up-dis.gif)
> skin/classic/global/arrow/arrow-up-sharp.gif (arrow/arrow-up-sharp.gif)
> skin/classic/global/arrow/arrow-up.gif (arrow/arrow-up.gif)
>- skin/classic/global/arrow/panelarrow-up.png (arrow/panelarrow-up.png)
>- skin/classic/global/arrow/panelarrow-down.png (arrow/panelarrow-down.png)
>- skin/classic/global/arrow/panelarrow-horiz.png (arrow/panelarrow-horiz.png)
>+ skin/classic/global/arrow/panelarrow-horizontal.png (arrow/panelarrow-horizontal.png)
>+ skin/classic/global/arrow/panelarrow-vertical.png (arrow/panelarrow-vertical.png)
> skin/classic/global/checkbox/cbox-check.gif (checkbox/cbox-check.gif)
> skin/classic/global/checkbox/cbox-check-dis.gif (checkbox/cbox-check-dis.gif)
> skin/classic/global/console/console-error-caret.gif (console/console-error-caret.gif)
> skin/classic/global/console/console-error-dash.gif (console/console-error-dash.gif)
> * skin/classic/global/console/console.css (console/console.css)
> skin/classic/global/dirListing/dirListing.css (dirListing/dirListing.css)
> skin/classic/global/dirListing/folder.png (dirListing/folder.png)
> skin/classic/global/dirListing/local.png (dirListing/folder.png)
>diff --git a/toolkit/themes/pinstripe/global/notification.css b/toolkit/themes/pinstripe/global/notification.css
>--- a/toolkit/themes/pinstripe/global/notification.css
>+++ b/toolkit/themes/pinstripe/global/notification.css
>@@ -110,27 +110,27 @@ notification[type="warning"] .messageClo
> .popup-notification-menubutton > .button-menubutton-button:-moz-focusring {
> box-shadow: @focusRingShadow@;
> position: relative;
> }
>
> .popup-notification-menubutton:not([type="menu-button"]),
> .popup-notification-menubutton > .button-menubutton-button,
> .popup-notification-menubutton > .button-menubutton-dropmarker {
>- color: #fff;
>- text-shadow: 0 -1px 0 rgba(0,0,0,.5);
>- border-radius: 12px;
>- border: 1px solid rgba(0,0,0,.65);
>- background: -moz-linear-gradient(rgba(110,110,110,.9), rgba(70,70,70,.9) 49%,
>- rgba(50,50,50,.9) 51%, rgba(40,40,40,.9));
>- box-shadow: inset 0 1px 0 rgba(255,255,255,.2),
>- inset 0 0 1px rgba(255,255,255,.1),
>- 0 1px 0 rgba(255,255,255,.1);
>+ -moz-appearance: none;
>+ color: #434343;
>+ border-radius: 4px;
>+ border: 1px solid #b5b5b5;
>+ background: -moz-linear-gradient(#fff, #f2f2f2);
>+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.8),
>+ inset 0 0 1px rgba(255, 255, 255, 0.25),
>+ 0 1px rgba(255, 255, 255, 0.3);
> background-clip: padding-box;
> background-origin: padding-box;
>+ padding: 2px 6px;
> }
>
> .popup-notification-menubutton:not([type="menu-button"]) {
> padding: 2px 9px;
> }
>
> .popup-notification-menubutton > .button-menubutton-button {
> -moz-appearance: none;
>@@ -145,17 +145,17 @@ notification[type="warning"] .messageClo
> .popup-notification-menubutton > .button-menubutton-dropmarker {
> padding-top: 7px;
> padding-bottom: 7px;
> -moz-padding-start: 5px;
> -moz-padding-end: 8px;
> margin-top: 0;
> margin-bottom: 0;
> -moz-margin-start: -1px;
>- list-style-image: url("chrome://global/skin/arrow/arrow-dn-white.png");
>+ list-style-image: url("chrome://global/skin/arrow/arrow-dn-panel.png");
> }
>
> .popup-notification-menubutton > .button-menubutton-button:-moz-locale-dir(ltr),
> .popup-notification-menubutton > .button-menubutton-dropmarker:-moz-locale-dir(rtl) {
> border-top-right-radius: 0;
> border-bottom-right-radius: 0;
> }
>
>@@ -163,20 +163,17 @@ notification[type="warning"] .messageClo
> .popup-notification-menubutton > .button-menubutton-dropmarker:-moz-locale-dir(ltr) {
> border-top-left-radius: 0;
> border-bottom-left-radius: 0;
> }
>
> .popup-notification-menubutton:not([type="menu-button"]):hover:active,
> .popup-notification-menubutton > .button-menubutton-button:hover:active,
> .popup-notification-menubutton[open="true"] > .button-menubutton-dropmarker {
>- background: -moz-linear-gradient(rgba(40,40,40,.9), rgba(70,70,70,.9));
>- box-shadow: inset 0 0 3px rgba(0,0,0,.2),
>- inset 0 1px 7px rgba(0,0,0,.4),
>- 0 1px 0 rgba(255,255,255,.1);
>+ box-shadow: inset 0 1px 4px -3px #000, 0 1px rgba(255, 255, 255, 0.3);
> }
>
> .popup-notification-closebutton {
> -moz-margin-end: -12px;
> margin-top: -13px;
> }
>
> .popup-notification-closeitem > .menu-iconic-left {
>diff --git a/toolkit/themes/pinstripe/global/popup.css b/toolkit/themes/pinstripe/global/popup.css
>--- a/toolkit/themes/pinstripe/global/popup.css
>+++ b/toolkit/themes/pinstripe/global/popup.css
>@@ -47,53 +47,50 @@ panel[type="arrow"][side="bottom"] {
> panel[type="arrow"][side="left"],
> panel[type="arrow"][side="right"] {
> margin-top: -26px;
> margin-bottom: -26px;
> }
>
> .panel-arrowcontent {
> -moz-appearance: none;
>- color: white;
>- background: -moz-linear-gradient(rgba(85,85,85,1), rgba(75,75,75,.97) 5px, rgba(58,58,58,.97) 17px, rgba(43,43,43,.97) 40px, rgba(40,40,40,.97) 80px, rgba(40,40,40,.97));
>- border-radius: 6px;
>- box-shadow: 0 0 0 1px rgba(255,255,255,.15) inset,
>+ background: #ededed;
>+ border-radius: 5px;
>+ box-shadow: 0 0 0 1px rgba(255,255,255,.5) inset,
> 0 1px 0 rgba(255,255,255,.05) inset,
> 0 0 0 1px rgba(0,0,0,.25);
>+ color: #666;
> padding: 16px;
> margin: 1px;
> }
>
>-.panel-arrow {
>- opacity: 0.97;
>-}
>-
> .panel-arrow[side="top"] {
>- list-style-image: url("chrome://global/skin/arrow/panelarrow-up.png");
>+ list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.png");
> margin-left: 6px;
> margin-right: 6px;
> margin-bottom: -2px;
> }
>
> .panel-arrow[side="bottom"] {
>- list-style-image: url("chrome://global/skin/arrow/panelarrow-down.png");
>+ list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.png");
>+ -moz-transform: scaleY(-1);
> margin-left: 6px;
> margin-right: 6px;
> margin-top: -2px;
> }
>
> .panel-arrow[side="left"] {
>- list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png");
>+ list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.png");
> margin-top: 6px;
> margin-bottom: 6px;
> margin-right: -2px;
> }
>
> .panel-arrow[side="right"] {
>- list-style-image: url("chrome://global/skin/arrow/panelarrow-horiz.png");
>+ list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.png");
> -moz-transform: scaleX(-1);
> margin-top: 6px;
> margin-bottom: 6px;
> margin-left: -2px;
> }
>
> /* ::::: tooltip ::::: */
>
Attachment #640756 -
Attachment is patch: true
Comment 22•12 years ago
|
||
Comment on attachment 640756 [details] [diff] [review]
Patch v5.1
(In reply to Chris Lee (:cleer) from comment #16)
> (In reply to Dão Gottwald [:dao] from comment #15)
> > >+ skin/classic/global/arrow/arrow-dn-panel.png (arrow/arrow-dn-panel.png)
> >
> > We already have arrow-dn-sharp.gif, arrow-dn.gif and arrow-dn.png. Can you
> > use or update one of these?
> >
>
> These are different images used in different cases. Changing them probably
> alters another element that we don't want to alter.
If their names are to be believed, these are generic images that should work in different contexts. It's unclear why elements in panels need a specific down arrow that wouldn't work in other contexts.
> #editBMPanel_folderMenuList {
> @hudButton@
>- border-radius: 3px;
>+ margin: 0;
> min-height: 22px;
>- -moz-padding-start: 4px;
>- -moz-padding-end: 0;
>+ padding: 2px 4px 1px 8px;
>+ -moz-padding-start: 8px;
>+ -moz-padding-end: 4px;
Use padding-top and padding-bottom.
> #editBMPanel_tagsSelector {
>- box-shadow: inset 0 1px 2px rgba(0,0,0,.15),
>- 0 1px 0 rgba(255,255,255,.15);
>+ box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.05),
>+ 0 1px rgba(255, 255, 255, 0.3);
Remove the added spaces.
> .geolocation-text-link {
> color: #fff;
> -moz-margin-start: 0; /* override default label margin to match description margin */
>+ color: #0073e6;
>+ text-decoration: none;
> }
>
> .telemetry-text-link {
> color: #fff;
>+ color: #0073e6;
>+ text-decoration: none;
> }
Set the color only once per rule.
Attachment #640756 -
Flags: review?(fryn)
Attachment #640756 -
Flags: review-
Attachment #640756 -
Flags: feedback?(dao)
Assignee | ||
Comment 23•12 years ago
|
||
Updated re: latest feedback. Replacing the existing global arrow image is a visual design question for shorlander which I personally don't think should hold up the development of this patch. I'll try to direct him to this question later.
Attachment #640756 -
Attachment is obsolete: true
Assignee | ||
Updated•12 years ago
|
Attachment #640805 -
Attachment is patch: true
Assignee | ||
Updated•12 years ago
|
Attachment #640805 -
Flags: feedback?(dao)
Comment 24•12 years ago
|
||
Comment on attachment 640805 [details] [diff] [review]
Patch v6
>+#editBookmarkPanel textbox {
child selector
>-%define hudButtonPressed background: -moz-linear-gradient(rgba(40,40,40,.9), rgba(70,70,70,.9)); box-shadow: inset 0 0 3px rgba(0,0,0,.2), inset 0 1px 7px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.1);
>+%define hudButtonPressed box-shadow: inset 0 1px 4px -3px #000, 0 1px rgba(255, 255, 255, 0.3);
remove the added spaces within the color values throughout this patch
> .popup-notification-menubutton:not([type="menu-button"]),
> .popup-notification-menubutton > .button-menubutton-button,
> .popup-notification-menubutton > .button-menubutton-dropmarker {
>+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.8),
>+ inset 0 0 1px rgba(255, 255, 255, 0.25),
>+ 0 1px rgba(255, 255, 255, 0.3);
indentation is off
Attachment #640805 -
Flags: feedback?(dao)
Assignee | ||
Comment 25•12 years ago
|
||
Thanks for the review. Altered the patch in response.
Attachment #640805 -
Attachment is obsolete: true
Attachment #645148 -
Flags: review?(dao)
Comment 26•12 years ago
|
||
Comment on attachment 645148 [details] [diff] [review]
Patch v7
pinstripe/global/arrow/ is a mess which is why I don't want arrow-dn-panel.png in there. You can put it in browser/themes/pinstripe/places/ if you like.
You'll also want to remove hud-style-dropmarker-double-arrows.png.
Attachment #645148 -
Flags: review?(dao) → review-
Comment 27•12 years ago
|
||
Comment on attachment 645148 [details] [diff] [review]
Patch v7
>+#editBMPanel_rows > row > textbox,
>+#editBMPanel_rows > row > hbox > textbox {
>+ -moz-appearance: none;
>+ background: -moz-linear-gradient(#fafafa, #fff);
>+ border-radius: 3px;
>+ border: 1px solid rgba(0,0,0,.3) !important;
>+ box-shadow: inset 0 1px 1px 1px rgba(0,0,0,.05),
>+ 0 1px rgba(255,255,255,.3);
>+ margin: 0;
>+ padding: 3px 6px;
>+}
This looks like it lacks styling for the focused state.
Not sure why these text fields need custom styling at all, though.
Assignee | ||
Comment 28•12 years ago
|
||
(In reply to Dão Gottwald [:dao] from comment #26)
> Comment on attachment 645148 [details] [diff] [review]
> Patch v7
>
> pinstripe/global/arrow/ is a mess which is why I don't want
> arrow-dn-panel.png in there. You can put it in
> browser/themes/pinstripe/places/ if you like.
>
> You'll also want to remove hud-style-dropmarker-double-arrows.png.
The image is specific to arrow panels, though, not specific to the bookmarks panel. Future panels with dropdowns should use the same image.
Assignee | ||
Comment 29•12 years ago
|
||
One solution to the filename issue:
/browser/themes/pinstripe/panel-dropmarker.png
/browser/themes/pinstripe/panel-expander-closed.png
/browser/themes/pinstripe/panel-expander-open.png
Personally, I feel like we should keep all the resources related and specific to the arrow panel in a folder or at least with the same filename prefix. This'd include panelarrow-horizontal.png and panelarrow-vertical.png, which are currently in /global/themes/pinstripe/arrow/ (the "messy" directory).
I'm also unsure of what "hud" in the filenames refers to. If it means the black system style known as "HUD" on Mac (probably), we should rename all references of it to something else (currently I'm using "panel"). This would have to include the @hudButton@ macros in shared.inc, though. It's also possible that "hud" just means heads-up display, including the new panel.
Also, there are some other resources associated with the panel (currently styled black and with the hud- prefix) of which I'd like to get new versions from Stephen.
I also think I fixed the focus styles on the text fields and expanded areas. Not sure about buttons.
Attachment #645148 -
Attachment is obsolete: true
Attachment #645613 -
Flags: review?(dao)
Assignee | ||
Updated•12 years ago
|
Attachment #645613 -
Attachment is patch: true
Comment 30•12 years ago
|
||
Comment on attachment 645613 [details] [diff] [review]
Patch v8
>- list-style-image: url("chrome://global/skin/arrow/arrow-dn-white.png");
This makes the image unused. Please remove it.
>+ list-style-image: url("chrome://global/skin/arrow/arrow-dn-panel.png");
This image doesn't exist.
You'll also need to remove the gross hack that was added here:
http://hg.mozilla.org/mozilla-central/annotate/5598b8c4f271/browser/themes/pinstripe/browser.css#l3459
(lines 3459-3486)
Attachment #645613 -
Flags: review?(dao) → review-
Assignee | ||
Comment 31•12 years ago
|
||
Updated the dropmarker image-related stuff. The custom social panel styling and images can indeed be removed, but I feel like that should happen in a separate bug. What do you think?
Any thoughts on the filename questions in comment 29?
Attachment #645613 -
Attachment is obsolete: true
Attachment #645855 -
Flags: review?(dao)
Assignee | ||
Comment 32•12 years ago
|
||
Oops, forgot to include new images in previous patches. Previous comments/questions still stand.
Attachment #645855 -
Attachment is obsolete: true
Attachment #645855 -
Flags: review?(dao)
Attachment #645884 -
Flags: review?(dao)
Assignee | ||
Comment 33•12 years ago
|
||
Ping for review.
Assignee | ||
Comment 34•12 years ago
|
||
Ping for review again.
Assignee | ||
Updated•12 years ago
|
Attachment #645884 -
Flags: review?(fryn)
Comment 35•12 years ago
|
||
Comment on attachment 645884 [details] [diff] [review]
Patch v9.1
Review of attachment 645884 [details] [diff] [review]:
-----------------------------------------------------------------
The patch is mostly great and overall a major improvement. :)
Just a few things to fix:
The arrow panel close button should be replaced with a dark "X", so it is more visible.
The chevrons in the "add bookmark" panel should be centered within their respective buttons.
The Sync promo that appears in the "remember password" and "add bookmark" panels needs updated background and/or foreground colors to be more readable. (To reproduce this, change the value of browser.syncPromoViewsLeft in about:config to 1, and click the bookmark star.)
I'm indifferent about where the social CSS/image changes get made, as long as they get done before we ship that UI to release channel.
Attachment #645884 -
Flags: review?(fryn)
Attachment #645884 -
Flags: review?(dao)
Attachment #645884 -
Flags: review-
Comment 36•12 years ago
|
||
By "that UI", I'm referring to the social UI.
Also, just a heads up that the patch bitrotted a few lines in browser/themes/pinstripe/jar.mn.
Assignee | ||
Comment 37•12 years ago
|
||
Should fix all above problems as well as some related ones I spotted (centering the dropmarker in geolocation panel and coloring of the bottom part of the downloads panel).
Attachment #645884 -
Attachment is obsolete: true
Attachment #650717 -
Flags: review?(fryn)
Assignee | ||
Updated•12 years ago
|
Attachment #650717 -
Attachment is patch: true
Comment 38•12 years ago
|
||
Comment on attachment 650717 [details] [diff] [review]
Patch 10
While I think this is good enough to land, there is just one more thing that I would like fixed, so we don't have to open a followup for it:
In the "add bookmark" dialog, clicking the folder chevron still causes the chevron to become misaligned. It seems that the chevron alignment fix needs to be more generalized.
Also the mini-toolbar under the folders with the "+" icon has a light-on-dark color scheme that doesn't match the rest of the panel anymore. If fixing the color scheme is trivial CSS, go for it. If not, it's tertiary UI, so I'm not that worried about it.
Attachment #650717 -
Flags: review?(fryn)
Assignee | ||
Comment 39•12 years ago
|
||
Addresses above issues and some related things I found.
Attachment #650717 -
Attachment is obsolete: true
Attachment #651581 -
Flags: review?(fryn)
Comment 40•12 years ago
|
||
Comment on attachment 651581 [details] [diff] [review]
Patch 11
Review of attachment 651581 [details] [diff] [review]:
-----------------------------------------------------------------
Great improvements. :)
1 thing to fix:
The Sync promo messes up the layout of the "Remember Password" prompt.
Reproduce using positive browser.syncPromoViewsLeft value.
Tips for fixing this:
You can test with the "Remember Password" prompt by entering arbitrary input into https://www.getpersonas.com/en-US/signin
Please also test with the "Add Bookmark" prompt to avoid regressing that.
Attachment #651581 -
Flags: review?(fryn) → review-
Comment 41•12 years ago
|
||
Comment on attachment 651581 [details] [diff] [review]
Patch 11
Review of attachment 651581 [details] [diff] [review]:
-----------------------------------------------------------------
Ah, I didn't build the correct directories.
Looks good to me.
We need to remember to fix bug 780349 before shipping the social API.
Attachment #651581 -
Flags: review- → review+
Assignee | ||
Comment 42•12 years ago
|
||
Got rid of a bunch of CSS/an image that were serving only to make the bookmarks panel folder tree background suitable for the dark theme. Just look around #editBMPanel_folderTree.
Also renamed an image just for consistency.
Attachment #651581 -
Attachment is obsolete: true
Attachment #651923 -
Flags: review?(fryn)
Comment 43•12 years ago
|
||
Comment on attachment 651923 [details] [diff] [review]
Patch 12
Review of attachment 651923 [details] [diff] [review]:
-----------------------------------------------------------------
If you rename the files in the code, you also need to run `hg move` to move the actual files to their new path.
Also, please update the jar.mn changes to apply cleanly to the latest tree.
(1. hg qpop; hg pull -u; hg qpush 2. Re-do changes in the file. 3. hg qref)
Attachment #651923 -
Flags: review?(fryn) → review-
Updated•12 years ago
|
Attachment #651581 -
Flags: review+
Assignee | ||
Comment 44•12 years ago
|
||
Should fix those things.
Attachment #651923 -
Attachment is obsolete: true
Attachment #652240 -
Flags: review?(fryn)
Comment 45•12 years ago
|
||
Comment on attachment 652240 [details] [diff] [review]
Patch 13
Similar issue as in bug 776708: you can't use a browser resource (panel-dropmarker.png) in toolkit.
Assignee | ||
Comment 46•12 years ago
|
||
(In reply to Dão Gottwald [:dao] from comment #45)
> Comment on attachment 652240 [details] [diff] [review]
> Patch 13
>
> Similar issue as in bug 776708: you can't use a browser resource
> (panel-dropmarker.png) in toolkit.
Vice versa, you mean?
Assignee | ||
Comment 47•12 years ago
|
||
(In reply to Chris Lee (:cleer) from comment #46)
> (In reply to Dão Gottwald [:dao] from comment #45)
> > Comment on attachment 652240 [details] [diff] [review]
> > Patch 13
> >
> > Similar issue as in bug 776708: you can't use a browser resource
> > (panel-dropmarker.png) in toolkit.
>
> Vice versa, you mean?
Oh, never mind, I found it. Will fix.
Assignee | ||
Comment 48•12 years ago
|
||
Fixed image location issue.
Attachment #652240 -
Attachment is obsolete: true
Attachment #652240 -
Flags: review?(fryn)
Attachment #652255 -
Flags: review?(fryn)
Comment 49•12 years ago
|
||
Comment on attachment 652255 [details] [diff] [review]
Patch 14
Review of attachment 652255 [details] [diff] [review]:
-----------------------------------------------------------------
::: browser/themes/pinstripe/browser.css
@@ +1466,4 @@
> }
>
> #editBMPanel_folderMenuList > .menulist-dropmarker > .dropmarker-icon {
> + list-style-image: url("chrome://browser/skin/panel-dropmarker.png");
I think you meant to put chrome://global/skin/icons/panel-dropmarker.png
What is the reason for not using one of the following?
https://mxr.mozilla.org/mozilla-central/find?string=dropmarker.png
In particular, note the toolbarbutton-dropmarker.png files.
Though, there does seem to be precedent for having duplicate files, e.g. the two existing toolbarbutton-dropmarker.png files are identical.
::: toolkit/themes/pinstripe/global/notification.css
@@ +143,4 @@
> margin-top: 0;
> margin-bottom: 0;
> -moz-margin-start: -1px;
> + list-style-image: url("chrome://global/skin/icons/panel-dropmarker.png");
Likewise here.
Attachment #652255 -
Flags: review?(fryn) → review-
Assignee | ||
Comment 50•12 years ago
|
||
Fixed that image reference issue.
Yeah, we could potentially use toolbarbutton-dropmarker-lion.png, which looks very similar, but it's not in the right directory (toolkit) and the filename makes it kind of semantically odd to use here. So I'd personally go with a new image, but I can see reason to try to reuse one.
Attachment #652255 -
Attachment is obsolete: true
Attachment #652971 -
Flags: review?(fryn)
Assignee | ||
Updated•12 years ago
|
Attachment #652971 -
Attachment is patch: true
Updated•12 years ago
|
Attachment #652971 -
Flags: review?(fryn) → review+
Assignee | ||
Comment 51•12 years ago
|
||
Discovered and fixed a little bug with the link color in popups.
Attachment #652971 -
Attachment is obsolete: true
Attachment #653538 -
Flags: review?(fryn)
Assignee | ||
Comment 52•12 years ago
|
||
Updated the HTTPS lock icon and the sync promo icon. They're now gray instead of white, which is much more visible on the light background.
As far as I know, the patch should be ready for checkin if this review passes.
Attachment #653538 -
Attachment is obsolete: true
Attachment #653538 -
Flags: review?(fryn)
Attachment #653617 -
Flags: review?(fryn)
Assignee | ||
Updated•12 years ago
|
Attachment #653617 -
Attachment is patch: true
Updated•12 years ago
|
Attachment #653617 -
Flags: review?(fryn) → review+
Assignee | ||
Updated•12 years ago
|
Keywords: checkin-needed
Assignee | ||
Comment 53•12 years ago
|
||
Err, sorry for the patch barrage. >_< I just realized that the way that I fixed the expander icon padding was pretty dumb, so I fixed it (with what I think is) the right way. Also unprefixed all the -moz-linear-gradients I touched while I was at it. Everything else should be the same.
Attachment #653617 -
Attachment is obsolete: true
Attachment #654405 -
Flags: review?(fryn)
Comment 54•12 years ago
|
||
https://hg.mozilla.org/integration/mozilla-inbound/rev/fc19d9b5a531
I just checked in patch 17. Can you post a follow-up patch on top of it please?
Updated•12 years ago
|
Attachment #653617 -
Attachment description: Patch 17 → Patch 17 (checked in)
Attachment #653617 -
Attachment is obsolete: false
Updated•12 years ago
|
Attachment #654405 -
Attachment is obsolete: true
Attachment #654405 -
Flags: review?(fryn)
Assignee | ||
Comment 55•12 years ago
|
||
Attachment #654442 -
Flags: checkin?(ryanvm)
Updated•12 years ago
|
Attachment #654442 -
Flags: review?(fryn)
Updated•12 years ago
|
Attachment #653617 -
Attachment description: Patch 17 (checked in) → Patch 17
Attachment #653617 -
Flags: checkin+
Updated•12 years ago
|
Attachment #654442 -
Flags: review?(fryn) → review+
Updated•12 years ago
|
Whiteboard: [leave open]
Comment 56•12 years ago
|
||
Comment on attachment 654442 [details] [diff] [review]
Followup patch
https://hg.mozilla.org/integration/mozilla-inbound/rev/529608d3f3ff
Attachment #654442 -
Flags: checkin?(ryanvm) → checkin+
Assignee | ||
Comment 57•12 years ago
|
||
Cool. Thanks, Ryan, Frank, and Dao!
Comment 58•12 years ago
|
||
Comment on attachment 654442 [details] [diff] [review]
Followup patch
>+#editBookmarkPanel .expander-up .button-icon,
>+#editBookmarkPanel .expander-down .button-icon {
>+ margin: 1px 0 0;
>+}
>+
>+#editBookmarkPanel .expander-up .button-text,
>+#editBookmarkPanel .expander-down .button-text {
>+ display: none;
>+}
Use the child selector to get to button-icon and button-text. Chained descendant selectors with the leaf node being a very common class is an exceedingly bad idea.
https://developer.mozilla.org/en-US/docs/CSS/Writing_Efficient_CSS?redirectlocale=en-US&redirectslug=Writing_Efficient_CSS#Avoid_the_descendant_selector.21
Attachment #654442 -
Flags: review-
Updated•12 years ago
|
Whiteboard: [leave open]
Comment 59•12 years ago
|
||
Assignee | ||
Comment 60•12 years ago
|
||
Attachment #654714 -
Flags: review?(dao)
Assignee | ||
Updated•12 years ago
|
Attachment #654714 -
Attachment is patch: true
Updated•12 years ago
|
Attachment #654714 -
Flags: review?(dao) → review+
Comment 61•12 years ago
|
||
Status: ASSIGNED → RESOLVED
Closed: 12 years ago
Resolution: --- → FIXED
Whiteboard: [leave open]
Target Milestone: --- → mozilla17
You need to log in
before you can comment on or make changes to this bug.
Description
•