#18 Bootstrap-free design and translation of some missing strings

Merged
nipos merged 17 commits from Pixelcode/master into nipos/master 4 years ago

+ 33 - 1
src/_locales/de/messages.json

@@ -274,5 +274,37 @@
 	"connections": {
 		"message": "Verbindung(en)",
 		"description": "connection(s)"
+	},
+	"torwarning": {
+		"message": "Der Tor-Browser wird nicht untertützt. Du kannst dieses Addon DEINSTALLIEREN. Siehe Issue #18 im Gitlab-Projekt für offene Feature-Requests zur Tor-Browser-Unterstützung",
+		"description": "Tor not supported warning"
+	},
+	"cachedeleted": {
+		"message": "Dein lokaler Offline-Cache wurde gelöscht",
+		"description": "cache deleted notification"
+	},
+	"urlwasblocked": {
+		"message": " wurde blockiert, weil es bei ",
+		"description": "url was blocked because... notification"
+	},
+	"urlwasblockedtwo": {
+		"message": " gehostet wird und du entschieden hast, diese Cloud zu blockieren",
+		"description": "url was blocked because... notification second part"
+	},
+	"for": {
+		"message": "für",
+		"description": "e.g. disable rule for website x"
+	},
+	"rulesdisabled": {
+		"message": "Du hast die Regeln ausgeschaltet für",
+		"description": "you disabled the rules for --url--"
+	},
+	"disabledhere": {
+		"message": "Deaktiviert auf dieser Seite",
+		"description": "You have disabled the rules on this site"
+	},
+	"settingsdescriptiondarkmode": {
+		"message": "Dunkles Design",
+		"description": "Toggle dark mode"
 	}
-}
+}

+ 32 - 0
src/_locales/en/messages.json

@@ -274,5 +274,37 @@
 	"connections": {
 		"message": "Connection(s)",
 		"description": "connection(s)"
+	},
+	"torwarning": {
+		"message": "Tor Browser is not supported. You can UNINSTALL this addon. Refer issue #18 in project Gitlab for Open Feature Request for Tor Browser Support",
+		"description": "Tor not supported warning"
+	},
+	"cachedeleted": {
+		"message": "Your local offline cache has been deleted",
+		"description": "cache deleted notification"
+	},
+	"urlwasblocked": {
+		"message": " was blocked as it is in ",
+		"description": "url was blocked because... notification"
+	},
+	"urlwasblockedtwo": {
+		"message": " cloud and you chose to block this cloud",
+		"description": "url was blocked because... notification second part"
+	},
+	"for": {
+		"message": "for",
+		"description": "e.g. disable rule for website x"
+	},
+	"rulesdisabled": {
+		"message": "You disabled the rules for",
+		"description": "you disabled the rules for --url--"
+	},
+	"disabledhere": {
+		"message": "Disabled on this site",
+		"description": "You have disabled the rules on this site"
+	},
+	"settingsdescriptiondarkmode": {
+		"message": "Dark mode",
+		"description": "Toggle dark mode"
 	}
 }

+ 33 - 1
src/_locales/fr/messages.json

@@ -274,5 +274,37 @@
 	"connections": {
 		"message": "connexion(s)",
 		"description": "connection(s)"
+	},
+	"torwarning": {
+		"message": "Le navigateur Tor n'est pas supporté. Vous pouvez DÉSINSTALLER cet addon. Référez-vous au problème #18 dans le projet Gitlab pour une demande de fonctionnalité ouverte pour le support du navigateur Tor",
+		"description": "Tor not supported warning"
+	},
+	"cachedeleted": {
+		"message": "Votre cache local hors ligne a été supprimé",
+		"description": "cache deleted notification"
+	},
+	"urlwasblocked": {
+		"message": " a été bloqué parce qu'il est dans le nuage ",
+		"description": "url was blocked because... notification"
+	},
+	"urlwasblockedtwo": {
+		"message": " et vous avez choisi de bloquer ce nuage",
+		"description": "url was blocked because... notification second part"
+	},
+	"for": {
+		"message": "pour",
+		"description": "e.g. disable rule for website x"
+	},
+	"rulesdisabled": {
+		"message": "Vous avez désactivé les règles pour",
+		"description": "you disabled the rules for --url--"
+	},
+	"disabledhere": {
+		"message": "Désactivés sur cette page",
+		"description": "You have disabled the rules on this site"
+	},
+	"settingsdescriptiondarkmode": {
+		"message": "Mode sombre",
+		"description": "Toggle dark mode"
 	}
