UI changes to sync dialogs to improve formatting and font sizes.

All resource files _ Made text unselectable on all 3 screens _ Change the default font size to 11pt and 1.8em line height spacing gaia_login _ Introduction paragraph is now using 11pt font and new spaced line height _ Moved the cancel button into the GAIA login box. _ Error message > Made permanent space for the error msg between intro paragraph and GAIA login > Error message now as the same orange background as on choosedatatypes > Error shows on Captcha view if there's an error setup_done _ Got rid of the tables _ Header is now the right size _ Synced to user@gmail.com is now bold BUG=49704 Original patch by dudley@chromium.org Original review: http://codereview.chromium.org/3085003 Review URL: http://codereview.chromium.org/2856081 git-svn-id: svn://svn.chromium.org/chrome/trunk/src@54653 0039d316-1c4b-4281-b951-d872f2087c98
author: tim@chromium.org <tim@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> 2010-08-03 00:59:03 +0000
committer: tim@chromium.org <tim@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98> 2010-08-03 00:59:03 +0000
commit: 6772701a7aeffa8eed010806db52eed63fd0f023 (patch)
tree: f52dceec3748cd757135d5b46797a2b1599d54b5
parent: 95160ee8648ea14b990cf43ad6637e79987e8692 (diff)
download: chromium_src-6772701a7aeffa8eed010806db52eed63fd0f023.zip
chromium_src-6772701a7aeffa8eed010806db52eed63fd0f023.tar.gz
chromium_src-6772701a7aeffa8eed010806db52eed63fd0f023.tar.bz2
4 files changed, 87 insertions, 75 deletions
diff --git a/chrome/app/generated_resources.grd b/chrome/app/generated_resources.grd
index 08b47b0..de1feaa 100644
--- a/chrome/app/generated_resources.grd
+++ b/chrome/app/generated_resources.grd
@@ -7016,7 +7016,7 @@ Keep your key file in a safe place. You will need it to create new versions of y
         Configure sync
       </message>
       <message name="IDS_SYNC_CHOOSE_DATATYPES_INSTRUCTIONS" desc="Text explaining the 'Choose Datatypes' dialog.">
-        <ph name="PRODUCT_NAME">$1<ex>Google Chrome</ex></ph> syncs your data with your Google account securely. If need be, you can choose what data to sync.
+        <ph name="PRODUCT_NAME">$1<ex>Google Chrome</ex></ph> syncs your data with your Google account securely. Keep everything synced or choose what data to sync from this computer.
       </message>
       <message name="IDS_SYNC_EVERYTHING" desc="A radio button for users who want to sync all data types.">
         Keep everything synced
diff --git a/chrome/browser/sync/resources/choose_datatypes.html b/chrome/browser/sync/resources/choose_datatypes.html
index b325c55..166334f 100644
--- a/chrome/browser/sync/resources/choose_datatypes.html
+++ b/chrome/browser/sync/resources/choose_datatypes.html
@@ -3,27 +3,26 @@
 <title></title>
 <style type="text/css">
 body {
-   line-height: 1.8em;
+   line-height: 1.5em;
    background: #FFFFFF;
    margin: 10px 15px;
+   font-size: 11pt;
 }
 html[os='mac'] body {
-  line-height: 1.8em;
+  line-height: 1.5em;
   margin: 15px 20px;
   background: #FFFFFF;
 }
