Bug 801261 - Adopt editContactOverlay to new light coloring. r+ui-r=bwinton
authorRichard Marti <richard.marti@gmail.com>
Sat, 13 Oct 2012 10:30:57 +0200
changeset 11352 8a8cca521c71
parent 11351 5fe67c22b3e5
child 11353 794b0ed410fa
push id8491
push userryanvm@gmail.com
push dateMon, 22 Oct 2012 23:52:31 +0000
treeherdercomm-central@5ba5d4c61642 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
bugs801261
Bug 801261 - Adopt editContactOverlay to new light coloring. r+ui-r=bwinton
mail/themes/gnomestripe/mail/editContactOverlay.css
mail/themes/pinstripe/jar.mn
mail/themes/pinstripe/mail/editContactOverlay.css
mail/themes/pinstripe/mail/hud-style-button-middle-background.png
mail/themes/pinstripe/mail/hud-style-dropmarker-double-arrows.png
mail/themes/qute/mail/editContactOverlay.css
--- a/mail/themes/gnomestripe/mail/editContactOverlay.css
+++ b/mail/themes/gnomestripe/mail/editContactOverlay.css
@@ -14,16 +14,17 @@
   color: MenuText;
   padding: 4px;
 }
 
 #editContactPanelIcon {
   list-style-image: url("chrome://messenger/skin/starred48.png");
   width: 48px;
   height: 48px;
+  min-height: 48px;
 }
 
 #editContactPanelTitle {
   font-size: 130%;
   font-weight: bold;
   margin-top: 8px;
   margin-bottom: 0px;
   -moz-margin-start: 9px;
--- a/mail/themes/pinstripe/jar.mn
+++ b/mail/themes/pinstripe/jar.mn
@@ -60,18 +60,16 @@ classic.jar:
   skin/classic/messenger/activity/sendMailIcon.png               (mail/activity/sendMailIcon.png)
   skin/classic/messenger/activity/removeItemIcon.png             (mail/activity/removeItemIcon.png)
   skin/classic/messenger/activity/addItemIcon.png                (mail/activity/addItemIcon.png)
   skin/classic/messenger/activity/moveMailIcon.png               (mail/activity/moveMailIcon.png)
   skin/classic/messenger/activity/copyMailIcon.png               (mail/activity/copyMailIcon.png)
   skin/classic/messenger/activity/deleteMailIcon.png             (mail/activity/deleteMailIcon.png)
   skin/classic/messenger/activity/compactMailIcon.png            (mail/activity/compactMailIcon.png)
   skin/classic/messenger/activity/indexMailIcon.png              (mail/activity/indexMailIcon.png)
-  skin/classic/messenger/hud-style-button-middle-background.png  (mail/hud-style-button-middle-background.png)
-  skin/classic/messenger/hud-style-dropmarker-double-arrows.png  (mail/hud-style-dropmarker-double-arrows.png)
   skin/classic/messenger/addressbook/addressbook.css             (mail/addrbook/addressbook.css)
   skin/classic/messenger/addressbook/abContactsPanel.css         (mail/addrbook/abContactsPanel.css)
   skin/classic/messenger/addressbook/cardDialog.css              (mail/addrbook/cardDialog.css)
   skin/classic/messenger/addressbook/abResultsPane.css           (mail/addrbook/abResultsPane.css)
   skin/classic/messenger/addressbook/icons/abcard.png            (mail/addrbook/abcard.png)
   skin/classic/messenger/addressbook/icons/ablist.png            (mail/addrbook/ablist.png)
   skin/classic/messenger/addressbook/icons/contact-generic.png             (mail/addrbook/contact-generic.png)
   skin/classic/messenger/addressbook/icons/contact-generic-tiny.png        (mail/addrbook/contact-generic-tiny.png)
--- a/mail/themes/pinstripe/mail/editContactOverlay.css
+++ b/mail/themes/pinstripe/mail/editContactOverlay.css
@@ -6,33 +6,37 @@
 @namespace html url("http://www.w3.org/1999/xhtml");
 
 .editContactPanel_rowLabel {
   text-align: end;
 }
 
 #editContactPanel {
   -moz-appearance: none;
-  background-color: rgba(68,68,68,0.9);
+  background-color: #EDEDED;
   border: 1px solid rgba(255,255,255,0.15);
-  border-radius: 8px;
-  border-top-left-radius: 0px ;
+  border-radius: 5px;
+  border-top-left-radius: 0px;
   padding: 10px 8px 6px;
   margin-top: 4px;
-  color: #ffffff;
+  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: #333;
 }
 
 #editContactPanel > #editContactContent {
   margin-top: 6px;
 }
 
 #editContactPanelIcon {
   list-style-image: url("chrome://messenger/skin/starred48.png");
   width: 48px;
   height: 48px;
+  min-height: 48px;
 }
 
 #editContactPanelTitle {
   font-size: 130%;
   font-weight: bold;
   margin-top: 8px;
   margin-bottom: 2px;
   -moz-margin-start: 9px;
@@ -44,101 +48,90 @@
 }
 
 /**** HUD style buttons ****/
 
 #editContactPanel > hbox > button,
 #editContactPanel > hbox > vbox > hbox > button,
 #editContactPanel > #editContactPanelBottomButtons > button {
   -moz-appearance: none;
