EFForg · zoracon · Jan 16, 2021 · Dec 3, 2020 · Dec 3, 2020 · Dec 3, 2020
diff --git a/chromium/external/README.md b/chromium/external/README.md
@@ -50,5 +50,3 @@ uglifycss \
 ```bash
 
 $ cp node_modules/pako/dist/pako_inflate.js pako-1.0.5/pako_inflate.min.js
-
-```
diff --git a/chromium/package-lock.json b/chromium/package-lock.json
diff --git a/chromium/package.json b/chromium/package.json
@@ -3,7 +3,6 @@
   "version": "1.0.0",
   "description": "",
   "main": "utils.js",
-  "dependencies": {},
   "devDependencies": {
     "atob": "^2.0.3",
     "btoa": "^1.1.2",

diff --git a/chromium/pages/base.css b/chromium/pages/base.css
@@ -6,8 +6,28 @@
   --light-grey: #ececec;
   --space: 5px;
   --font: 'Lucida Grande', 'Segoe UI', Tahoma, 'DejaVu Sans', Arial, sans-serif;
+  --code-font: 'VeraMono';
 }
 
+/*--------------------------------------------------------------
+# Layout
+--------------------------------------------------------------*/
+.grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+  row-gap: 16px;
+}
+
+/*--------------------------------------------------------------
+# Typography
+--------------------------------------------------------------*/
+.font {
+  font-family: var(--font);
+}
+
+/*--------------------------------------------------------------
+# Elements
+--------------------------------------------------------------*/
 .button {
   border: var(--https-blue) solid 1px;
   color: var(--text-main);
@@ -24,7 +44,3 @@
   background-color: var(--darker-blue);
   color: #fff;
 }
-
-.font {
-  font-family: var(--font);
-}
diff --git a/chromium/pages/cancel/index.html b/chromium/pages/cancel/index.html
@@ -1,33 +1,32 @@
 <!doctype html>
 <html>
   <head>
+    <!-- Required meta tags -->
     <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
     <title>⚠ HTTPS Everywhere ⚠</title>
-    <link rel="stylesheet" href="style.css">
+    <link href="style.css" rel="stylesheet">
     <link rel="icon" href="/images/icons/icon-blocking-38.png">
   </head>
   <body>
-    <div class="content">
-      <h1 id="https-everywhere">
+      <div class="banner">
         <img src="/images/banner-red.svg" alt="HTTPS Everywhere">
-      </h1>
-
-      <p data-i18n="cancel_he_blocking_explainer"></p>
+      </div>
 
-      <p id="url-paragraph">
-        <span id="url-label">URL: </span><span id="url-value"></span>
-      </p>
-      <button id="copy-url" data-i18n="cancel_copy_url"></button>
+      <div class="explainer" data-i18n="cancel_he_blocking_explainer"></div>
 
-      <div class="actions">
-        <button id="open-url-button" data-i18n="cancel_open_page"></button>
-        <button id="http-once-button" data-i18n="cancel_http_once"></button>
+      <div class="copy_block">
+        <pre id="url-value"></pre>
+        <button id="copy-url" class="ease_button" data-i18n="cancel_copy_url"></button>
       </div>
 
-      <script src="../translation.js"></script>
-      <script src="../util.js"></script>
-      <script src="ux.js"></script>
-    </div>
+      <div class="button_options">
+        <button id="http-once-button" class="ease_button" data-i18n="cancel_http_once"></button>
+        <button id="open-url-button" class="ease_button" data-i18n="cancel_open_page"></button>
+      </div>
+    <script src="/pages/translation.js"></script>
+    <script src="/pages/util.js"></script>
+    <script src="ux.js"></script>
   </body>
 </html>
diff --git a/chromium/pages/cancel/style.css b/chromium/pages/cancel/style.css
@@ -1,13 +1,33 @@
+@import "../main.css";
+
 body {
-  margin-top: 6em;
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+  margin: 2% auto;
   font-size: 12pt;
   font-family: sans-serif;
   line-height: 150%;
+  row-gap: 16px;
 }
 
