Make settings page more touch friendly (font-size, checkbox, radio, adding language page).

chrome/browser/resources/options/options_page.css

Index: chrome/browser/resources/options/options_page.css
diff --git a/chrome/browser/resources/options/options_page.css b/chrome/browser/resources/options/options_page.css
index d6dc054df8e359977e906c771b318a18d48612d0..dbde4fd59f8c4b3b9d688874e119213ee06190dd 100644
--- a/chrome/browser/resources/options/options_page.css
+++ b/chrome/browser/resources/options/options_page.css
@@ -9,7 +9,7 @@
 }
 
 .stretch {
-  -webkit-box-flex: 1;  
+  -webkit-box-flex: 1;
 }
 
 .frozen,
@@ -22,6 +22,38 @@
   margin: 0;
 }
 
+<if expr="pp_ifdef('touchui')">
+/* Fix the width issue of search box after increase font size. */

[Rick Byers, 2011/10/31 15:18:18]

Update this comment

[bshe, 2011/10/31 21:41:18]

Done.

+#search-field {
+  font-size: 13px;
+  -webkit-transform: scaleY(1.2);
+}
+
+/*
+ * In TOUCH_UI builds, make the radio/checkbox input boxes in
+ * options/preference pages easier to touch.
+ */
+div.radio > label > span,
+div.checkbox > label > span {
+  padding-left: 5px;

[Rick Byers, 2011/10/31 15:18:18]

use -webkit-padding-start so this still works for RTL layout

[bshe, 2011/10/31 21:41:18]

Done.

+}
+
+div.radio > label > input,
+div.checkbox > label > input {
+  -webkit-transform: scale(1.4);
+}
+
+/*
+ * Overwrite the font-size rule in shared_options.css file.
+ * 16 px font-size proved to be more touch friendly. It increases the touchable
+ * area for buttons and input boxes.
+ */
+body {
+  font-size: 16px;
+}
+</if>
+
+
 .overlay {
   -webkit-box-align: center;
   -webkit-box-orient: vertical;