summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorskrul@chromium.org <skrul@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98>2010-04-20 03:32:21 +0000
committerskrul@chromium.org <skrul@chromium.org@0039d316-1c4b-4281-b951-d872f2087c98>2010-04-20 03:32:21 +0000
commit8b19dfab9651b34dffd474c675cb68b03f741733 (patch)
treeee18dfb6a84fa9431a0132937669cf6f14a7df26
parentc829e5ca7781bf6b8c8cf17b602f4ae10743b470 (diff)
downloadchromium_src-8b19dfab9651b34dffd474c675cb68b03f741733.zip
chromium_src-8b19dfab9651b34dffd474c675cb68b03f741733.tar.gz
chromium_src-8b19dfab9651b34dffd474c675cb68b03f741733.tar.bz2
Merge 44962 - Tweak sync setup dialog. The goal here is to make it look more like the old version (see bug for screenshots).
BUG=41708 Changes include: Justify the introduction text Align customize/cancel buttons to the bottom of the window. I uploaded a screen shot of the changed window to the bug. I also created a test page that iframes the html of the login dialog so it makes it easier to work on the layer without having to compile and run chrome to see it. Review URL: http://codereview.chromium.org/1654020 TBR=skrul@chromium.org Review URL: http://codereview.chromium.org/1629030 git-svn-id: svn://svn.chromium.org/chrome/branches/375/src@45004 0039d316-1c4b-4281-b951-d872f2087c98
-rwxr-xr-xchrome/browser/sync/resources/gaia_login.html20
-rw-r--r--chrome/browser/sync/resources/gaia_login_test.html126
2 files changed, 138 insertions, 8 deletions
diff --git a/chrome/browser/sync/resources/gaia_login.html b/chrome/browser/sync/resources/gaia_login.html
index c9f410f..0e15e11 100755
--- a/chrome/browser/sync/resources/gaia_login.html
+++ b/chrome/browser/sync/resources/gaia_login.html
@@ -1,4 +1,5 @@
<html i18n-values="dir:textdirection;">
+ <head>
<style type="text/css"><!--
body,td,div,p,a,font,span {font-family: arial,sans-serif;}
body { background-color:#ffffff }
@@ -7,7 +8,6 @@
A:active { color:#ff0000; }
.form-noindent {background-color: #ffffff; border: #C3D9FF 1px solid}
--></style>
- <head>
<style type="text/css"><!--
.body { margin-left: 3em;
margin-right: 5em;
@@ -70,13 +70,16 @@
.cancelspaceforcaptcha {
height: 5px;
}
+ #top_blurb {
+ text-align: justify;
+ }
-->
</style>
</head>
<body bgcolor="#ffffff" vlink="#666666"
i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize"
- style="margin-bottom: 0; margin-top: 6px;" onload="initForm();">
- <table width="100%" align="center" cellpadding="1" cellspacing="1">
+ style="margin-bottom: 6px; margin-top: 6px;" onload="initForm();">
+ <table width="100%" height="100%" align="center" cellpadding="1" cellspacing="1">
<tr>
<td valign="top"> <!-- LOGIN BOX -->
<script>
@@ -283,7 +286,7 @@
.gaia.le.fpwd { font-family: Arial, Helvetica, sans-serif; font-size: 70%; }
.gaia.le.chusr { font-family: Arial, Helvetica, sans-serif; font-size: 70%; }
.gaia.le.val { font-family: Arial, Helvetica, sans-serif; font-size: smaller; }
-.gaia.le.button { font-family: Arial, Helvetica, sans-serif; font-size: smaller; }
+.gaia.le.button { font-family: Arial, Helvetica, sans-serif; }
.gaia.le.rem { font-family: Arial, Helvetica, sans-serif; font-size: smaller; }
.gaia.captchahtml.desc { font-family: arial, sans-serif; font-size: smaller; }
.gaia.captchahtml.cmt { font-family: arial, sans-serif; font-size: smaller;
@@ -317,7 +320,6 @@
<tr>
<td valign="top" id="gaia_logo">
<img src="google_transparent.png" alt="Google">
- </img>
</td>
<td valign="middle">
<font size="+0">
@@ -487,13 +489,15 @@
<td class="cancelspacenocaptcha" id="cancelspacer" colspan="2">
</td>
</tr>
-</table>
-<div class="endaligned">
+<tr>
+ <td class="endaligned noverticalpadding" colspan="2" style="vertical-align: bottom">
<input id="customize" type="button" name="customize"
i18n-values="value:customize" onclick="showCustomize();"
style="width:150;visibility:hidden" disabled="disabled">
<input type="button" name="cancel" i18n-values="value:cancel"
onclick="CloseDialog();" style="width:85">
-</div>
+ </td>
+</tr>
+</table>
</body>
</html>
diff --git a/chrome/browser/sync/resources/gaia_login_test.html b/chrome/browser/sync/resources/gaia_login_test.html
new file mode 100644
index 0000000..6de84a9
--- /dev/null
+++ b/chrome/browser/sync/resources/gaia_login_test.html
@@ -0,0 +1,126 @@
+<!DOCTYPE html>
+<html>
+<!--
+This page is a simple testing environment for gaia_login.html to help
+iterate on the design without having to compile and launch the
+browser. Note that you must supply the "--allow-file-access-from-files"
+for the chrome you are using to load this page for this to work.
+-->
+<style>
+body {
+ background-color: #d0d0d0;
+}
+
+#iframe {
+ height: 375px;
+ width: 421px;
+ border: 0px;
+ float: left;
+}
+#options {
+ float: left;
+}
+
+</style>
+<script>
+function gel(id) {
+ return document.getElementById(id);
+}
+
+function get_selected_value(el) {
+ for (var i = 0; i < el.length; ++i) {
+ if (el[i].checked)
+ return el[i].value;
+ }
+ return null;
+}
+
+function set_up_testing() {
+ var win = window.frames[0];
+ var doc = win.document;
+ var form = gel("form");
+ form.addEventListener("change", function() { update(); }, true);
+
+ win.JSON = {};
+ win.JSON.parse = function() {
+ return {
+ showCustomize: form.show_customize.checked,
+ error: get_selected_value(form.error),
+ user: "homer@gmail.com",
+ captchaUrl: "https://www.google.com/accounts/Captcha"
+ };
+ };
+
+ console.log(win.JSON.parse());
+
+ set_text("introduction",
+ "Chromium sync makes it easy to share your data (such as " +
+ "bookmarks and preferences) between your computers. Chromium " +
+ "synchronizes your data by storing it online with Google when " +
+ "you login with your Google Account.");
+ set_text("settingupsync", "Setting up sync");
+ set_text("errorsigningin", "Error signing in.");
+ set_text("signinsuffix", "Account");
+ set_text("emaillabel", "Email:");
+ set_text("cannotbeblank", "cannotbeblank");
+ set_text("passwordlabel", "Password:");
+ set_text("invalidcredentials", "Invalid user name or password.");
+ set_text("captchainstructions",
+ "Enter the correct password above and then type the characters " +
+ "you see in the picture below.");
+ set_text("couldnotconnect", "Could not connect to the server");
+ set_text("value:signin", "Sign in");
+ set_text("href:cannotaccessaccounturl", "href:cannotaccessaccounturl");
+ set_text("cannotaccessaccount", "I cannot access my account");
+ set_text("href:createnewaccounturl", "href:createnewaccounturl");
+ set_text("createaccount", "Create a Google account");
+ set_text("value:customize", "Customize sync...");
+ set_text("value:cancel", "Cancel");
+
+ function set_text(id, text) {
+ if (id.indexOf(":") >= 0) {
+ var node = doc.evaluate("//*[@i18n-values='" + id + "']",
+ doc,
+ null,
+ XPathResult.FIRST_ORDERED_NODE_TYPE,
+ null).singleNodeValue;
+ node.setAttribute(id.split(":")[0], text);
+ } else {
+ var node = doc.evaluate("//*[@i18n-content='" + id + "']",
+ doc,
+ null,
+ XPathResult.FIRST_ORDERED_NODE_TYPE,
+ null).singleNodeValue;
+ node.innerHTML = text;
+ }
+ }
+
+ win.initForm();
+}
+
+function update() {
+ window.frames[0].document.location.reload();
+}
+
+</script>
+<body>
+<div>
+<iframe
+ id="iframe"
+ src="gaia_login.html"
+ onload="set_up_testing()">
+</iframe>
+<div id="options">
+<form id="form" name="form">
+<p><input name="show_customize" type="checkbox" checked> Show customize</p>
+<p>
+ <input type="radio" name="error" value="" checked> No Error
+ <input type="radio" name="error" value="1"> Bad Password
+ <input type="radio" name="error" value="3"> Lost Connection
+ <input type="radio" name="error" value="4"> Captcha
+</p>
+</form>
+</div>
+</div>
+</body>
+</html>