This commit is contained in:
Mikey1993 2014-08-23 20:12:16 +03:00
commit 6bf166169a
4 changed files with 144 additions and 143 deletions

View file

@ -5,112 +5,7 @@
<title>HTTP Switchboard — Ubiquitous rules</title> <title>HTTP Switchboard — Ubiquitous rules</title>
<link rel="stylesheet" type="text/css" href="css/common.css"> <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/dashboard-common.css">
<style> <link rel="stylesheet" type="text/css" href="css/3p-filters.css">
div > p:first-child {
margin-top: 0;
}
div > p:last-child {
margin-bottom: 0;
}
body > ul {
margin: 0.5em 0 0 0;
padding-left: 1em;
padding-right: 1em;
}
ul {
padding: 0;
list-style-type: none;
}
ul > 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 {
color: #888;
}
/* 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%) !important;
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%) !important;
background-image: linear-gradient(#ffdca8, #ffcc7f);
cursor: pointer;
opacity: 0.8;
}
button.reloadAll:hover {
opacity: 1.0;
}
#buttonApply {
display: none;
position: fixed;
top: 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;
}
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;
}
</style>
</head> </head>
<body> <body>

128
css/3p-filters.css Normal file
View file

@ -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;
}

View file

@ -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 { .userFilters {
text-align: left; text-align: left;
} }

View file

@ -79,25 +79,29 @@ var renderBlacklists = function() {
if ( !blacklistTitle ) { if ( !blacklistTitle ) {
return blacklistHref; return blacklistHref;
} }
return blacklistTitle;
};
// Assemble a pretty blacklist name if possible
var htmlFromHomeURL = function(blacklistHref) {
if ( blacklistHref.indexOf('assets/thirdparties/') !== 0 ) { if ( blacklistHref.indexOf('assets/thirdparties/') !== 0 ) {
return blacklistTitle; return '';
} }
var matches = blacklistHref.match(/^assets\/thirdparties\/([^\/]+)/); var matches = blacklistHref.match(/^assets\/thirdparties\/([^\/]+)/);
if ( matches === null || matches.length !== 2 ) { if ( matches === null || matches.length !== 2 ) {
return blacklistTitle; return '';
} }
var hostname = matches[1]; var hostname = matches[1];
var domain = µb.URI.domainFromHostname(hostname); var domain = µb.URI.domainFromHostname(hostname);
if ( domain === '' ) { if ( domain === '' ) {
return blacklistTitle; return '';
} }
var html = [ var html = [
blacklistTitle, ' <a href="http://',
' <i>(<a href="http://',
hostname, hostname,
'" target="_blank">', '" target="_blank">(',
domain, domain,
'</a>)</i>' ')</a>'
]; ];
return html.join(''); return html.join('');
}; };
@ -122,10 +126,11 @@ var renderBlacklists = function() {
var listEntryTemplate = [ var listEntryTemplate = [
'<li class="listDetails">', '<li class="listDetails">',
'<input type="checkbox" {{checked}}>', '<input type="checkbox" {{checked}}>',
'&thinsp;', ' ',
'<a href="{{URL}}" type="text/plain">', '<a href="{{URL}}" type="text/plain">',
'{{name}}', '{{name}}',
'</a>', '\u200E</a>',
'{{homeURL}}',
': ', ': ',
'<span class="dim">', '<span class="dim">',
listStatsTemplate, listStatsTemplate,
@ -139,6 +144,7 @@ var renderBlacklists = function() {
.replace('{{checked}}', list.off ? '' : 'checked') .replace('{{checked}}', list.off ? '' : 'checked')
.replace('{{URL}}', encodeURI(listKey)) .replace('{{URL}}', encodeURI(listKey))
.replace('{{name}}', htmlFromListName(list.title, listKey)) .replace('{{name}}', htmlFromListName(list.title, listKey))
.replace('{{homeURL}}', htmlFromHomeURL(listKey))
.replace('{{used}}', !list.off && !isNaN(+list.entryUsedCount) ? renderNumber(list.entryUsedCount) : '0') .replace('{{used}}', !list.off && !isNaN(+list.entryUsedCount) ? renderNumber(list.entryUsedCount) : '0')
.replace('{{total}}', !isNaN(+list.entryCount) ? renderNumber(list.entryCount) : '?'); .replace('{{total}}', !isNaN(+list.entryCount) ? renderNumber(list.entryCount) : '?');
html.push(listEntry); html.push(listEntry);