-html[os='mac'] form {
-  font-size: 110%;
-}
-html[os='linux'] form {
-  font-size: 120%;
+form {
+  -webkit-user-select: none;
 }
 .sync-header {
   font-size: 1.2em;
   font-weight: bold;
+  margin-bottom: 10px;
 }
 .sync-select-customization {
-  margin-top: 5px;
+  margin-top: 10px;
 }
 #chooseDataTypesRadio {
   vertical-align: top;
@@ -264,7 +263,7 @@ html[os='mac'] input[type='submit'] {
 
 </script>
 </head>
-<body i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize"
+<body i18n-values=".style.fontFamily:fontfamily"
       onload="initializeChooseDataTypesDialog();">
 <form id="chooseDataTypesForm" 
       onSubmit="sendChooseDataTypesAndClose(); return false;">
diff --git a/chrome/browser/sync/resources/gaia_login.html b/chrome/browser/sync/resources/gaia_login.html
index f9de48a..d4832d8 100644
--- a/chrome/browser/sync/resources/gaia_login.html
+++ b/chrome/browser/sync/resources/gaia_login.html
@@ -2,7 +2,10 @@
 <head>
 <style type="text/css">
   body,td,div,p,a,font,span {font-family: arial,sans-serif;}
-  body { background-color:#ffffff }
+  body {
+    background-color:#ffffff;
+    -webkit-user-select: none;
+  }
   A:link {color:#0000cc; }
   A:visited { color:#551a8b; }
   A:active { color:#ff0000; }
@@ -76,16 +79,30 @@
     height: 5px;
   }
   #top_blurb {
-    text-align: justify;
-  }
-  input[type='button'] {
-    min-width: 87px;
-    min-height: 26px;
+    font-size: 11pt;
+    line-height: 1.5em;
   }
+  input[type='button'],
   input[type='submit'] {
     min-width: 87px;
     min-height: 26px;
   }
+  #top_blurb_error {
+    display: block;
+    margin-bottom: 10px;
+    margin-right: auto;
+    margin-left: auto;
+    width: 70%;
+    text-align: center;
+    padding: 4px 10px;
+    background-color: #eeb939;
+    -webkit-border-radius: 4px;
+    font-weight: bold;
+    font-size: 11pt;
+  }
+  #content_table {
+   padding: 2px;
+  }
 </style>
 </head>
 <body bgcolor="#ffffff" vlink="#666666"
@@ -170,9 +187,7 @@
 
       // The captcha takes up lots of space, so make room.
       setElementDisplay("top_blurb", "none");
-      setElementDisplay("top_blurb_error", "none");
       setElementDisplay("createaccountdiv", "none");
-      setElementDisplay("topspacer", "none");
       var gaiaTable = document.getElementById('gaia_table');
       gaiaTable.cellPadding = 0;
       gaiaTable.cellSpacing = 1;
@@ -251,8 +266,7 @@
     function setBlurbError() {
       if (g_is_captcha_challenge_active)
         return;  // No blurb in captcha challenge mode.
-      document.getElementById("top_blurb").style.display = "none";
-      document.getElementById("top_blurb_error").style.display = "block";
+      document.getElementById("top_blurb_error").style.visibility = "visible";
       document.getElementById('Email').disabled = false;
       document.getElementById('Passwd').disabled = false;
     }
@@ -296,13 +310,10 @@
                             font-style: italic; }
   </style>
   <div id="top_blurb">
-    <p><font size="-1"><span i18n-content="introduction"></span></font></p>
+    <span i18n-content="introduction"></span>
   </div>
-  <div id="top_blurb_error" style="display:none">
-    <p><font size="-1">
-      <span i18n-content="settingupsync"></span><br/><br/>
-      <b><span i18n-content="errorsigningin"></span></b>
-    </font></p>
+  <div id="top_blurb_error" style="visibility:hidden">
+      <span i18n-content="errorsigningin"></span>
   </div>
 <form id="gaia_loginform" onsubmit="sendCredentialsAndClose(); return false;">
 <div id="gaia_loginbox">
@@ -315,9 +326,6 @@
         <table id="gaia_table" align="center" border="0" cellpadding="1"
                cellspacing="0">
           <tr>
-            <td id="topspacer" class="toppageverticalspace" colspan="2"></td>
-          </tr>
-          <tr>
             <td colspan="2" align="center">
               <table>
                 <tr>
@@ -453,6 +461,9 @@
                   <td class="noverticalpadding">
                     <input id="signIn" type="submit" class="gaia le button"
                            name="signIn" i18n-values="value:signin"/>
+                    <input type="button" name="cancel" i18n-values="value:cancel"
+                           onclick="CloseDialog();" >
+
                   </td>
                 </tr>
               </table>
@@ -489,12 +500,6 @@
   <td class="cancelspacenocaptcha" id="cancelspacer" colspan="2">
   </td>
 </tr>
-<tr>
-  <td class="endaligned noverticalpadding" colspan="2" style="vertical-align: bottom">
-  <input type="button" name="cancel" i18n-values="value:cancel"
-         onclick="CloseDialog();" style="width:85">
-  </td>
-</tr>
 </table>
 </body>
 </html>
diff --git a/chrome/browser/sync/resources/setup_done.html b/chrome/browser/sync/resources/setup_done.html
index 4e5cf34..42ea800 100644
--- a/chrome/browser/sync/resources/setup_done.html
+++ b/chrome/browser/sync/resources/setup_done.html
@@ -2,61 +2,69 @@
 <head>
 <title></title>
 <style type="text/css">
-body,td,div,p,a,font,span {
-   font-family: arial,sans-serif;
- }
 body {
-   bgcolor:"#ffffff"
- } 
-.gaia.le.button {
-  font-family: Arial, Helvetica, sans-serif;
-  font-size: smaller;
+  background: #FFFFFF;
+  font-size: 11pt;
+  line-height: 1.5em;
+  margin: 10px 15px;
+  -webkit-user-select: none;
 }
-.endaligned {
-  text-align: right;
-  align: right;
+.sync-header {
+  font-size: 1.2em;
+  font-weight: bold;
 }
-html[dir='rtl'] .endaligned {
+.sync-success-image {
+  text-align: center;
+  margin: 20px;
+}
+#user {
+  font-weight: bold;
+}
+.sync-footer {
+  position: fixed;
+  right: 0px;
+  bottom: 0px;
+  margin-right: 10px;
+  margin-bottom: 10px;
+}
+html[dir='rtl'] .sync-footer {
   text-align: left;
-  align: left;
+  left: 0px;
+  bottom: 0px;
+  margin-left: 20px;
+}
+input[type='submit'] {
+  min-width: 87px;
+  min-height: 26px;
+}
+html[os='mac'] input[type='submit'] {
+  font-size: 12pt;
 }
+
 </style>
 <script>
   function setShowFirstTimeSetupSummary() {
     document.getElementById("summary").innerHTML =
-        "<p><font size='-1'>" + templateData['firsttimesetupsummary']
-        + "</font></p>";
+      templateData['firsttimesetupsummary'];
   }
   function setSyncedToUser(synced_to) {
     document.getElementById('user').innerHTML = synced_to;
   }
-  function onPageShown() {     
+  function onPageShown() {
     document.getElementById("close").focus();
   }
 </script>
-<body  bgcolor="#ffffff" vlink="#666666
-       i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize"
-       style="margin: 10px">
-<table height="100%" width="100%" margin="0" cellpadding="0">
-  <tr valign="top">
-  <td>
-    <p><font size="-1"><b><span i18n-content="success"></span></b></font></p>
-    <div align="center">
-      <img src="success-large.png" />
-    </div>
-    <br />
-    <p><font size="-1"><span id="user"></span></font></p>
-    <div id="summary">
-      <p><font size="-1"><span i18n-content="setupsummary"></span></font></p>
-    </div>
-  </td>
-  </tr>
-  <tr valign="bottom">
-    <td class="endaligned">
-      <input id="close" type="submit" i18n-values="value:okay" style="width:85"
-             onclick='chrome.send("DialogClose", [""])' />
-    </td>
-  </tr>
-</table>
+</head>
+<body i18n-values=".style.fontFamily:fontfamily">
+  <div class="sync-header" i18n-content="success"></div>
+  <div class="sync-success-image">
+    <img src="success-large.png" />
+  </div>
+  <div id="user"></div>
+  <div id="summary" i18n-content="setupsummary"></div>
+  <div class="sync-footer">
+    <input id="close" type="submit" i18n-values="value:okay"
+           onclick='chrome.send("DialogClose", [""])' />
+  </div>
 </body>
 </html>
author	tim@chromium.org <tim@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98>	2010-08-03 00:59:03 +0000
committer	tim@chromium.org <tim@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98>	2010-08-03 00:59:03 +0000
commit	6772701a7aeffa8eed010806db52eed63fd0f023 (patch)
tree	f52dceec3748cd757135d5b46797a2b1599d54b5
parent	95160ee8648ea14b990cf43ad6637e79987e8692 (diff)
download	chromium_src-6772701a7aeffa8eed010806db52eed63fd0f023.zip chromium_src-6772701a7aeffa8eed010806db52eed63fd0f023.tar.gz chromium_src-6772701a7aeffa8eed010806db52eed63fd0f023.tar.bz2