-  background: url("chrome://messenger/skin/hud-style-button-middle-background.png") repeat-x #464646 center center;
-  border-width: 3px;
-  border-style: solid;
-  border-radius: 20px;
-  -moz-border-top-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4);
-  -moz-border-right-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4);
-  -moz-border-bottom-colors: rgba(128,128,128,0.35) rgba(0,0,0,0.5) rgba(255,255,255,0.15);
-  -moz-border-left-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4);
-  padding: 0 9px;
+  color: #434343;
+  border-radius: 4px;
+  border: 1px solid #B5B5B5;
+  background: linear-gradient(#FFFFFF, #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;
   margin: 6px;
   min-width: 79px;
   min-height: 22px;
-  color: #ffffff;
 }
 
 #editContactPanel > hbox > button:hover:active,
 #editContactPanel > hbox > vbox > hbox > button:hover:active,
 #editContactPanel > #editContactPanelBottomButtons > button:hover:active {
-  background-color: #86888B;
+  box-shadow: inset 0 1px 4px -3px #000, 0 1px rgba(255, 255, 255, 0.3);
 }
 
 #editContactPanel > hbox > button:focus,
 #editContactPanel > hbox > vbox > hbox > button:focus,
 #editContactPanel > #editContactPanelBottomButtons > button:focus {
   outline: 2px solid -moz-mac-focusring;
   outline-offset: -2px;
   -moz-outline-radius: 100%;
 }
 
-#editContactPanel > #editContactPanelBottomButtons > button[default="true"] {
-  background-color: #666;
-}
-
 .editContactTextbox {
   -moz-appearance: none !important;
   cursor: text;
-  margin: 2px 4px;
-  border: 2px solid;
-  -moz-border-top-colors: #1c1c1c #545454;
-  -moz-border-right-colors: #1c1c1c #636363;
-  -moz-border-bottom-colors: #1c1c1c #797979;
-  -moz-border-left-colors: #1c1c1c #636363;
-  border-radius: 1px;
-  padding: 0;
-  background-color: #666666;
-  color: #ffffff;
+  margin: 2px 6px;
+  background: linear-gradient(#FAFAFA, #FFFFFF);
+  background-clip: padding-box;
+  border-radius: 3px;
+  border: 1px solid rgba(0, 0, 0, 0.3);
+  box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.05),
+              0 1px rgba(255, 255, 255, 0.3);
+  padding: 3px 6px;
 }
 
 .editContactTextbox[readonly="true"] {
   -moz-appearance: none;
-  margin: 2px 4px;
-  padding: 2px;
-  border: none;
-  background-color: inherit;
-  color: #ffffff;
+  border-color: transparent;
+  background: #EDEDED;
+  box-shadow: none;
 }
 
 .editContactTextbox[focused="true"] {
-  outline: 2px solid -moz-mac-focusring;
-  padding: 1px;
-  outline-offset: -1px;
-  -moz-outline-radius: 1px;
-  background-color: #eeeeee;
-  color: #000000;
+  border-color: -moz-mac-focusring !important;
+  box-shadow: 0 0 1px -moz-mac-focusring inset,
+              0 0 4px 1px -moz-mac-focusring,
+              0 0 1.5px 1px -moz-mac-focusring;
 }
 
 .editContactTextbox[focused="true"][readonly="true"] {
-  outline: none;
-  background-color: inherit;
-  color: #ffffff;
+  border-color: transparent !important;
+  box-shadow: none;
 }
 
 #editContactAddressBookList {
   -moz-appearance: none;
-  background: url("chrome://messenger/skin/hud-style-button-middle-background.png") repeat-x #464646 center center;
-  border: 3px solid;
-  border-radius: 5px;
-  -moz-border-top-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4);
-  -moz-border-right-colors: rgba(53,53,53,1) rgba(53,53,53,1) rgba(162,162,162,1);
-  -moz-border-bottom-colors: rgba(128,128,128,0.35) rgba(0,0,0,0.5) rgba(255,255,255,0.15);
-  -moz-border-left-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4);
-  margin: 0 3px !important;
-  min-height: 22px;
-  -moz-padding-start: 2px;
-  color: #ffffff !important;
+  color: #434343;
+  border-radius: 4px;
+  border: 1px solid #B5B5B5;
+  background: linear-gradient(#FFFFFF, #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;
+  margin: 0 6px;
 }
 
 #editContactAddressBookList:focus {
   outline: 2px solid -moz-mac-focusring;
   outline-offset: -2px;
   -moz-outline-radius: 5px;
 }
 
@@ -148,18 +141,20 @@
 
 #editContactAddressBookList > .menulist-dropmarker {
   -moz-appearance: none;
   display: -moz-box;
   background-color: transparent;
   border: 0;
   margin: 0;
   padding: 0;
+  -moz-padding-end: 4px;
+  width: 7px;
 }
 
 #editContactAddressBookList > .menulist-dropmarker > .dropmarker-icon {
-  list-style-image: url("chrome://messenger/skin/hud-style-dropmarker-double-arrows.png");
+  list-style-image: url("chrome://global/skin/icons/panel-dropmarker.png");
 }
 
 #contactMoveDisabledText {
   margin-left: 8px;
   width: 20em;
 }
deleted file mode 100644
index d3ce59b19fea5ee7356186d2c6bc47d64f38033d..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
GIT binary patch
literal 0
Hc$@<O00001
deleted file mode 100644
index ecf5ee24eb6e706cc726b86b0f1c3a0baeefe2f2..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
GIT binary patch
literal 0
Hc$@<O00001
--- a/mail/themes/qute/mail/editContactOverlay.css
+++ b/mail/themes/qute/mail/editContactOverlay.css
@@ -14,16 +14,17 @@
   color: MenuText;
   padding: 4px;
 }
 
 #editContactPanelIcon {
   list-style-image: url("chrome://messenger/skin/starred48.png");
   width: 48px;
   height: 48px;
+  min-height: 48px;
 }
 
 #editContactPanelTitle {
   font-size: 130%;
   font-weight: bold;
   margin-top: 8px;
   margin-bottom: 0px;
   -moz-margin-start: 9px;