Re-design the phishing interstitial page. The change is mostly about: make the 'go back' button big and green in a central place, and put the 'proceed' into a link at the bottom of the page.

sample screenshot: https://docs1.google.com/document/d/1peJV0yfVSgjbdydInshy8FSU2Q9kUivTtdyMpIDIP1w/edit?authkey=CLCQl9sE#

Patch from Ke Wang <kewang@google.com> 

BUG=60813
TEST=unit_tests. To see the UI change, start the browser and try load some sites in malware blacklist.

Review URL: http://codereview.chromium.org/5560003

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@68548 0039d316-1c4b-4281-b951-d872f2087c98

3 files changed, 57 insertions, 18 deletions

diff --git a/chrome/app/generated_resources.grd b/chrome/app/generated_resources.grd
index 79cd054..3fd17aa 100644
--- a/chrome/app/generated_resources.grd
+++ b/chrome/app/generated_resources.grd
@@ -7653,10 +7653,10 @@ Keep your key file in a safe place. You will need it to create new versions of y
       <message name="IDS_SAFE_BROWSING_MALWARE_DESCRIPTION2" desc="SafeBrowsing Malware HTML description, second line">
         Google has found malicious software may be installed onto your computer if you proceed. If you've visited this site in the past or you trust this site, it's possible that it has just recently been compromised by a hacker. You should not proceed, and perhaps try again tomorrow or go somewhere else.
       </message>
-      <message name="IDS_SAFE_BROWSING_MALWARE_DESCRIPTION3" desc="SafeBrowsing Malware HTML description, third line">
+      <message name="IDS_SAFE_BROWSING_MALWARE_DESCRIPTION3" desc="SafeBrowsing Malware HTML description, last line">
         If you understand that visiting this site may harm your computer, <ph name="PROCEED_LINK">$1<ex>proceed anyway</ex></ph>.
       </message>
-      <message name="IDS_SAFE_BROWSING_MALWARE_PROCEED_LINK" desc="SafeBrowsing Malware HTML description, third line proceed link part.">
+      <message name="IDS_SAFE_BROWSING_MALWARE_PROCEED_LINK" desc="SafeBrowsing Malware HTML description, last line proceed link part.">
         proceed anyway
       </message>
       <message name="IDS_SAFE_BROWSING_MALWARE_DESCRIPTION4" desc="SafeBrowsing Malware HTML description, first line for case of subresource malicious">
@@ -7694,11 +7694,14 @@ Keep your key file in a safe place. You will need it to create new versions of y
       <message name="IDS_SAFE_BROWSING_PHISHING_DESCRIPTION2" desc="SafeBrowsing Phishing HTML description, second line, link to more information.">
         Learn more about phishing scams.
       </message>
-      <message name="IDS_SAFE_BROWSING_PHISHING_PROCEED_BUTTON" desc="SafeBrowsing Phishing, proceed button">
-        Proceed anyway
+      <message name="IDS_SAFE_BROWSING_PHISHING_DESCRIPTION3" desc="SafeBrowsing Phishing HTML description, last line">
+        If you feel you understand the risks, you may <ph name="PROCEED_LINK">$1<ex>proceed anyway</ex></ph>.
+      </message>
+      <message name="IDS_SAFE_BROWSING_PHISHING_PROCEED_LINK" desc="SafeBrowsing Phishing HTML description, last line proceed link part.">
+        proceed anyway
       </message>
       <message name="IDS_SAFE_BROWSING_PHISHING_BACK_BUTTON" desc="SafeBrowsing Phishing, back button">
-        Back to safety
+        Go back
       </message>
       <message name="IDS_SAFE_BROWSING_PHISHING_REPORT_ERROR" desc="SafeBrowsing Phishing, report error link">
         Report an error
diff --git a/chrome/browser/resources/safe_browsing_phishing_block.html b/chrome/browser/resources/safe_browsing_phishing_block.html
index 5a68b52..5be0290 100644
--- a/chrome/browser/resources/safe_browsing_phishing_block.html
+++ b/chrome/browser/resources/safe_browsing_phishing_block.html
@@ -65,9 +65,43 @@ html[dir='rtl'] .helpbutton {
   border-top:1px solid #ccc;
   padding-top:6px;
 }