-}
+}

+ 26 - 0
src/css/dark.css

@@ -0,0 +1,26 @@
+html {
+	background-color: black;
+	color: white;
+}
+
+#statstable {
+	background-color: #333;
+}
+
+#connectionsblockeddiv {
+	color: red;
+}
+
+.btn-red {
+	color: white;
+	background-color: #cf0202;
+}
+
+.btn-red:hover {
+	background-color: #b30606;
+}
+
+.md_switch [type="checkbox"]:checked + .md_switch__toggle::before,
+.md_switch [type="checkbox"]:checked + .md_switch__toggle::after {
+	background: #02b7a4;
+}

+ 204 - 1
src/css/popup2.css

@@ -2,14 +2,214 @@ li {
   margin: 0px 0px 0px -18px;
   padding: 0px;
 }
+
 html, body {
     max-width: 100%;
     overflow-x: hidden;
+	font-family: sans-serif;
+}
+
+#rowdiv {
+	display: grid;
+	grid-template-columns: auto auto;
+}
+
+#statstable {
+	grid-column: 1;
+	margin-left: 20px;
+	margin-right: 40px;
+	padding: 20px;
+	padding-right: 30px;
+	background-color: #f8f8f8;
+	margin-bottom: 15px;
+}
+
+#connectionsblockeddiv {
+	display: flex;
+	align-items: center;
+	margin-bottom: 10px;
+	font-size: 18px;
+	z-index: 10;
+	position: relative;
+	color: #bf0600;
+}
+
+#connectionsblockedicon {
+	margin-right: 5px;
+	height: 20px;
+	width: auto;
+	position: relative;
+	top: -1px;
+}
+
+#sinceinstallationdiv {
+	border-color: #dbdbdb;
+	border-bottom-style: solid;
+	border-width: 1px;
+	margin-top: 20px;
+	margin-bottom: 15px;
+	padding-bottom: 3px;
+}
+
+#onthispagediv {
+	border-color: #dbdbdb;
+	border-bottom-style: solid;
+	border-width: 1px;
+	margin-top: 10px;
+	margin-bottom: 10px;
+	padding-bottom: 3px;
+}
+
+#uidiv {
+	grid-column: 2;
+	padding-right: 20px;
+}
+
+#titlediv {
+	width: 100%;
+	vertical-align: middle;
+	margin-top: 5px;
+	margin-bottom: 25px;
+	cursor: default;
+}
+
+#titledivinner {
+	width: 150px;
+	position: relative;
+	left: 50%;
+	transform: translate(-50%,0%);
+	display: flex;
+	align-items: center;
+}
+
+#title {
+	font-size: 19px; 
+	white-space: nowrap;
+}
+
+#titlelogo {
+	height: 20px;
+	width: auto;
+	margin-right: 5px;
+}
+
+.btn {
+	padding-left: 8px;
+	padding-right: 8px;
+	padding-top: 8px;
+	padding-bottom: 8px;
+	border-radius: 4px;
+	border-style: solid;
+	border-color: transparent;
+	border-width: 1px;
+	color: white;
+	cursor: pointer;
+}
+
+.btn-red {
+	background-color: red;
+}
+
+.btn-red:hover {
+	background-color: #e60000;
+}
+
+.btn-green {
+	background-color: #0bc214;
+}
+
+.btn-green:hover {
+	background-color: #09ad11;
+}
+
+.btn-blue {
+	background-color: #3676ff;
+}
+
+.btn-blue:hover {
+	background-color: #336be3;
+}
+
+.btn-lightblue {
+	background-color: #3cb1ff;
+}
+
+.btn-lightblue:hover {
+	background-color: #3498db;
+}
+
+.btn-light {
+	color: #777;
+	background-color: #fafafa;
+}
+
+.btn-light:hover {
+	background-color: #f5f5f5;
+}
+
+.btn-dark {
+	color: white;
+	background-color: #333;
+}
+
+.btn-dark:hover {
+	background-color: #444;
+}
+
+.badge {
+	padding-left: 4px;
+	padding-right: 4px;
+	padding-top: 1px;
+	padding-bottom: 1px;
+	border-radius: 3px;
+	border-style: solid;
+	border-color: transparent;
+	color: white;
+	font-size: 12px;
+	cursor: default;
+}
+
+.badge-info {
+	background-color: #6939a8;
+}
+
+.badge-alert-info {
+	background-color: #ffe96e;
+	color: #877300;
+}
+
+.badge-alert-info-img {
+	position: relative;
+	top: 1px;
+	height: 15px;
+	width: auto;
+	margin-right: 4px;
+}
+
+#inExcludesAlert {
+	position: relative;
+	top: -2px;
+	font-size: 13px;
+}
+
+#infocenter {
+	margin-top: 5px;
+	margin-bottom: 15px;
+}
+
+#switchdiv {
+	margin-bottom: 0px;
+}
+
+#versiondisplay {
+	cursor: default;
+	padding-top: 5px;
 }
 
 tr.spaceUnder > td {
   padding-bottom: 0.5em;
 }
