Bug 737692 - Touch-friendly styles for menulists and textboxes in add-on options [r=mfinkle]
authorMatt Brubeck <mbrubeck@mozilla.com>
Thu, 22 Mar 2012 13:01:34 -0700
changeset 93379 d34c8cafbdb1beeda225a9078453dacec70e8a3a
parent 93378 abd4103173a201dd8f24176d8c6f851f32c2067e
child 93380 7e6aa4bedc46cf4d338bb1d0ab69c6ad65e9bd7f
push idunknown
push userunknown
push dateunknown
reviewersmfinkle
bugs737692
milestone14.0a1
Bug 737692 - Touch-friendly styles for menulists and textboxes in add-on options [r=mfinkle]
mobile/android/themes/core/aboutAddons.css
--- a/mobile/android/themes/core/aboutAddons.css
+++ b/mobile/android/themes/core/aboutAddons.css
@@ -200,46 +200,50 @@ setting {
 setting > vbox {
   -moz-box-flex: 1;
 }
 
 .preferences-title {
   font-weight: bold;
 }
 
+.preferences-description {
+  margin-top: 4px;
+}
+
 .preferences-description:empty {
   display: none;
 }
 
 /* Put setting textboxes on a separate row */
 setting[type="integer"],
 setting[type="string"] {
   -moz-box-align: stretch;
   -moz-box-orient: vertical;
 }
 
 .preferences-alignment > textbox {
-  margin-top: 12px;
+  margin: 12px 0 0 0;
   font-size: 22px !important;
 }
 
 checkbox {
   -moz-binding: url("chrome://global/content/bindings/checkbox.xml#checkbox-with-spacing") !important;
 }
 
+checkbox[label=""] > .checkbox-label-box,
+checkbox:not([label]) > .checkbox-label-box {
+  display: none;
+}
+
 .checkbox-check {
-  border: 2px transparent;
-  -moz-border-top-colors: -moz-initial;
-  -moz-border-right-colors: -moz-initial;
-  -moz-border-bottom-colors: -moz-initial;
-  -moz-border-left-colors: -moz-initial;
-  -moz-box-sizing: border-box;
+  background: url("chrome://browser/skin/images/checkbox_unchecked.png") no-repeat 50% 50%;
+  border: 0 transparent;
   width: 48px;
   height: 48px;
-  background: url("chrome://browser/skin/images/checkbox_unchecked.png") no-repeat 50% 50%;
 }
 
 setting:active checkbox > .checkbox-spacer-box > .checkbox-check {
   background-image: url("chrome://browser/skin/images/checkbox_unchecked_pressed.png");
 }
 
 checkbox[disabled="true"] > .checkbox-spacer-box > .checkbox-check {
   background-image: url("chrome://browser/skin/images/checkbox_unchecked_disabled.png");
@@ -252,16 +256,72 @@ checkbox[checked="true"] > .checkbox-spa
 setting:active checkbox[checked="true"] > .checkbox-spacer-box > .checkbox-check {
   background-image: url("chrome://browser/skin/images/checkbox_checked_pressed.png");
 }
 
 checkbox[checked="true"][disabled="true"] > .checkbox-spacer-box > .checkbox-check {
   background-image: url("chrome://browser/skin/images/checkbox_checked_disabled.png");
 }
 
+/* Textbox */
+
+textbox[type="number"] > spinbuttons {
+  visibility: collapse;
+}
+
+textbox {
+  background: white -moz-linear-gradient(top, rgba(27,113,177,0.5) 0, rgba(198,225,246,0.2) 3px, rgba(255,255,255,0.2) 16px);
+  border-radius: 3px;
+  border-color: rgb(94,128,153);
+  padding: 0 !important;
+}
+
+.textbox-input-box {
+  padding: 8px 12px;
+}
+
+/* Menulist */
+
+menulist {
+  -moz-appearance: none !important;
+  -moz-user-focus: ignore;
+  /* min-width: 200px !important; */
+  color: #000 !important;
+  border-radius: 5px;
+  border-color: rgb(94,128,153);
+  border-style: solid;
+  padding: 8px 12px;
+  background: white;
+  border: 1px solid #cacdd5;
+  border-style: solid;
+  border-color: rgb(94,128,153);
+  min-width: 200px;
+}
+
+.menulist-label {
+  background-color: transparent !important;
+}
+
+menulist > menupopup > menuitem > label{
+-moz-padding-start:3px !important;
+-moz-padding-end:7px !important;
+}
+
+menulist > dropmarker {
+  height: 32px;
+  width: 32px;
+  margin-left: @margin_snormal@;
+  background-color: transparent; /* for windows */
+  border: none;                  /* for windows */
+  -moz-box-align: center;
+  -moz-box-pack: center;
+  list-style-image: url("chrome://browser/skin/images/dropmarker.svg") !important;
+  -moz-image-region: auto;
+  display: block;
+}
 
 /* XBL bindings */
 
 settings {
   -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#settings");
 }
 
 setting {