-.moreinfotitle {
-  margin-left:5px;
-  margin-right:5px;
+
+.green {
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#83c260), color-stop(44%,#71b44c), color-stop(100%,#549d2c));
+  border: 1px solid #4c7336;
+  border-bottom: 1px solid #44692f;
+  -webkit-border-radius: 3px;
+  -webkit-box-shadow: inset 0 1px 0 0 #a0d186, 0px 1px 2px rgba(0,0,0,0.2);
+  color: #fff;
+  font-family: arial, helvetica, sans-serif;
+  font-size: 14px;
+  font-weight: bold;
+  line-height: 1;
+  padding: 6px 16px 7px 16px;
+  text-align: center;
+  text-shadow: 0 -1px 0 #4865e4;
+  cursor:pointer;
+  text-decoration:none;
+  display:inline-block;
+}
+
+.green:hover, .green:focus {
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8bc968), color-stop(44%,#7bbc57), color-stop(100%,#4f9727)); /* webkit */
+  border: 1px solid #456a2f;
+  border-bottom: 1px solid #456a2f;
+  -webkit-box-shadow: inset 0 1px 0 0 #a0d186, 0px 1px 2px rgba(0,0,0,0.3);;
+}
+
+.green:active {
+  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#83c260), color-stop(44%,#71b44c), color-stop(100%,#549d2c)); /* webkit */
+  border: 1px solid #3e612a;
+  border-top:1px solid #4c7336;
+  border-bottom:1px solid #547b3f;
+  -webkit-box-shadow: inset 1px 1px 1px 1px rgba(0, 0, 0, 0.1);
+}
+
+.green:focus {
+  border: 1px solid #000;
 }
 </style>
 
@@ -76,11 +110,8 @@ html[dir='rtl'] .helpbutton {
     window.domAutomationController.setAutomationId(1);
     window.domAutomationController.send(cmd);
   }
-
-  function agreed(form) {
-    form.continue_button.disabled = !form.continue_button.disabled;
-  }
 </script>
+
 </head>
 <body oncontextmenu="return false;">
 <div class="background"><img src="../security/resources/ssl_roadblock_background.png" width="100%" height="100%" alt="background" onmousedown="return false;"></div>
@@ -90,14 +121,14 @@ html[dir='rtl'] .helpbutton {
       <div class="icon"><img src="shared/images/phishing_icon.png" alt="Phishing Warning Icon" onmousedown="return false;"></div>
       <div class="title" i18n-content="headLine"></div>
       <div class="main" i18n-values=".innerHTML:description1"></div>
-      <div class="main"><a href="" i18n-content="description2" onclick="sendCommand('learnMore'); return false;" onmousedown="return false;"></a></div>
       <div class="main">
         <form class="submission">
-          <input type="button" name="continue_button" i18n-values="value:continue_button" onclick="sendCommand('proceed')">
-          <input type="button" name="back_button" i18n-values="value:back_button" onclick="sendCommand('takeMeBack')">
+          <input type="button" class="green" id="back" i18n-values="value:back_button" onclick="sendCommand('takeMeBack')">
         </form>
       </div>
+      <div class="main"><a href="" i18n-content="description2" onclick="sendCommand('learnMore'); return false;"></a></div>
       <div class="main"><a href="" onclick="sendCommand('reportError'); return false;" onmousedown="return false;" i18n-content="report_error"></a></div>
+      <div class="main" i18n-values=".innerHTML:description3"></div>
     </div>
   </td>
 </table>
diff --git a/chrome/browser/safe_browsing/safe_browsing_blocking_page.cc b/chrome/browser/safe_browsing/safe_browsing_blocking_page.cc
index 2601023..9bc9f7d 100644
--- a/chrome/browser/safe_browsing/safe_browsing_blocking_page.cc
+++ b/chrome/browser/safe_browsing/safe_browsing_blocking_page.cc
@@ -288,6 +288,13 @@ void SafeBrowsingBlockingPage::PopulateMalwareStringDictionary(
 
 void SafeBrowsingBlockingPage::PopulatePhishingStringDictionary(
     DictionaryValue* strings) {
+  std::wstring proceed_link = StringPrintf(
+      kPLinkHtml,
+      l10n_util::GetString(IDS_SAFE_BROWSING_PHISHING_PROCEED_LINK).c_str());
+  std::wstring description3 = l10n_util::GetStringF(
+      IDS_SAFE_BROWSING_PHISHING_DESCRIPTION3,
+      proceed_link);
+
   PopulateStringDictionary(
       strings,
       l10n_util::GetString(IDS_SAFE_BROWSING_PHISHING_TITLE),
@@ -295,10 +302,8 @@ void SafeBrowsingBlockingPage::PopulatePhishingStringDictionary(
       l10n_util::GetStringF(IDS_SAFE_BROWSING_PHISHING_DESCRIPTION1,
                             UTF8ToWide(url().host())),
       l10n_util::GetString(IDS_SAFE_BROWSING_PHISHING_DESCRIPTION2),
-      L"");
+      description3);
 
-  strings->SetString("continue_button",
-      l10n_util::GetStringUTF16(IDS_SAFE_BROWSING_PHISHING_PROCEED_BUTTON));
   strings->SetString("back_button",
       l10n_util::GetStringUTF16(IDS_SAFE_BROWSING_PHISHING_BACK_BUTTON));
   strings->SetString("report_error",