-.content {
-  margin: auto;
-  max-width: 600px;
+/*---------
+# GRID LAYOUT
+---------*/
+.banner {
+  grid-column: 2;
+  grid-row: 1;
+}
+.explainer {
+  grid-column: 2;
+  grid-row: 2;
+}
+.copy_block {
+  grid-column: 2;
+  grid-row: 3;
+}
+.button_options {
+  grid-column: 2;
+  grid-row: 4;
 }
 
 h1 {
@@ -26,7 +46,7 @@ h1 img {
   text-overflow: ellipsis;
 }
 
-button {
+.ease_button {
   background-color: #ec1e1e;
   border: 1px solid #ec1e1e;
   border-radius: 4px;
@@ -35,21 +55,55 @@ button {
   padding: 0.5em 1em;
   float: none;
   font-size: 12pt;
+  font-weight: normal;
   margin: 8px 0;
   line-height: 150%;
 }
 
-button:hover {
-  background-color: #fff;
-  color: #ec1e1e;
-}
-
 button:last-child {
   margin: 0;
 }
 
-@media screen and (max-width: 550px) {
-  button {
+#url-value{
+ float: left;
+ font-weight: bold;
+ margin: 2% 2% 0 0;
+}
+#copy-url, #open-url-button{
+  background-color: var(--light-grey) !important;
+  border: 1px solid var(--text-secondary) !important;
+}
+#copy-url {
+  color: var(--text-secondary) !important;
+  font-size: 14px;
+}
+#open-url-button {
+  color: #666666 !important;
+}
+#copy-url:hover, #open-url-button:hover {
+  background-color: var(--text-secondary) !important;
+  border: 1px solid var(--text-secondary) !important;
+  color: var(--light-grey) !important;
+}
+
+@media screen and (max-width: 800px) {
+  body {
+    grid-template-columns: 1fr;
+    margin: 5%;
+  }
+  .banner {
+    grid-row: 1;
+  }
+  .explainer {
+    grid-row: 2;
+  }
+  .copy_block {
+    grid-row: 3;
+  }
+  .button_options {
+    grid-row: 4;
+  }
+  .ease_button {
     width: 100%;
     margin: 8px 0;
   }
@@ -65,11 +119,11 @@ button:last-child {
     color: #45a1ff;
   }
 
-  button {
+  .ease_button {
     color: #202023;
   }
 
-  button:hover {
+  .ease_button:hover {
     background-color: #202023;
     border-color: #ec1e1e;
   }

diff --git a/chromium/pages/cancel/ux.js b/chromium/pages/cancel/ux.js
@@ -52,7 +52,7 @@ function displayURL() {
   originURLLink.href = originURL;
 
   openURLButton.addEventListener("click", function() {
-    if (confirm(chrome.i18n.getMessage("chrome_disable_on_this_site") + '?')) {
+    if (confirm(chrome.i18n.getMessage("cancel_open_page") + '?')) {
       sendMessage("disable_on_site", url.host, () => {
         window.location = originURL;
       });
@@ -117,7 +117,7 @@ function displayURL() {
   });
 
   openHttpOnce.addEventListener("click", function() {
-    if (confirm(chrome.i18n.getMessage("chrome_disable_on_this_site") + '?')) {
+    if (confirm(chrome.i18n.getMessage("cancel_http_once") + '?')) {
       sendMessage("disable_on_site_once", url.host, () => {
         window.location = originURL;
       });

diff --git a/chromium/pages/main.css b/chromium/pages/main.css
@@ -2,6 +2,7 @@
 >>> TABLE OF CONTENTS:
 ----------------------------------------------------------------
 # Base
+  - Layout
 	- Typography
 	- Elements
 	- Links

diff --git a/src/chrome/locale/en/https-everywhere.dtd b/src/chrome/locale/en/https-everywhere.dtd
@@ -49,8 +49,8 @@
 <!ENTITY https-everywhere.cancel.he_blocking_network "network-based downgrade attacks">
 <!ENTITY https-everywhere.cancel.copy_url "Copy URL">
 <!ENTITY https-everywhere.cancel.copied_url "Copied to Clipboard">
-<!ENTITY https-everywhere.cancel.open_page "Open insecure page">
-<!ENTITY https-everywhere.cancel.http_once "Open insecure page for this session only">
+<!ENTITY https-everywhere.cancel.open_page "Disable on this site">
+<!ENTITY https-everywhere.cancel.http_once "Proceed anyway (unsafe)">
 
 <!ENTITY https-everywhere.onboarding.intro "Encrypt the Web! Automatically use HTTPS security on many sites.">
 <!ENTITY https-everywhere.onboarding.header "HTTPS Everywhere has been updated!">
@@ -63,8 +63,8 @@
 <!ENTITY https-everywhere.chrome.stable_rules_description "Force encrypted connections to these websites:">
 <!ENTITY https-everywhere.chrome.experimental_rules "Experimental rules">
 <!ENTITY https-everywhere.chrome.experimental_rules_description "May cause warnings or breakage. Disabled by default.">
-<!ENTITY https-everywhere.chrome.disable_on_this_site "Disable HTTPS Everywhere on this site">
-<!ENTITY https-everywhere.chrome.enable_on_this_site "Enable HTTPS Everywhere on this site">
+<!ENTITY https-everywhere.chrome.disable_on_this_site "Disable on this site">
+<!ENTITY https-everywhere.chrome.enable_on_this_site "Enable on this site">
 <!ENTITY https-everywhere.chrome.add_rule "Add a rule for this site">
 <!ENTITY https-everywhere.chrome.add_new_rule "Add a new rule for this site">
 <!ENTITY https-everywhere.chrome.always_https_for_host "Always use https for this host">
Original file line number	Diff line number	Diff line change
Expand Up		@@ -50,5 +50,3 @@ uglifycss \
		```bash

		$ cp node_modules/pako/dist/pako_inflate.js pako-1.0.5/pako_inflate.min.js

		```
-Original file line number
+Diff line change
@@ Expand Up / @@ -2,6 +2,7 @@ @@
     >>> TABLE OF CONTENTS:
     ----------------------------------------------------------------
     # Base
+      - Layout
     	- Typography
     	- Elements
     	- Links
@@ Expand Down @@