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);