Change the open URL link to a button

patch-malone · patch-malone · commit a93dbd8b2e02 · 2019-02-03T20:18:59.000Z
diff --git a/chromium/pages/cancel/index.html b/chromium/pages/cancel/index.html
@@ -8,11 +8,21 @@
     <link rel="stylesheet" href="style.css" type="text/css" />
   </head>
   <body>
-    <h1 id="https-everywhere"><img src="../../images/banner-red.png" alt="HTTPS Everywhere" /></h1>
-    <p data-i18n="cancel_he_blocking_explainer"></p>
-    <p id="url-paragraph"><span id="url-label">URL: </span><a href="#" id="originURL"></a></p>
-    <script src="../translation.js"></script>
-    <script src="../util.js"></script>
-    <script src="ux.js"></script>
+    <div class="content">
+      <h1 id="https-everywhere"><img src="../../images/banner-red.png" alt="HTTPS Everywhere" /></h1>
+      <p data-i18n="cancel_he_blocking_explainer"></p>
+
+      <p id="url-paragraph">
+        <span id="url-label">URL: </span><a href="#" id="url-value">PLACEHOLDER</a>
+      </p>
+
+      <form method="get" action="#" id="url-actions-form">
+        <button type="button" name="open" formaction="#" id="open-url-button" data-i18n="cancel_open_page">Open insecure page</button>
+      </form>
+
+      <script src="../translation.js"></script>
+      <script src="../util.js"></script>
+      <script src="ux.js"></script>
+    </div>
   </body>
 </html>
diff --git a/chromium/pages/cancel/style.css b/chromium/pages/cancel/style.css
@@ -1,20 +1,41 @@
 body{
   margin-top: 6em;
-  left: 50%;
   position: relative;
-  overflow: hidden;
+  text-align: center;
 }
 
-h1 img{
-  position: relative;
-  left: -289px;
+.content{
+  width: 600px;
+  margin: auto;
+  text-align: left;
 }
 
-p{
-  width: 600px;
-  position: relative;
-  left: -300px;
+h1{
+  text-align: center;
+}
+
+form, button, p{
   font-size: 12pt;
   font-family: sans-serif;
   line-height: 150%;
 }
+
+form{
+  overflow: auto;
+  margin-bottom: 1em;
+}
+
+form button{
+  padding: .5em 1em;
+  background-color: #aaa;
+  color: #fff;
+  border: none;
+  border-radius: 4px;
+  cursor: pointer;
+}
+
+#open-url-button{
+  display: inline-block;
+  float: left;
+  background-color: #ec1e1e;
+}
diff --git a/chromium/pages/cancel/ux.js b/chromium/pages/cancel/ux.js
@@ -28,15 +28,20 @@ function replaceLink(explainer) {
 function displayURL() {
   const cancelURL = new URL(window.location.href);
   const originURL = decodeURI(cancelURL.searchParams.get('originURL'));
-  const originURLLink = document.getElementById('originURL');
-  originURLLink.innerText = originURL;
+  const originURLLink = document.getElementById('url-value');
+  const openURLButton = document.getElementById('open-url-button');
 
-  originURLLink.addEventListener("click", function() {
+  originURLLink.innerHTML = originURL;
+  originURLLink.href = originURL;
+
+  openURLButton.addEventListener("click", function() {
     if (confirm(chrome.i18n.getMessage("chrome_disable_on_this_site") + '?')) {
       const url = new URL(originURL);
       sendMessage("disable_on_site", url.host, () => {
         window.location = originURL;
       });
     }
+
+    return false;
   });
 }
diff --git a/src/chrome/locale/en/https-everywhere.dtd b/src/chrome/locale/en/https-everywhere.dtd
@@ -35,6 +35,7 @@
 
 <!ENTITY https-everywhere.cancel.he_blocking_explainer "HTTPS Everywhere noticed you were navigating to a non-HTTPS page, and tried to send you to the HTTPS version instead. The HTTPS version is unavailable. Most likely this site does not support HTTPS, but it is also possible that an attacker is blocking the HTTPS version. If you wish to view the unencrypted version of this page, you can still do so by disabling the 'Block all unencrypted requests' option in your HTTPS Everywhere extension. Be aware that disabling this option could make your browser vulnerable to network-based downgrade attacks on websites you visit.">
 <!ENTITY https-everywhere.cancel.he_blocking_network "network-based downgrade attacks">
+<!ENTITY https-everywhere.cancel.open_page "Open insecure page">
 
 <!ENTITY https-everywhere.chrome.stable_rules "Stable rules">
 <!ENTITY https-everywhere.chrome.stable_rules_description "Force encrypted connections to these websites:">