+
 .container {
   margin: 2px;
   width: auto;
@@ -17,6 +217,7 @@ tr.spaceUnder > td {
   line-height: 45px;
   text-align: center;
 }
+
 .resize_fit_center {
   max-width: 100%;
   max-height: 100%;
@@ -34,9 +235,11 @@ tr.spaceUnder > td {
 .newLine {
   display: block;
 }
+
 .btn-behance {
   background-color: #1769ff;
 }
+
 .btn-behance:hover {
   background-color: #4a8aff;
 }
@@ -54,7 +257,6 @@ tr.spaceUnder > td {
 }
 
 #inTempexcludesAlert,
-#inExcludesAlert,
 #inTempIncludesAlert,
 #refreshbutton {
   white-space: nowrap;
@@ -98,6 +300,7 @@ label {
   top: 5px;
   margin-top: 4px;
 }
+
 #copyBtnArea .btn {
 	margin:2px;
 }

+ 62 - 0
src/images/alert-darkyellow.svg

@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="1em"
+   height="1em"
+   viewBox="0 0 16 16"
+   class="bi bi-exclamation-triangle"
+   fill="currentColor"
+   version="1.1"
+   id="svg2695"
+   sodipodi:docname="alert-darkyellow.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata2701">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs2699" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1001"
+     id="namedview2697"
+     showgrid="false"
+     inkscape:zoom="14.75"
+     inkscape:cx="8"
+     inkscape:cy="8"
+     inkscape:window-x="-9"
+     inkscape:window-y="-9"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg2695" />
+  <path
+     fill-rule="evenodd"
+     d="M7.938 2.016a.146.146 0 0 0-.054.057L1.027 13.74a.176.176 0 0 0-.002.183c.016.03.037.05.054.06.015.01.034.017.066.017h13.713a.12.12 0 0 0 .066-.017.163.163 0 0 0 .055-.06.176.176 0 0 0-.003-.183L8.12 2.073a.146.146 0 0 0-.054-.057A.13.13 0 0 0 8.002 2a.13.13 0 0 0-.064.016zm1.044-.45a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566z"
+     id="path2691"
+     style="stroke:#877300;stroke-opacity:0;fill:#877300;fill-opacity:0.97555012" />
+  <path
+     d="M7.002 12a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 5.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995z"
+     id="path2693"
+     style="fill:#877300;fill-opacity:1" />
+</svg>

+ 61 - 0
src/images/alert.svg

@@ -0,0 +1,61 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   width="1em"
+   height="1em"
+   viewBox="0 0 16 16"
+   class="bi bi-exclamation-triangle"
+   fill="currentColor"
+   version="1.1"
+   id="svg2695"
+   sodipodi:docname="alert.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata2701">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs2699" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1001"
+     id="namedview2697"
+     showgrid="false"
+     inkscape:zoom="14.75"
+     inkscape:cx="8"
+     inkscape:cy="8"
+     inkscape:window-x="-9"
+     inkscape:window-y="-9"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg2695" />
+  <path
+     fill-rule="evenodd"
+     d="M7.938 2.016a.146.146 0 0 0-.054.057L1.027 13.74a.176.176 0 0 0-.002.183c.016.03.037.05.054.06.015.01.034.017.066.017h13.713a.12.12 0 0 0 .066-.017.163.163 0 0 0 .055-.06.176.176 0 0 0-.003-.183L8.12 2.073a.146.146 0 0 0-.054-.057A.13.13 0 0 0 8.002 2a.13.13 0 0 0-.064.016zm1.044-.45a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566z"
+     id="path2691"
+     style="stroke:#877300;stroke-opacity:0;fill:#877300;fill-opacity:0.97555012" />
+  <path
+     d="M7.002 12a1 1 0 1 1 2 0 1 1 0 0 1-2 0zM7.1 5.995a.905.905 0 1 1 1.8 0l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995z"
+     id="path2693"
+     style="fill:#877300;fill-opacity:1" />
+</svg>

+ 55 - 0
src/images/ban.svg

@@ -0,0 +1,55 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   aria-hidden="true"
+   focusable="false"
+   role="img"
+   viewBox="0 0 512 512"
+   version="1.1"
+   id="svg1569"
+   sodipodi:docname="ban.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata1575">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs1573" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1001"
+     id="namedview1571"
+     showgrid="false"
+     inkscape:zoom="0.4609375"
+     inkscape:cx="256"
+     inkscape:cy="256"
+     inkscape:window-x="-9"
+     inkscape:window-y="-9"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1569" />
+  <path
+     d="M256 8C119.034 8 8 119.033 8 256s111.034 248 248 248 248-111.034 248-248S392.967 8 256 8zm130.108 117.892c65.448 65.448 70 165.481 20.677 235.637L150.47 105.216c70.204-49.356 170.226-44.735 235.638 20.676zM125.892 386.108c-65.448-65.448-70-165.481-20.677-235.637L361.53 406.784c-70.203 49.356-170.226 44.736-235.638-20.676z"
+     id="path1567"
+     style="fill:#336be3;fill-opacity:1" />
+</svg>

+ 56 - 0
src/images/blue-ban.svg

@@ -0,0 +1,56 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   aria-hidden="true"
+   focusable="false"
+   role="img"
+   viewBox="0 0 512 512"
+   version="1.1"
+   id="svg1569"
+   sodipodi:docname="blue-ban.svg"
+   inkscape:version="0.92.4 (5da689c313, 2019-01-14)">
+  <metadata
+     id="metadata1575">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs1573" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1001"
+     id="namedview1571"
+     showgrid="false"
+     inkscape:zoom="0.4609375"
+     inkscape:cx="-326.50847"
+     inkscape:cy="256"
+     inkscape:window-x="-9"
+     inkscape:window-y="-9"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1569" />
+  <path
+     d="M256 8C119.034 8 8 119.033 8 256s111.034 248 248 248 248-111.034 248-248S392.967 8 256 8zm130.108 117.892c65.448 65.448 70 165.481 20.677 235.637L150.47 105.216c70.204-49.356 170.226-44.735 235.638 20.676zM125.892 386.108c-65.448-65.448-70-165.481-20.677-235.637L361.53 406.784c-70.203 49.356-170.226 44.736-235.638-20.676z"
+     id="path1567"
+     style="fill:#336be3;fill-opacity:1" />
+</svg>

+ 0 - 0
src/images/cloud-blocked.svg


Some files were not shown because too many files changed in this diff