9 files changed, 619 insertions, 0 deletions
diff --git a/src/css/1p-filters.css b/src/css/1p-filters.css
new file mode 100644
index 0000000..8413e6b
--- /dev/null
+++ b/src/css/1p-filters.css
@@ -0,0 +1,13 @@
+div > p:first-child {
+    margin-top: 0;
+    }
+div > p:last-child {
+    margin-bottom: 0;
+    }
+.userFilters {
+    font-size: smaller;
+    width: 48em;
+    height: 40em;
+    white-space: pre;
+    text-align: left;
+    }
diff --git a/src/css/3p-filters.css b/src/css/3p-filters.css
new file mode 100644
index 0000000..9e3b009
--- /dev/null
+++ b/src/css/3p-filters.css
@@ -0,0 +1,124 @@
+ul {
+    padding: 0;
+    list-style-type: none;
+    }
+ul#options {
+    margin-top: 0;
+    }
+ul#options li {
+    margin-bottom: 0.5em;
+    }
+ul#lists {
+    margin: 0.5em 0 0 0;
+    padding-__MSG_@@bidi_end_edge__: 0em;
+    padding-__MSG_@@bidi_start_edge__: 1em;
+    }
+ul#lists > li {
+    margin: 0.5em 0 0 0;
+    padding: 0;
+    font-size: 15px;
+    list-style-type: none;
+    }
+ul#lists > li > ul {
+    margin: 0.25em 0 0 0;
+    }
+li.listDetails {
+    font-size: 14px;
+    margin: 0 auto 0 auto;
+    margin-__MSG_@@bidi_start_edge__: 1em;
+    margin-__MSG_@@bidi_end_edge__: 0em;
+    }
+li.listDetails > * {
+    unicode-bidi: embed;
+    }
+li.listDetails > a:nth-of-type(2) {
+    font-size: 13px;
+    opacity: 0.5;
+    }
+.dim {
+    opacity: 0.5;
+    }
+/* I designed the button with: http://charliepark.org/bootstrap_buttons/ */
+button.custom {
+    padding: 5px;
+    border: 1px solid transparent;
+    border-color: #80b3ff #80b3ff hsl(216, 100%, 75%);
+    border-radius: 3px;
+    background-color: hsl(216, 100%, 75%);
+    background-image: linear-gradient(#a8cbff, #80b3ff);
+    background-repeat: repeat-x;
+    color: #222;
+    cursor: pointer;
+    opacity: 0.8;
+    }
+button.custom.disabled {
+    border-color: #dddddd #dddddd hsl(36, 0%, 85%);
+    background-color: hsl(36, 0%, 72%);
+    background-image: linear-gradient(#f2f2f2, #dddddd);
+    color: #aaa;
+    pointer-events: none;
+    }
+button.custom:hover {
+    opacity: 1.0;
+    }
+button.custom.reloadAll:not(.disabled) {
+    border-color: #ffcc7f #ffcc7f hsl(36, 100%, 73%);
+    background-color: hsl(36, 100%, 75%);
+    background-image: linear-gradient(#ffdca8, #ffcc7f);
+    }
+#buttonApply {
+    position: fixed;
+    display: initial;
+    top: 1em;
+    __MSG_@@bidi_end_edge__: 1em;
+    }
+#buttonApply.disabled {
+    display: none;
+    }
+span.status {
+    margin: 0;
+    border: 1px solid transparent;
+    padding: 1px 2px;
+    display: inline-block;
+    font-size: 11px;
+    opacity: 0.7;
+}
+span.purge {
+    border-color: #ddd;
+    color: #444;
+    background-color: #eee;
+    cursor: pointer;
+    }
+span.purge:hover {
+    opacity: 1;
+    }
+span.obsolete {
+    border-color: hsl(36, 100%, 73%);
+    color: #222;
+    background-color: hsl(36, 100%, 75%);
+    }
+#externalListsDiv {
+    margin: 2em auto 0 auto;
+    margin-__MSG_@@bidi_start_edge__: 2em;
+    }
+#externalLists {
+    font-size: smaller;
+    width: 48em;
+    height: 8em;
+    white-space: nowrap;
+    }
+body #busyOverlay {
+    position: fixed;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    background-color: white;
+    opacity: 0.5;
+    cursor: wait;
+    display: none;
+    z-index: 1000;
+    }
+body.busy #busyOverlay {
+    display: block;
+    }
diff --git a/src/css/about.css b/src/css/about.css
new file mode 100644
index 0000000..1d682b2
--- /dev/null
+++ b/src/css/about.css
@@ -0,0 +1,4 @@
+ul {
+	padding-__MSG_@@bidi_start_edge__: 1em;
+	margin-__MSG_@@bidi_start_edge__: 1em;
+	}
diff --git a/src/css/common.css b/src/css/common.css
new file mode 100644
index 0000000..391478f
--- /dev/null
+++ b/src/css/common.css
@@ -0,0 +1,60 @@
+@font-face {
+  font-family: 'FontAwesome';
+  src: url('fonts/fontawesome-webfont.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+.fa {
+    font-family: FontAwesome;
+    font-style: normal;
+    font-weight: normal;
+    line-height: 1;
+    vertical-align: baseline;
+    display: inline-block;
+    }
+#dashboard-nav-widgets {
+	direction: __MSG_@@bidi_dir__;
+	}
+
+/* https://developer.mozilla.org/en-US/docs/Web/CSS/::after#Tooltips */
+*[data-tip] {
+    cursor: pointer;
+    position: relative;
+    }
+*[data-tip]:hover:after {
+    background-color: #ffffee;
+    border: 1px solid gray;
+    border-radius: 3px;
+    box-shadow: 1px 1px 3px gray;
+    color: black;
+    content: attr(data-tip);
+	direction: __MSG_@@bidi_dir__;
+    font: 11px sans-serif;
+    left: 0;
+    line-height: 130%;
+    min-width: 55%;
+    padding: 4px 6px;
+    position: absolute;
+    text-align: __MSG_@@bidi_start_edge__;
+    top: 110%;
+    white-space: pre-line;
+    z-index: 20;
+    animation: tooltip 0.8s;
+    -webkit-animation: tooltip 0.8s;
+    }
+*[data-tip][data-tip-anchor="top"]:hover:after {
+    bottom: 105%;
+    __MSG_@@bidi_start_edge__: auto;
+    __MSG_@@bidi_end_edge__: -10%;
+    top: auto;
+    }
+@keyframes tooltip {
+      0% { opacity: 0; }
+     85% { opacity: 0; }
+    100% { opacity: 1; }
+    }
+@-webkit-keyframes tooltip {
+      0% { opacity: 0; }
+     85% { opacity: 0; }
+    100% { opacity: 1; }
+    }
diff --git a/src/css/dashboard-common.css b/src/css/dashboard-common.css
new file mode 100644
index 0000000..4ec0ef6
--- /dev/null
+++ b/src/css/dashboard-common.css
@@ -0,0 +1,77 @@
+body {
+    margin: 0;
+    padding: 0 0.5em 5em 0.5em;
+    font: 14px sans-serif;
+	direction: __MSG_@@bidi_dir__;
+    }
+h2, h3 {
+    margin: 1em 0;
+    font-family: sans-serif;
+    }
+h2 {
+    font-size: 18px;
+    }
+h2:nth-of-type(1) {
+    margin-top: 0;
+    }
+h3 {
+    font-size: 16px;
+    }
+h2 + * {
+	margin: 0 auto;
+	margin-__MSG_@@bidi_start_edge__: 1em;
+	padding-__MSG_@@bidi_end_edge__: 0em;
+    }
+a {
+    text-decoration: none;
+    }
+button {
+    padding: 0.33em;
+    }
+div > p:first-child {
+    margin-top: 0;
+    }
+div > p:last-child {
+    margin-bottom: 0;
+    }
+
+.para {
+    width: 40em;
+    }
+.whatisthis {
+    margin: 0 0 0 8px;
+    border: 0;
+    padding: 0 0 4px 0;
+    width: 16px;
+    height: 16px;
+    background: url('../img/help16.png') no-repeat;
+    cursor: pointer;
+    opacity: 0.5;
+    vertical-align: middle;
+    }
+.whatisthis:hover {
+    opacity: 1.0;
+    }
+.whatisthis-expandable {
+    margin: 0.5em 0 1em 1.25em;
+    padding: 0.5em;
+    display: none;
+    border: 1px dotted black;
+    background-color: #F8F8F8;
+    font-size: 13px;
+    }
+.whatisthis-expandable > p {
+    margin-top: 1em;
+    margin-bottom: 0;
+    }
+.whatisthis-expandable > p:first-child {
+    margin-top: 0;
+    }
+.whatisthis-expandable.whatisthis-expanded {
+    display: block;
+    }
+.warn {
+    margin: 0;
+    padding: 5px;
+    background-color: #FEDAE0;
+    }
diff --git a/src/css/fonts/OFL.txt b/src/css/fonts/OFL.txt
new file mode 100644
index 0000000..f1a20ac
--- /dev/null
+++ b/src/css/fonts/OFL.txt
@@ -0,0 +1,97 @@
+Copyright (c) <dates>, <Copyright Holder> (<URL|email>),
+with Reserved Font Name <Reserved Font Name>.
+Copyright (c) <dates>, <additional Copyright Holder> (<URL|email>),
+with Reserved Font Name <additional Reserved Font Name>.
+Copyright (c) <dates>, <additional Copyright Holder> (<URL|email>).
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
diff --git a/src/css/fonts/fontawesome-webfont.ttf b/src/css/fonts/fontawesome-webfont.ttf
new file mode 100644
index 0000000..96a3639
--- /dev/null
+++ b/src/css/fonts/fontawesome-webfont.ttf
diff --git a/src/css/popup.css b/src/css/popup.css
new file mode 100644
index 0000000..794cfef
--- /dev/null
+++ b/src/css/popup.css
@@ -0,0 +1,228 @@
+body {
+    margin: 0;
+    border: 0;
+    padding: 0;
+    font: 13px sans-serif;
+    background-color: white;
+    direction: __MSG_@@bidi_dir__;
+    min-width: 180px;
+    overflow: hidden;
+    display: inline-block;
+    }
+h1,h2,h3,h4 {
+    margin:  0;
+    padding: 4px;
+    border: 0;
+    color: white;
+    background-color: #444;
+    text-align: center;
+    cursor: pointer;
+    }
+a {
+    color: inherit;
+    text-decoration: none;
+    }
+*:focus {
+    outline: 0;
+    }
+#version {
+    margin-left: 1em;
+    font-weight: normal;
+    font-size: 11px;
+    }
+body > div {
+    padding: 4px 12px 0 12px;
+    }
+p {
+    margin: 16px 0;
+    white-space: nowrap;
+    text-align: center;
+    }
+#switch .fa {
+    margin: 0;
+    font-size: 96px;
+    color: green;
+    cursor: pointer;
+    }
+#switch .fa:hover {
+    opacity: 0.9;
+    }
+#switch .fa.off {
+    color: #ccc;
+    }
+#switch-hint {
+    font-size: 11px;
+    color: #888;
+    }
+#page-blocked {
+    margin-top: 4px;
+    font-size: 20px;
+    }
+#total-blocked {
+    margin-top: 4px;
+    margin-bottom: 8px;
+    font-size: 14px;
+    }
+#stats {
+    margin-bottom: 4px;
+    text-align: center;
+    }
+.tool {
+    font-size: 14px;
+    color: #aaa;
+    cursor: pointer;
+    display: none;
+    }
+.tool.enabled {
+    display: inline;
+    }
+.tool:hover {
+    color: #444;
+    }
+
+#dynamicFilteringToggler {
+    margin: 0;
+    border: 0;
+    padding: 0;
+    width: 100%;
+    text-align: center;
+    cursor: pointer;
+    position: relative;
+    }
+#dynamicFilteringToggler > div {
+    font-size: 9px;
+    line-height: 100%;
+    color: #aaa;
+    position: absolute;
+    bottom: 0;
+    width: 25%;
+    display: none;
+    pointer-events: none;
+    }
+#dynamicFilteringToggler.on:hover > div {
+    display: initial;
+    }
+#dynamicFilteringToggler > div:nth-of-type(1) {
+    left: 0;
+    }
+#dynamicFilteringToggler > div:nth-of-type(2) {
+    left: 25%;
+    }
+#dynamicFilteringToggler > div:nth-of-type(3) {
+    left: 50%;
+    }
+#dynamicFilteringToggler > div:nth-of-type(4) {
+    left: 75%;
+    }
+#dynamicFilteringToggler a {
+    padding: 0 2px 0 8px;
+    position: absolute;
+    __MSG_@@bidi_end_edge__: 0;
+    color: #aaa;
+    visibility: hidden;
+    }
+#dynamicFilteringToggler a:hover {
+    color: #444;
+    }
+#dynamicFilteringToggler.on:hover a {
+    visibility: visible;
+    }
+#dynamicFilteringToggler::before {
+    content: '\f107';
+    }
+#dynamicFilteringToggler.on::before {
+    content: '\f106';
+    }
+#dynamicFilteringContainer {
+    margin: 0;
+    border: 0;
+    padding: 0;
+    display: none;
+    }
+#dynamicFilteringToggler.on + #dynamicFilteringContainer {
+    display: initial;
+    }
+.dynamicFiltering {
+    margin: 0;
+    border: 0;
+    padding: 0;
+    height: 2.75em;
+    position: relative;
+    }
+.dynamicFiltering.local {
+    border-bottom: 1px solid white;
+    }
+.dynamicFiltering.global {
+    height: 1.25em;
+    }
+.dynamicFiltering > div {
+    margin: 0;
+    border: 1px solid #e6e6e6;
+    padding: 0;
+    box-sizing: border-box;
+    background-color: #e6e6e6;
+    position: absolute;
+    cursor: pointer;
+    }
+.dynamicFiltering > div:not(:first-child) {
+    border-left: 1px solid white !important;
+    }
+.dynamicFiltering > div:nth-of-type(1) {
+    left: 0;
+    width: 7%;
+    height: 100%;
+    }
+.dynamicFiltering > div:nth-of-type(2) {
+    left: 7%;
+    width: 18%;
+    height: 100%;
+    }
+.dynamicFiltering > div:nth-of-type(3) {
+    left: 25%;
+    width: 25%;
+    height: 100%;
+    }
+.dynamicFiltering > div:nth-of-type(4) {
+    left: 50%;
+    width: 25%;
+    height: 100%;
+    }
+.dynamicFiltering > div:nth-of-type(5) {
+    left: 75%;
+    width: 25%;
+    height: 100%;
+    }
+.dynamicFiltering > div:nth-of-type(6) {
+    left: 0;
+    width: 50%;
+    }
+.dynamicFiltering > div:nth-of-type(7) {
+    left: 50%;
+    width: 50%;
+    }
+.dynamicFiltering > div.label {
+    margin: 0;
+    border: 0;
+    padding: 0;
+    pointer-events: none;
+    color: black;
+    opacity: 0.2;
+    font: 12px monospace;
+    text-align: center;
+    top: 50%;
+    -webkit-transform: translateY(-50%);
+    transform: translateY(-50%);
+    background-color: transparent;
+    }
+.dynamicFiltering > div.blocked {
+    border-color: #fbb;
+    background-color: #fbb;
+    }
+.dynamicFiltering > div.ownFilter {
+    border-color: #bbb;
+    background-color: #bbb;
+    }
+.dynamicFiltering > div.blocked.ownFilter {
+    border-color: #f66;
+    background-color: #f66;
+    }
diff --git a/src/css/whitelist.css b/src/css/whitelist.css
new file mode 100644
index 0000000..96030cd
--- /dev/null
+++ b/src/css/whitelist.css
@@ -0,0 +1,16 @@
+div > p:first-child {
+    margin-top: 0;
+    }
+div > p:last-child {
+    margin-bottom: 0;
+    }
+#whitelist {
+    font-size: smaller;
+    width: 48em;
+    height: 40em;
+    white-space: nowrap;
+	text-align: left;
+    }
+#whitelist.bad {
+    background-color: #fee;
+    }