From 1a075bc6734eae4017762c4d1311e38e9bd14f52 Mon Sep 17 00:00:00 2001
From: gorhill <rhill@raymondhill.net>
Date: Tue, 24 Jan 2017 08:23:52 -0500
Subject: [PATCH] code review: mobile-friendly changes

---
 src/1p-filters.html          | 1 +
 src/3p-filters.html          | 8 ++++----
 src/about.html               | 1 +
 src/css/3p-filters.css       | 1 -
 src/css/dashboard-common.css | 5 +++++
 src/css/dashboard.css        | 5 +++++
 src/dyna-rules.html          | 1 +
 src/js/3p-filters.js         | 2 +-
 src/whitelist.html           | 1 +
 9 files changed, 19 insertions(+), 6 deletions(-)
diff --git a/src/1p-filters.html b/src/1p-filters.html
index 37e81610e..b1146a09d 100644
--- a/src/1p-filters.html
+++ b/src/1p-filters.html
@@ -2,6 +2,7 @@
 <html>
 <head>
 <meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
 <title>uBlock — Your filters</title>
 <link rel="stylesheet" type="text/css" href="css/common.css">
 <link rel="stylesheet" type="text/css" href="css/dashboard-common.css">
diff --git a/src/3p-filters.html b/src/3p-filters.html
index 29ccb5736..823dfff7e 100644
--- a/src/3p-filters.html
+++ b/src/3p-filters.html
@@ -3,7 +3,7 @@
 <head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
-<title>uBlock — Ubiquitous rules</title>
+<title>uBlock — Filter lists</title>
 <link rel="stylesheet" type="text/css" href="css/common.css">
 <link rel="stylesheet" type="text/css" href="css/dashboard-common.css">
 <link rel="stylesheet" type="text/css" href="css/cloud-ui.css">
@@ -15,11 +15,11 @@
 <div id="cloudWidget" class="hide" data-cloud-entry="tpFiltersPane"></div>
 
 <div>
-    <button id="buttonApply" class="important disabled" data-i18n="3pApplyChanges"></button>
     <ul id="options">
-        <li><input type="checkbox" id="autoUpdate"><label data-i18n="3pAutoUpdatePrompt1" for="autoUpdate"></label>&ensp;
-            <button class="custom important disabled" id="buttonUpdate" data-i18n="3pUpdateNow"></button>
+        <li><button id="buttonUpdate" class="custom important disabled" data-i18n="3pUpdateNow"></button>
             <button id="buttonPurgeAll" class="custom disabled" data-i18n="3pPurgeAll"></button>
+            <button id="buttonApply" class="custom important disabled" data-i18n="3pApplyChanges"></button>
+        <li><input type="checkbox" id="autoUpdate"><label data-i18n="3pAutoUpdatePrompt1" for="autoUpdate"></label>&ensp;
         <li><input type="checkbox" id="parseCosmeticFilters"><label data-i18n="3pParseAllABPHideFiltersPrompt1" for="parseCosmeticFilters"></label><button class="whatisthis"></button>
             <div class="whatisthis-expandable para" data-i18n="3pParseAllABPHideFiltersInfo"></div>
         <li><input type="checkbox" id="ignoreGenericCosmeticFilters"><label data-i18n="3pIgnoreGenericCosmeticFilters" for="ignoreGenericCosmeticFilters"></label><button class="whatisthis"></button>
diff --git a/src/about.html b/src/about.html
index 855170e96..842088d95 100644
--- a/src/about.html
+++ b/src/about.html
@@ -2,6 +2,7 @@
 <html>
 <head>
 <meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
 <title>uBlock — About</title>
 <link rel="stylesheet" type="text/css" href="css/common.css">
 <link rel="stylesheet" type="text/css" href="css/dashboard-common.css">
diff --git a/src/css/3p-filters.css b/src/css/3p-filters.css
index a38b1ae60..a5052ca45 100644
--- a/src/css/3p-filters.css
+++ b/src/css/3p-filters.css
@@ -1,7 +1,6 @@
 @keyframes spin {
     100% { transform: rotate(360deg); -webkit-transform: rotate(360deg); }
     }
-
 ul {
     padding: 0;
     list-style-type: none;
diff --git a/src/css/dashboard-common.css b/src/css/dashboard-common.css
index dd0a8c19c..bc8f3ddd2 100644
--- a/src/css/dashboard-common.css
+++ b/src/css/dashboard-common.css
@@ -2,6 +2,11 @@ body {
     margin: 0;
     padding: 0 0.5em 0.5em 0.5em;
     }
+@media screen and (max-device-width: 960px) {
+    body {
+        zoom: 1.4;
+        }
+    }
 h2, h3 {
     margin: 1em 0;
     font-family: sans-serif;
diff --git a/src/css/dashboard.css b/src/css/dashboard.css
index 1b34a7e7d..ea8f0573e 100644
--- a/src/css/dashboard.css
+++ b/src/css/dashboard.css
@@ -7,6 +7,11 @@ html, body {
     height: 100%;
     overflow: hidden;
     }
+@media screen and (max-device-width: 960px) {
+    #dashboard-nav {
+        zoom: 1.2;
+        }
+    }
 #dashboard-nav {
     border: 0;
     margin: 0;
diff --git a/src/dyna-rules.html b/src/dyna-rules.html
index cb81f99ef..fac16dd28 100644
--- a/src/dyna-rules.html
+++ b/src/dyna-rules.html
@@ -2,6 +2,7 @@
 <html>
 <head>
 <meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
 <title>uBlock — Dynamic filtering rules</title>
 <link rel="stylesheet" type="text/css" href="css/common.css">
 <link rel="stylesheet" type="text/css" href="css/dashboard-common.css">
diff --git a/src/js/3p-filters.js b/src/js/3p-filters.js
index 855f89eed..f43cb8bd3 100644
--- a/src/js/3p-filters.js
+++ b/src/js/3p-filters.js
@@ -92,6 +92,7 @@ var renderFilterLists = function(soft) {
             elem.setAttribute('href', 'asset-viewer.html?url=' + encodeURI(listKey));
             elem.setAttribute('type', 'text/html');
             elem.textContent = listNameFromListKey(listKey) + '\u200E';
+            li.classList.remove('toRemove');
             if ( entry.supportName ) {
                 li.classList.add('support');
                 elem = li.querySelector('a.support');
@@ -112,7 +113,6 @@ var renderFilterLists = function(soft) {
             } else {
                 li.classList.remove('mustread');
             }
-            li.classList.remove('toRemove');
         }
         // https://github.com/gorhill/uBlock/issues/1429
         if ( !soft ) {
diff --git a/src/whitelist.html b/src/whitelist.html
index 67a70ab92..f8a459052 100644
--- a/src/whitelist.html
+++ b/src/whitelist.html
@@ -2,6 +2,7 @@
 <html>
 <head>
 <meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
 <title>uBlock — Whitelist</title>
 <link rel="stylesheet" type="text/css" href="css/common.css">
 <link rel="stylesheet" type="text/css" href="css/dashboard-common.css">
