diff --git a/3p-filters.html b/3p-filters.html
index 4fd212d3a..aabf63c19 100644
--- a/3p-filters.html
+++ b/3p-filters.html
@@ -5,112 +5,7 @@
HTTP Switchboard — Ubiquitous rules
-
+
diff --git a/css/3p-filters.css b/css/3p-filters.css
new file mode 100644
index 000000000..9cc4d21ce
--- /dev/null
+++ b/css/3p-filters.css
@@ -0,0 +1,128 @@
+div > p:first-child {
+ margin-top: 0;
+ }
+div > p:last-child {
+ margin-bottom: 0;
+ }
+ul#lists {
+ margin: 0.5em 0 0 0;
+ padding-__MSG_@@bidi_end_edge__: 0em;
+ padding-__MSG_@@bidi_start_edge__: 1em;
+ }
+ul {
+ padding: 0;
+ list-style-type: none;
+ }
+ul#lists > li {
+ margin: 0.5em 0 0 0;
+ padding: 0;
+ font-size: 15px;
+ list-style-type: none;
+ }
+ul > li > ul {
+ margin: 0.25em 0 0 0;
+ }
+ul > li > ul > li {
+ font-size: 14px;
+ margin: 0 0 0 1em;
+ }
+.dim {
+ opacity: 0.5;
+ }
+/* I designed the button with: http://charliepark.org/bootstrap_buttons/ */
+button.reloadAll {
+ border: 1px solid transparent;
+ border-radius: 3px;
+ border-color: #dddddd #dddddd hsl(36, 0%, 85%);
+ padding: 5px;
+ background-color: hsl(36, 0%, 72%);
+ background-repeat: repeat-x;
+ background-image: linear-gradient(#f2f2f2, #dddddd);
+ color: #aaa;
+ }
+button.reloadAll.enabled {
+ border-color: #ffcc7f #ffcc7f hsl(36, 100%, 73%);
+ color: #222;
+ background-color: hsl(36, 100%, 75%);
+ background-image: linear-gradient(#ffdca8, #ffcc7f);
+ cursor: pointer;
+ opacity: 0.8;
+ }
+button.reloadAll:hover {
+ opacity: 1.0;
+ }
+#buttonApply {
+ display: none;
+ position: fixed;
+ top: 1em;
+
+ __MSG_@@bidi_end_edge__: 1em;
+ }
+#buttonApply.enabled {
+ display: initial;
+ }
+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%);
+ }
+#externalLists {
+ font-size: smaller;
+ width: 48em;
+ height: 8em;
+ white-space: nowrap;
+
+ text-align: left;
+ }
+body #loadingOverlay {
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ background-color: white;
+ opacity: 0.5;
+ cursor: wait;
+ display: none;
+ z-index: 1000;
+ }
+body.loading #loadingOverlay {
+ display: block;
+ }
+
+
+li.listDetails {
+ width: 100%;
+ margin: 0 auto 0 auto;
+ unicode-bidi: bidi-override;
+ 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;
+ }
+#ExternalListDiv {
+ margin: 2em auto 0 auto;
+ margin-__MSG_@@bidi_start_edge__: 2em;
+ }
diff --git a/css/dashboard-common.css b/css/dashboard-common.css
index 4e9d8ffb3..285cfdcfc 100644
--- a/css/dashboard-common.css
+++ b/css/dashboard-common.css
@@ -32,34 +32,6 @@ a {
-body ul.lists {
- padding-__MSG_@@bidi_end_edge__: 0em !important;
- padding-__MSG_@@bidi_start_edge__: 1em !important;
- }
-li.listDetails {
- float: __MSG_@@bidi_start_edge__;
- position: static;
- width: 100%;
- margin: 0 auto 0 auto !important;
- margin-__MSG_@@bidi_start_edge__: 1em !important;
- margin-__MSG_@@bidi_end_edge__: 0em !important;
- }
-li.listDetails input[type="checkbox"] {
- float: __MSG_@@bidi_start_edge__;
- }
-.listDetails a {
- float: __MSG_@@bidi_start_edge__;
- }
-#buttonApply {
- __MSG_@@bidi_end_edge__: 1em;
- }
-#ExternalListDiv {
- margin: 2em auto 0 auto;
- margin-__MSG_@@bidi_start_edge__: 2em !important;
- }
-#externalLists {
- text-align: left;
- }
.userFilters {
text-align: left;
}
diff --git a/js/3p-filters.js b/js/3p-filters.js
index cbcf3f7e6..344379ad4 100644
--- a/js/3p-filters.js
+++ b/js/3p-filters.js
@@ -79,25 +79,29 @@ var renderBlacklists = function() {
if ( !blacklistTitle ) {
return blacklistHref;
}
+ return blacklistTitle;
+ };
+
+ // Assemble a pretty blacklist name if possible
+ var htmlFromHomeURL = function(blacklistHref) {
if ( blacklistHref.indexOf('assets/thirdparties/') !== 0 ) {
- return blacklistTitle;
+ return '';
}
var matches = blacklistHref.match(/^assets\/thirdparties\/([^\/]+)/);
if ( matches === null || matches.length !== 2 ) {
- return blacklistTitle;
+ return '';
}
var hostname = matches[1];
var domain = µb.URI.domainFromHostname(hostname);
if ( domain === '' ) {
- return blacklistTitle;
+ return '';
}
var html = [
- blacklistTitle,
- ' (',
+ '" target="_blank">(',
domain,
- ')'
+ ')'
];
return html.join('');
};
@@ -122,10 +126,11 @@ var renderBlacklists = function() {
var listEntryTemplate = [
'',
'',
- ' ',
+ ' ',
'',
'{{name}}',
- '',
+ '\u200E',
+ '{{homeURL}}',
': ',
'',
listStatsTemplate,
@@ -139,6 +144,7 @@ var renderBlacklists = function() {
.replace('{{checked}}', list.off ? '' : 'checked')
.replace('{{URL}}', encodeURI(listKey))
.replace('{{name}}', htmlFromListName(list.title, listKey))
+ .replace('{{homeURL}}', htmlFromHomeURL(listKey))
.replace('{{used}}', !list.off && !isNaN(+list.entryUsedCount) ? renderNumber(list.entryUsedCount) : '0')
.replace('{{total}}', !isNaN(+list.entryCount) ? renderNumber(list.entryCount) : '?');
html.push(listEntry);