I2PSnark changes:

- Make DHT debug section collapsible
- Tooltips for downloading/finished torrents
- Download bars for torrents, torrent parts and peer downloads
- Friendlier date format (with completed: <date> tooltip for finished torrents)
This commit is contained in:
str4d
2017-05-20 07:26:19 +00:00
parent 81b8b18581
commit 2b82312b77
14 changed files with 1592 additions and 542 deletions

View File

@ -725,8 +725,14 @@ public class I2PSnarkServlet extends BasicServlet {
if (showDebug) { if (showDebug) {
out.write("</tr>\n<tr class=\"dhtDebug\">"); out.write("</tr>\n<tr class=\"dhtDebug\">");
out.write("<th colspan=\"11\">"); out.write("<th colspan=\"11\">");
out.write("<div id=\"dhtDebugPanel\">");
out.write("<input class=\"toggle_input\" id=\"toggle_debug\" type=\"checkbox\"><label class=\"toggleview\" for=\"toggle_debug\">");
out.write(toThemeImg("debug"));
out.write(' ');
out.write(_t("Dht Debug"));
out.write("</label><div id=\"dhtDebugInner\">");
out.write(dht.renderStatusHTML()); out.write(dht.renderStatusHTML());
out.write("</th>"); out.write("</div></div></th>");
} }
} }
out.write("</tr></tfoot>\n"); out.write("</tr></tfoot>\n");
@ -1710,10 +1716,26 @@ public class I2PSnarkServlet extends BasicServlet {
out.write(DataHelper.formatDuration2(Math.max(remainingSeconds, 10) * 1000)); // (eta 6h) out.write(DataHelper.formatDuration2(Math.max(remainingSeconds, 10) * 1000)); // (eta 6h)
out.write("</td>\n\t"); out.write("</td>\n\t");
out.write("<td align=\"right\" class=\"snarkTorrentDownloaded\">"); out.write("<td align=\"right\" class=\"snarkTorrentDownloaded\">");
if (remaining > 0) if (remaining > 0) {
long percent = 100 * (total - remaining) / total;
out.write("<div class=\"percentBarOuter\">");
out.write("<div class=\"percentBarInner\" style=\"width: " + percent + "%;\">");
out.write("<div class=\"percentBarText\" tabindex=\"0\" title=\"");
out.write(percent + "% " + _t("complete") + " - " + DataHelper.formatSize2(remaining) + "B " + _t("remaining"));
out.write("\">");
out.write(formatSize(total-remaining) + thinsp(noThinsp) + formatSize(total)); out.write(formatSize(total-remaining) + thinsp(noThinsp) + formatSize(total));
else if (remaining == 0) out.write("</div></div></div>");
} else if (remaining == 0) {
// needs locale configured for automatic translation
SimpleDateFormat fmt = new SimpleDateFormat("HH:mm, EEE dd MMM yyyy");
fmt.setTimeZone(SystemVersion.getSystemTimeZone(_context));
long[] dates = _manager.getSavedAddedAndCompleted(snark);
String date = fmt.format(new Date(dates[1]));
out.write("<div class=\"percentBarComplete\" title=\"");
out.write(_t("Completed") + ": " + date + "\">");
out.write(formatSize(total)); // 3GB out.write(formatSize(total)); // 3GB
out.write("</div>");
}
//else //else
// out.write("??"); // no meta size yet // out.write("??"); // no meta size yet
out.write("</td>\n\t"); out.write("</td>\n\t");
@ -1825,7 +1847,7 @@ public class I2PSnarkServlet extends BasicServlet {
continue; continue;
out.write("<tr class=\"peerinfo " + rowClass + "\"><td title=\""); out.write("<tr class=\"peerinfo " + rowClass + "\"><td title=\"");
out.write(_t("Peer attached to swarm")); out.write(_t("Peer attached to swarm"));
out.write("\"></td><td colspan=\"4\" align=\"right\">"); out.write("\"></td><td colspan=\"4\">");
PeerID pid = peer.getPeerID(); PeerID pid = peer.getPeerID();
String ch = pid != null ? pid.toString().substring(0, 4) : "????"; String ch = pid != null ? pid.toString().substring(0, 4) : "????";
String client; String client;
@ -1867,7 +1889,10 @@ public class I2PSnarkServlet extends BasicServlet {
String ps = String.valueOf(pct); String ps = String.valueOf(pct);
if (ps.length() > 5) if (ps.length() > 5)
ps = ps.substring(0, 5); ps = ps.substring(0, 5);
out.write(ps + "%"); out.write("<div class=\"percentBarOuter\">");
out.write("<div class=\"percentBarInner\" style=\"width:" + ps + "%;\">");
out.write("<div class=\"percentBarText\" tabindex=\"0\">" + ps + "%</div>");
out.write("</div></div>");
} }
} else { } else {
pct = (float) 101.0; pct = (float) 101.0;
@ -2907,10 +2932,6 @@ public class I2PSnarkServlet extends BasicServlet {
if (announce != null) { if (announce != null) {
announce = DataHelper.stripHTML(announce); announce = DataHelper.stripHTML(announce);
buf.append("<tr><td>"); buf.append("<tr><td>");
String trackerLink = getTrackerLink(announce, snark.getInfoHash());
if (trackerLink != null)
buf.append(trackerLink);
else
toThemeImg(buf, "details"); toThemeImg(buf, "details");
buf.append("</td><td><b>").append(_t("Primary Tracker")).append(":</b> "); buf.append("</td><td><b>").append(_t("Primary Tracker")).append(":</b> ");
buf.append(getShortTrackerLink(announce, snark.getInfoHash())); buf.append(getShortTrackerLink(announce, snark.getInfoHash()));
@ -2920,7 +2941,7 @@ public class I2PSnarkServlet extends BasicServlet {
if (alist != null && !alist.isEmpty()) { if (alist != null && !alist.isEmpty()) {
buf.append("<tr><td>"); buf.append("<tr><td>");
toThemeImg(buf, "details"); toThemeImg(buf, "details");
buf.append("</td><td valign=\"top\"><b>") buf.append("</td><td><b>")
.append(_t("Tracker List")).append(":</b> "); .append(_t("Tracker List")).append(":</b> ");
for (List<String> alist2 : alist) { for (List<String> alist2 : alist) {
buf.append('['); buf.append('[');
@ -2951,7 +2972,8 @@ public class I2PSnarkServlet extends BasicServlet {
.append("</td></tr>\n"); .append("</td></tr>\n");
} }
long dat = meta.getCreationDate(); long dat = meta.getCreationDate();
SimpleDateFormat fmt = new SimpleDateFormat("yyyy-MM-dd HH:mm"); // needs locale configured for automatic translation
SimpleDateFormat fmt = new SimpleDateFormat("HH:mm, EEEE dd MMMM yyyy");
fmt.setTimeZone(SystemVersion.getSystemTimeZone(_context)); fmt.setTimeZone(SystemVersion.getSystemTimeZone(_context));
if (dat > 0) { if (dat > 0) {
String date = fmt.format(new Date(dat)); String date = fmt.format(new Date(dat));
@ -3306,19 +3328,21 @@ public class I2PSnarkServlet extends BasicServlet {
status = toImg("cancel") + ' ' + _t("File not found in torrent?"); status = toImg("cancel") + ' ' + _t("File not found in torrent?");
} else if (remaining == 0 || length <= 0) { } else if (remaining == 0 || length <= 0) {
complete = true; complete = true;
status = toImg("tick") + ' ' + _t("Complete"); status = "<div class=\"priorityIndicator\">" + toImg("tick") + "</div>" + _t("Complete");
} else { } else {
priority = fai.priority; priority = fai.priority;
if (priority < 0) if (priority < 0)
status = toImg("cancel"); status = "<div class=\"priorityIndicator\">" + toImg("cancel") + "</div>";
else if (priority == 0) else if (priority == 0)
status = toImg("clock"); status = "<div class=\"priorityIndicator\">" + toImg("clock") + "</div>";
else else
status = toImg("clock_red"); status = "<div class=\"priorityIndicator\">" + toImg("clock_red") + "</div>";
status += " " + long percent = 100 * (length - remaining) / length;
("<span class=\"percentDownloaded\" title=\"") + _t("Percentage of file downloaded") + ("\">") + status += " <div class=\"percentBarOuter\">" +
(100 * (length - remaining) / length) + "% " + ("</span><span class=\"dirInfoComplete\">") + _t("complete") + ("</span>") + "<div class=\"percentBarInner\" style=\"width: " +
" (" + DataHelper.formatSize2(remaining) + "B " + _t("remaining") + ")"; percent + "%;\"><div class=\"percentBarText\" tabindex=\"0\" title=\"" +
DataHelper.formatSize2(remaining) + "B " + _t("remaining") +
"\">" + percent + "%</div></div></div>";
} }
} }

View File

@ -1,3 +1,10 @@
2017-05-20 str4d
* i2psnark:
- Make DHT debug section collapsible
- Tooltips for downloading/finished torrents
- Download bars for torrents, torrent parts and peer downloads
- Friendlier date format (with completed: <date> tooltip for finished torrents)
2017-05-19 zzz 2017-05-19 zzz
* Console: Move /peers page rendering from router to console (ticket #1879) * Console: Move /peers page rendering from router to console (ticket #1879)
* i2psnark: Add ut_comment UI and per-torrent configuration * i2psnark: Add ut_comment UI and per-torrent configuration

Binary file not shown.

After

Width:  |  Height:  |  Size: 668 B

View File

@ -39,6 +39,12 @@ body.iframed {
outline: none; outline: none;
} }
.toggleview, .snarkConfigTitle, .snarknavbar, img, input[type="image"] {
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}
.page { .page {
font-size: 9pt !important; font-size: 9pt !important;
line-height: 160% !important; line-height: 160% !important;
@ -333,15 +339,6 @@ table.snarkTorrents {
margin-top: -1px !important; margin-top: -1px !important;
} }
.snarkTorrents th {
text-align: left;
}
.snarkTorrents td {
line-height: 90%;
text-align: left;
}
.snarkTorrents td:nth-child(1) { .snarkTorrents td:nth-child(1) {
width: 24px !important; width: 24px !important;
} }
@ -349,8 +346,8 @@ table.snarkTorrents {
.snarkTorrents td:nth-child(3), .snarkTorrents td:nth-child(3),
.snarkTorrents td:nth-child(4) { .snarkTorrents td:nth-child(4) {
width: 16px !important; width: 16px !important;
padding: 0 !important;
text-align: center !important; text-align: center !important;
font-weight: bold;
} }
pre { pre {
@ -386,8 +383,8 @@ thead {
border-bottom: 1px solid #101; border-bottom: 1px solid #101;
} }
tfoot th { tfoot tr:first-child th {
padding-bottom: 4px !important; vertical-align: middle !important;
} }
tfoot tr:nth-child(n+1) { tfoot tr:nth-child(n+1) {
@ -435,9 +432,15 @@ tfoot:nth-child(4) img {
padding-right: 0 !important; padding-right: 0 !important;
} }
/*
tfoot tr:nth-child(n+1) { tfoot tr:nth-child(n+1) {
text-align: left; text-align: left;
} }
*/
.snarkTorrents tfoot tr:first-child {
line-height: 130%;
}
.headerstatus { .headerstatus {
text-align: left; text-align: left;
@ -504,13 +507,8 @@ tfoot tr:nth-child(n+1) {
white-space: nowrap; white-space: nowrap;
} }
.snarkTorrents tfoot th { .snarkTorrents tfoot tr:first-child th {
vertical-align: top; vertical-align: middle;
font-weight: normal;
}
.snarkTorrents tfoot th::first-line {
font-weight: bold;
} }
.snarkTorrents tfoot th br { .snarkTorrents tfoot th br {
@ -534,7 +532,6 @@ table.snarkTorrents {
} }
.snarkTorrents td { .snarkTorrents td {
line-height: 105%;
text-align: left; text-align: left;
} }
@ -542,13 +539,6 @@ table.snarkTorrents {
width: 24px !important; width: 24px !important;
} }
.snarkTorrents td:nth-child(3),
.snarkTorrents td:nth-child(4) {
width: 16px !important;
padding: 0 !important;
text-align: center !important;
}
.snarkTorrents td:nth-child(3) { .snarkTorrents td:nth-child(3) {
text-align: right !important; text-align: right !important;
} }
@ -772,16 +762,6 @@ td.subHeaderPriority {
padding: 4px !important; padding: 4px !important;
} }
/*
.headerstatus {
min-width: 250px;
}
td.priority:last-child {
min-width: 350px !important;
}
*/
tr.priority:last-child { tr.priority:last-child {
border-bottom: none !important; border-bottom: none !important;
} }
@ -790,21 +770,22 @@ th.headerdownloaded {
padding-left: 25px !important; padding-left: 25px !important;
} }
td.snarkFileStatus { .snarkFileStatus {
text-align: center; text-align: center;
white-space:nowrap; white-space:nowrap;
width: 120px;
} }
td.snarkFileIcon { .snarkFileIcon {
width: 16px; width: 16px;
padding: 0; padding: 0;
} }
td.snarkFileIcon img { .snarkFileIcon img {
filter: none; filter: none;
} }
td.snarkFileStatusIcon { .snarkFileStatusIcon {
width: 24px; width: 24px;
padding: 0 4px 0 0; padding: 0 4px 0 0;
text-align: center; text-align: center;
@ -814,7 +795,7 @@ td.snarkFileStatusIcon {
td { td {
font-size: 9pt; font-size: 9pt;
padding: 1px; padding: 2px;
opacity: 1; opacity: 1;
color: #333 !important; color: #333 !important;
} }
@ -912,9 +893,7 @@ td.snarkTorrentAction {
} }
.snarkTorrentstatus { .snarkTorrentstatus {
line-height: 90%;
min-width: 0; min-width: 0;
padding: 2px 2px 2px 0;
} }
.snarkTorrentStatus { .snarkTorrentStatus {
@ -951,9 +930,6 @@ td.snarkTorrentAction {
.snarkTorrentRateDown, .snarkTorrentRateDown,
.snarkTorrentDownloaded, .snarkTorrentDownloaded,
.snarkTorrentUploaded { .snarkTorrentUploaded {
font-size: 8pt;
line-height: 90%;
padding: 0 3px;
} }
.snarkTorrentRateUp, .snarkTorrentRateUp,
@ -963,14 +939,8 @@ td.snarkTorrentAction {
text-align: center !important; text-align: center !important;
} }
td.snarkTorrentDownloaded { .snarkTorrentDownloaded {
font-weight: bold; font-weight: bold;
width: 110px;
padding: 0 5px;
}
.snarkTorrents img {
padding: 4px 3px !important;
} }
.snarkTorrents th img { .snarkTorrents th img {
@ -978,8 +948,9 @@ td.snarkTorrentDownloaded {
max-height: 22px; max-height: 22px;
} }
.snarkTorrents tfoot th { .snarkTorrents tfoot tr:first-child th {
padding: 6px 4px !important; padding: 6px 4px !important;
vertical-align: middle;
} }
.snarkTorrents tr:hover, .snarkDirInfo tr:hover { .snarkTorrents tr:hover, .snarkDirInfo tr:hover {
@ -987,6 +958,10 @@ td.snarkTorrentDownloaded {
background: linear-gradient(to bottom, #fff 0%, #ffe 100%) !important; background: linear-gradient(to bottom, #fff 0%, #ffe 100%) !important;
} }
tr:hover .percentBarText {
opacity: 0.75;
}
.snarkTorrentEven { .snarkTorrentEven {
background: #eef; background: #eef;
} }
@ -1041,13 +1016,15 @@ td.snarkTorrentDownloaded {
font-weight: normal; font-weight: normal;
padding: 4px 2px; padding: 4px 2px;
color: #0c153d !important; color: #0c153d !important;
width: 1%;
white-space: nowrap;
} }
.snarkFileStatus { .snarkFileStatus {
font-size: 9pt; font-size: 9pt;
font-style: italic; font-style: italic;
min-width: 220px; min-width: 220px;
padding: 4px 5px 4px 15px; padding: 4px;
text-align: center; text-align: center;
text-align: left !important; text-align: left !important;
} }
@ -1056,51 +1033,79 @@ td.snarkTorrentDownloaded {
font-style: italic; font-style: italic;
} }
/* /* download bars */
div.percentBarOuter {
background: #fff !important; .snarkTorrentDownloaded {
border: 1px solid #9f9; text-align: center !important;
border-bottom: 1px solid #474; width: 110px;
border-right: 1px solid #474;
border-radius: 0;
float: left;
box-shadow: none;
opacity: 1;
} }
div.percentBarInner { .snarkDirInfo .snarkFileStatus img {
float: left;
margin: 0 10px 0 7px;
}
.snarkDirInfo td {
padding-top: 6px !important;
padding-bottom: 6px !important;
}
.percentBarOuter {
background: #eef;
background: repeating-linear-gradient(135deg, #eef 1px, #eef 5px, #ddf 6px, #ddf 11px);
border: 1px solid #99f;
box-shadow: 0 0 1px 0 rgba(196,196,196,0.8);
margin: 0 auto;
}
.snarkTorrentDownloaded .percentBarOuter {
margin-left: 5px;
}
.peerinfo .percentBarOuter {
filter: saturate(0.5);
}
.percentBarInner {
border: none; border: none;
height: 14px; height: 14px;
background: #1c943a; background: #bbf;
background: linear-gradient(to bottom, #1c943a 0%, #092f10 50%, #0d2707 50%, #091b05 50%, #091503 100%); background: linear-gradient(to bottom, #fff 0%, #eef 50%, #ddf 50%, #bbf 100%);
} box-shadow: inset 0 0 0 1px #ddf;
opacity: 0.8;
div.percentBarInner.percentBarComplete {
background: #eef;
background: linear-gradient(to bottom, #eef 0%, #002200 52%, #000000 52%, #eef 100%);
} }
.percentBarText, .percentBarOuter { .percentBarText, .percentBarOuter {
width: 110px;
text-align: center; text-align: center;
height: 14px; vertical-align: middle;
top: 0; }
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter, .peerinfo .percentBarText, .peerinfo .percentBarOuter {
width: 80px; width: 80px;
display: inline-block;
} }
.percentBarText { .percentBarText {
text-align: center; text-align: center;
font-weight: bold; font-weight: bold !important;
line-height: 140%; white-space: nowrap;
text-shadow: 0 1px 1px #000; color: #005;
text-shadow: 0 0 1px rgba(255,255,255,0.5);
opacity: 0;
transition: ease opacity 0.3s 0.5s;
line-height: 14px;
} }
.snarkTorrentDownloaded .percentBarText, .snarkTorrentDownloaded .percentBarOuter { .percentBarText:hover, .percentBarText:focus {
width: 110px !important; opacity: 0.75;
word-spacing: -0.2em; transition: ease opacity 0.3s;
font-size: 7.5pt;
} }
*/ .priorityIndicator {
}
/* end download bars */
.choked, .choked a:hover { .choked, .choked a:hover {
color: #900 !important; color: #900 !important;
@ -1209,9 +1214,9 @@ _:-ms-lang(x), .snarkConfigTitle, label.toggleview, .configsectionpanel .snarkCo
padding-left: 5px; padding-left: 5px;
} }
#bwHelp a { #configs a {
font-style: normal;
font-weight: bold; font-weight: bold;
margin-left: 3px;
} }
form { form {
@ -1232,26 +1237,6 @@ hr {
background: #444; background: #444;
} }
hr.debug {
width: 100%;
background: #89f;
background: linear-gradient(to right, #89f 40%, #eef);
}
hr.debug + hr {
margin-bottom: -5px;
}
hr.debug:nth-child(n+7) {
margin: -10px 0 3px;
}
hr.debug:last-child {
height: 0;
margin-bottom: -5px;
margin-top: -15px;
}
a:link { a:link {
font-weight: normal; font-weight: normal;
text-decoration: none; text-decoration: none;
@ -1375,7 +1360,7 @@ input[type="text"], textarea {
a.control { a.control {
vertical-align: middle; vertical-align: middle;
text-align: left; text-align: left;
padding: 2px 5px 1px 3px !important; padding: 2px 8px 1px 3px !important;
display: inline-block; display: inline-block;
margin: -1px 0 1px 5px; margin: -1px 0 1px 5px;
min-width: 0 !important; min-width: 0 !important;
@ -1387,8 +1372,14 @@ a.control:hover, a.control:focus {
border: 1px solid #89f; border: 1px solid #89f;
} }
a.control:active img {
mix-blend-mode: luminosity;
}
a.control img { a.control img {
margin: 0 !important; margin: 0 !important;
height: 14px;
width: 14px;
} }
.script { .script {
@ -1548,6 +1539,12 @@ select {
} }
} }
select[disabled], select[disabled]:hover {
background: url(images/dropdown.png) right center no-repeat, linear-gradient(to bottom, #fff 0%, #ddd 100%) !important;
opacity: 0.7;
cursor: not-allowed;
}
select::-ms-expand { select::-ms-expand {
display: none; display: none;
} }
@ -1589,6 +1586,7 @@ img:hover {
padding: 5px !important; padding: 5px !important;
opacity: 0.7; opacity: 0.7;
border: 1px solid #349 !important; border: 1px solid #349 !important;
border-radius: 2px;
background: #fff; background: #fff;
background: linear-gradient(to bottom, #fff 0%, #fff 50%, #ddf 51%); background: linear-gradient(to bottom, #fff 0%, #fff 50%, #ddf 51%);
box-shadow: inset 0 0 1px 1px #fff; box-shadow: inset 0 0 1px 1px #fff;
@ -1808,6 +1806,10 @@ table.trackerconfig td:first-child {
vertical-align: middle; vertical-align: middle;
} }
#configs a {
font-weight: bold;
}
.configsectionpanel td[colspan="5"] { .configsectionpanel td[colspan="5"] {
border-top: 1px solid #89f; border-top: 1px solid #89f;
} }
@ -2070,6 +2072,88 @@ label.toggleview img:active, label.toggleview:active img, .snarkConfigTitle a:ac
text-shadow: 0 0 1px #fff; text-shadow: 0 0 1px #fff;
} }
/* debug panel */
#dhtdebugPanel {
background: linear-gradient(to bottom, #fff 0%, #eef 100%);
box-shadow: 0 0 2px 0 #ccc inset, 0 0 1px #bbb;
border: 1px solid #89f;
border-top: none;
text-align: center;
padding-bottom: 13px;
}
#dhtDebugInner {
text-align: left;
padding: 5px;
background: #efefff;
box-shadow: inset 0 0 0 1px #fff, 0 0 1px 0 rgba(160,160,160,0.5);
margin: -25px 0 -12px;
}
.dhtDebug th b:first-of-type, .dhtDebug th b:first-of-type + br + hr.debug {
display: none;
}
input#toggle_debug:not(checked) + label {
padding-bottom: 2px;
}
input#toggle_debug:not(checked) + label > img {
margin-right: -2px !important;
}
input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
.iframed input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
.iframed input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
/* end debug panel */
.dhtDebug th {
padding: 0 10px 8px !important;
word-break: break-all;
font-weight: normal;
background: #fff;
}
hr.debug:first-of-type {
background: transparent;
margin-bottom: -5px;
margin-top: -2px;
}
hr.debug {
width: 100%;
background: #89f;
background: linear-gradient(to right, #89f 40%, #eef);
}
hr.debug + hr {
margin-bottom: -5px;
}
hr.debug:nth-child(n+7) {
margin: -10px 0 3px;
}
hr.debug:last-child {
height: 0;
margin-bottom: -5px;
margin-top: -15px;
}
/* end debug */ /* end debug */
/* Resource Errors */ /* Resource Errors */
@ -2244,6 +2328,10 @@ b.alwaysShow {
font-weight: bold; font-weight: bold;
} }
.snarkTorrents .debuginfo td, .snarkTorrents .peerinfo td {
font-weight: normal;
}
td#bwHelp { td#bwHelp {
background: url(images/infocircle.png) left 10px center no-repeat; background: url(images/infocircle.png) left 10px center no-repeat;
background-size: 14px auto !important; background-size: 14px auto !important;
@ -2271,6 +2359,14 @@ body {
margin-top: -5px !important; margin-top: -5px !important;
} }
.snarkRefresh:link, .snarkRefresh:hover, .snarkRefresh:nth-child(n+1):hover, .snarkRefresh:focus, .snarkRefresh:nth-child(n+1):focus .snarkRefresh:active, .snarkRefresh:nth-child(n+1):active {
background-size: 14px 14px, 100% 100% !important;
}
.snarkRefresh:link:first-child {
padding-left: 22px !important;
}
.addtorrentsection, .newtorrentsection, .configsection, .configsectionpanel { .addtorrentsection, .newtorrentsection, .configsection, .configsectionpanel {
margin-top: 4px !important; margin-top: 4px !important;
margin-bottom: 4px !important; margin-bottom: 4px !important;
@ -2287,6 +2383,19 @@ table.SnarkDirInfo {
.dirInfoComplete { .dirInfoComplete {
display: none; display: none;
} }
.percentBarText, .percentBarOuter {
width: 100px;
line-height: 15px;
}
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter {
width: 60px;
}
#dhtDebugInner {
margin-top: -24px !important;
}
} }
@media screen and (max-width: 1200px) { @media screen and (max-width: 1200px) {
@ -2295,23 +2404,24 @@ table.SnarkDirInfo {
padding-bottom: 5px; padding-bottom: 5px;
} }
.snarkRefresh:link, .snarkRefresh:hover, .snarkRefresh:nth-child(n+1):hover, .snarkRefresh:focus, .snarkRefresh:nth-child(n+1):focus .snarkRefresh:active, .snarkRefresh:nth-child(n+1):active {
background-size: 14px 14px, 100% 100% !important;
}
.snarkRefresh:link:first-child {
padding-left: 22px !important;
}
#configs td:first-child::before { #configs td:first-child::before {
content: ""; content: "";
min-height: 30px; min-height: 30px;
} }
.percentBarText {
line-height: 16px;
}
.snarkTorrents tfoot tr:first-child {
line-height: 100%;
}
} }
@media screen and (max-width: 1400px) { @media screen and (max-width: 1400px) {
.snarkRefresh:link:first-child {
padding-left: 23px !important; .percentBarText {
line-height: 15px;
} }
} }
@ -2320,6 +2430,14 @@ body, th, td, table a, input, input[type="text"], input.r, input[name="nofilter_
font-size: 9pt !important; font-size: 9pt !important;
} }
.snarkRefresh {
font-size: 11pt !important;
}
.snarkRefresh:link {
padding-left: 25px !important;
}
.percentDownloaded { .percentDownloaded {
pointer-events: none; /* hide tooltip */ pointer-events: none; /* hide tooltip */
} }
@ -2330,14 +2448,6 @@ body, th, td, table a, input, input[type="text"], input.r, input[name="nofilter_
font-size: 10pt !important; font-size: 10pt !important;
} }
.snarkRefresh {
font-size: 11pt !important;
}
.snarkRefresh:link {
padding-left: 25px !important;
}
.snarkMessages li, .snarkTorrents tt { .snarkMessages li, .snarkTorrents tt {
font-size: 9pt; font-size: 9pt;
} }
@ -2349,7 +2459,6 @@ body, th, td, table a, input, input[type="text"], input.r, input[name="nofilter_
td.snarkTorrentDownloaded { td.snarkTorrentDownloaded {
white-space: nowrap; white-space: nowrap;
padding: 0 10px;
} }
.snarkConfigTitle, label.toggleview, .configsectionpanel .snarkConfigTitle, .configsectionpanel .snarkConfigTitle:hover { .snarkConfigTitle, label.toggleview, .configsectionpanel .snarkConfigTitle, .configsectionpanel .snarkConfigTitle:hover {

Binary file not shown.

After

Width:  |  Height:  |  Size: 668 B

View File

@ -63,6 +63,12 @@ body.iframed {
background: linear-gradient(to right, #000 0%, #020 50%, #000 100%); background: linear-gradient(to right, #000 0%, #020 50%, #000 100%);
} }
.toggleview, .snarkConfigTitle, .snarknavbar, img, input[type="image"] {
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}
::selection { ::selection {
background: #030 !important; background: #030 !important;
color: white; color: white;
@ -329,6 +335,7 @@ th {
white-space: nowrap; white-space: nowrap;
background: #000; background: #000;
background: linear-gradient(to bottom, #010, #000); background: linear-gradient(to bottom, #010, #000);
vertical-align: middle;
} }
thead th { thead th {
@ -369,7 +376,6 @@ tfoot tr:nth-child(n+1) {
.headerpriority { .headerpriority {
text-align: left; text-align: left;
padding-left: 10px;
} }
.ParentDir { .ParentDir {
@ -423,16 +429,15 @@ tfoot tr:nth-child(n+1) {
font-weight: normal; font-weight: normal;
} }
.snarkTorrents tfoot th::first-line {
font-weight: bold;
}
.snarkTorrents tfoot th:nth-child(3) { .snarkTorrents tfoot th:nth-child(3) {
text-align: center; text-align: center;
} }
.snarkTorrents tfoot th { .snarkTorrents tfoot tr:first-child th {
vertical-align: top; padding: 6px 4px !important;
vertical-align: middle;
font-weight: bold;
line-height: 140%;
} }
.snarkTorrents tfoot th br { .snarkTorrents tfoot th br {
@ -453,7 +458,7 @@ table.SnarkTorrents {
} }
.snarkTorrents td { .snarkTorrents td {
line-height: 110%; line-height: 120%;
text-align: left; text-align: left;
font-size: 8pt !important; font-size: 8pt !important;
} }
@ -491,6 +496,7 @@ table.SnarkTorrents {
font-size: 8pt; font-size: 8pt;
font-weight: bold; font-weight: bold;
display: inline-block; display: inline-block;
line-height: 120%;
} }
.snarkTorrentInfo img { .snarkTorrentInfo img {
@ -626,7 +632,6 @@ table.SnarkDirInfo {
.snarkDirInfo .headerpriority { .snarkDirInfo .headerpriority {
text-align: center !important; text-align: center !important;
vertical-align: middle; vertical-align: middle;
padding-right: 10px;
} }
td.subHeaderPriority, td.priority { td.subHeaderPriority, td.priority {
@ -655,7 +660,6 @@ td.subHeaderPriority {
} }
.headerstatus { .headerstatus {
min-width: 150px;
text-align: left; text-align: left;
padding-left: 18px; padding-left: 18px;
} }
@ -678,7 +682,7 @@ th.headerdownloaded {
padding-left: 3px; padding-left: 3px;
} }
td.snarkFileStatus { .snarkFileStatus {
text-align: left; text-align: left;
white-space: nowrap; white-space: nowrap;
} }
@ -699,6 +703,7 @@ td {
color: #ee9 !important; color: #ee9 !important;
opacity: 1; opacity: 1;
font-size: 9pt; font-size: 9pt;
vertical-align: middle;
} }
.mainsection td { .mainsection td {
@ -776,7 +781,6 @@ td.snarkTorrentStatus:nth-child(2) {
min-width: 48px; min-width: 48px;
font-weight: bold; font-weight: bold;
color: #dd9 !important; color: #dd9 !important;
font-size: 8pt;
padding: 1px !important; padding: 1px !important;
} }
@ -786,10 +790,8 @@ td.snarkTorrentStatus:nth-child(2) {
} }
.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded { .snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded {
font-size: 8pt;
padding: 0 3px; padding: 0 3px;
line-height: 90%; line-height: 90%;
word-spacing: -0.05em;
} }
.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded { .snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded {
@ -799,10 +801,8 @@ td.snarkTorrentStatus:nth-child(2) {
.snarkTorrentDownloaded { .snarkTorrentDownloaded {
color: #ee9 !important; color: #ee9 !important;
white-space: nowrap; white-space: nowrap;
}
td.snarkTorrentDownloaded {
font-weight: bold; font-weight: bold;
text-align: center;
} }
.snarkTorrentUploaded { .snarkTorrentUploaded {
@ -825,15 +825,15 @@ td.snarkTorrentDownloaded {
padding: 1px !important; padding: 1px !important;
} }
.snarkTorrents tfoot th {
padding: 6px 4px !important;
}
.snarkTorrents tr:hover, .snarkDirInfo tr:hover { .snarkTorrents tr:hover, .snarkDirInfo tr:hover {
background: #030 !important; background: #030 !important;
box-shadow: inset 0 0 1px 0 #494; box-shadow: inset 0 0 1px 0 #494;
} }
tr:hover .percentBarText {
opacity: 1;
}
/* MS Edge fix */ /* MS Edge fix */
_:-ms-lang(x), .snarkTorrents tr, .snarkTorrents tr:hover, .snarkDirInfo tr:hover { _:-ms-lang(x), .snarkTorrents tr, .snarkTorrents tr:hover, .snarkDirInfo tr:hover {
box-shadow: none !important; box-shadow: none !important;
@ -903,23 +903,24 @@ _:-ms-lang(x), .snarkTorrentOdd, .SnarkTorrentEven {
} }
.snarkFileName { .snarkFileName {
padding: 4px 0 !important; padding: 4px 5px 4px 0 !important;
text-align: left !important; text-align: left !important;
word-break: break-all;
} }
.snarkFileSize { .snarkFileSize {
padding: 4px 2px; padding: 4px 2px;
font-weight: normal; font-weight: normal;
color: #bb7 !important; color: #bb7 !important;
width: 1%;
white-space: nowrap;
} }
.snarkFileStatus { .snarkFileStatus {
padding: 4px 5px 4px 15px; padding-left: 15px;
text-align: center;
font-style: italic; font-style: italic;
font-size: 9pt;
text-align: left; text-align: left;
min-width: 220px; width: 130px;
} }
.snarkFileStatus img { .snarkFileStatus img {
@ -936,50 +937,85 @@ _:-ms-lang(x), .snarkTorrentOdd, .SnarkTorrentEven {
padding-right: 2px; padding-right: 2px;
} }
/* /* download bars */
div.percentBarOuter {
background: #000 !important; .snarkDirInfo .snarkFileStatus img {
border: 1px solid #9f9;
border-bottom: 1px solid #474;
border-right: 1px solid #474;
border-radius: 0;
float: left; float: left;
margin: 0 10px 0 7px;
}
.percentBarOuter {
background: #000;
background: repeating-linear-gradient(135deg, #000 1px, #000 5px, #010 6px, #010 11px);
border: 1px solid #040;
border-bottom: 1px solid #020;
border-right: 1px solid #020;
box-shadow: none; box-shadow: none;
opacity: 1; opacity: 1;
box-shadow: 0 0 1px 1px rgba(0,0,0,0.8);
margin: auto;
} }
div.percentBarInner { .snarkDirInfo .percentBarOuter {
border: none; float: left;
height: 14px;
background: #1c943a;
background: linear-gradient(to bottom, #1c943a 0%, #092f10 50%, #0d2707 50%, #091b05 50%, #091503 100%);
} }
div.percentBarInner.percentBarComplete { .percentBarInner {
background: #001100; height: 100%;
background: linear-gradient(to bottom, #001100 0%, #002200 52%, #000000 52%, #001100 100%); background: #0e5f00;
background: linear-gradient(to bottom, rgba(28, 148, 58, 0.6) 0%, rgba(9, 47, 16, 0.6) 50%, rgba(13, 39, 7, 0.6) 50%, rgba(9, 27, 5, 0.6) 50%, rgba(9, 21, 3, 0.6) 100%);
box-shadow: inset 0 0 0 1px #000;
} }
.percentBarText, .percentBarOuter { .percentBarText, .percentBarOuter {
width: 110px;
text-align: center; text-align: center;
height: 14px; vertical-align: middle;
top: 0; }
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter, .peerinfo .percentBarText, .peerinfo .percentBarOuter {
width: 80px; width: 80px;
} }
.percentBarText { .percentBarText {
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
line-height: 140%; padding: 1px 0;
text-shadow: 0 1px 1px #000; white-space: nowrap;
display: block;
color: #dfd137;
opacity: 0;
text-shadow: 0 0 1px rgba(0,0,0,0.8);
transition: ease opacity 0.3s 0.5s;
} }
.snarkTorrentDownloaded .percentBarText, .snarkTorrentDownloaded .percentBarOuter { .percentBarText:hover, .percentBarText:focus {
width: 110px !important; opacity: 0.75;
word-spacing: -0.2em; transition: ease opacity 0.3s;
font-size: 7.5pt;
} }
*/
.percentBarOuterComplete .percentBarText {
color: #ee9;
font-weight: normal;
opacity: 1;
}
.snarkDirInfo .percentBarOuterComplete .percentBarText {
text-align: left;
}
.percentBarOuterComplete, .percentBarComplete.percentBarInner {
border: 1px solid transparent;
background: none !important;
box-shadow: none !important;
}
.priorityIndicator {
width: 32px;
float: left;
}
/* end download bars */
.choked { .choked {
color: #f00000 !important; color: #f00000 !important;
@ -1007,12 +1043,11 @@ div.percentBarInner.percentBarComplete {
} }
.snarkAddInfo { .snarkAddInfo {
font-size: 9pt;
line-height: 135% !important;
font-weight: normal; font-weight: normal;
background: url(images/infocircle.png) left center no-repeat; background: url(images/infocircle.png) left center no-repeat;
background-size: 14px auto; background-size: 14px auto;
padding-left: 20px; padding-left: 20px;
line-height: 140%;
} }
.snarkConfigTitle, label.toggleview { .snarkConfigTitle, label.toggleview {
@ -1133,28 +1168,6 @@ hr {
text-align: center; text-align: center;
} }
hr.debug {
width: 100%;
background: #131;
background: linear-gradient(to right, #131 50%, #000700);
}
hr.debug + b {
color: #ff7;
text-transform: uppercase;
}
hr.debug:nth-child(n+7) {
margin-top: -11px;
margin-bottom: 2px;
opacity: 0.5;
}
hr.debug:last-child {
background: #000;
margin-bottom: -5px;
}
a:link { a:link {
color: #7c7; color: #7c7;
text-decoration: none; text-decoration: none;
@ -1265,7 +1278,7 @@ input[type="image"]:hover, a img:hover, input[type="image"]:focus, a:focus img {
outline: none; outline: none;
} }
.snarkTorrents th:last-child, .snarkTorrents td:last-child { .snarkTorrents thead th:last-child, .snarkTorrents td:last-child {
white-space: nowrap; white-space: nowrap;
} }
@ -1437,6 +1450,16 @@ select:hover, select:focus, select:active {
background: #000 url(images/dropdown_hover.png) right center no-repeat !important; background: #000 url(images/dropdown_hover.png) right center no-repeat !important;
} }
select[disabled], select[disabled]:hover {
background: #000 url(images/dropdown.png) right center no-repeat !important;
background: url(images/dropdown.png) right center no-repeat, linear-gradient(to bottom, #020 0%, #000 20%, #000 80%, #010 100%) !important;
border: 1px outset #191;
box-shadow: none;
color: #494 !important;
opacity: 0.7;
cursor: not-allowed;
}
select::-ms-expand { select::-ms-expand {
display: none; display: none;
} }
@ -1809,9 +1832,9 @@ table.trackerconfig td:first-child {
color: #ee9; color: #ee9;
box-shadow: inset 0 0 5px 2px #000; box-shadow: inset 0 0 5px 2px #000;
word-wrap: break-word; word-wrap: break-word;
font-weight: bold;
text-align: center; text-align: center;
background: #000 url(images/configuration.png) no-repeat scroll right center; background: #000 url(images/configuration.png) no-repeat scroll right center;
font-weight: bold;
background: linear-gradient(to bottom, #000 10%, rgba(0,40,0,0.3) 10%, rgba(0,15,0,0.5) 100%), url(/themes/console/dark/images/camotile2.png) top left repeat; background: linear-gradient(to bottom, #000 10%, rgba(0,40,0,0.3) 10%, rgba(0,15,0,0.5) 100%), url(/themes/console/dark/images/camotile2.png) top left repeat;
} }
@ -1928,9 +1951,16 @@ label.toggleview, .snarkConfigTitle a:visited {
background-size: 14px 14px; background-size: 14px 14px;
} }
.peerinfo td, .debuginfo td { .snarkTorrents .peerinfo td, .snarkTorrents .debuginfo td {
padding-top: 5px; padding-top: 2px !important;
padding-bottom: 5px; padding-bottom: 2px !important;;
}
.peerinfo td:first-child::before, .debuginfo td:first-child::before {
content: "";
display: inline-block;
min-height: 20px;
vertical-align: middle;
} }
/* debug */ /* debug */
@ -1982,6 +2012,93 @@ label.toggleview, .snarkConfigTitle a:visited {
color: #cc7; color: #cc7;
} }
.dhtdebug th {
word-break: break-all;
padding: 0 10px 10px !important;
}
/* debug panel */
#dhtdebugPanel {
background: linear-gradient(to right, #000, #010, #000);
border: 1px solid #494;
border-top: none;
box-shadow: inset 0 0 0 1px #000;
text-align: center;
padding-bottom: 13px;
}
#dhtDebugInner {
text-align: left;
padding: 5px;
background: #000;
margin: -23px 0 -12px;
}
.dhtDebug th b:first-of-type, .dhtDebug th b:first-of-type + br + hr.debug {
display: none;
}
input#toggle_debug:not(checked) + label {
padding-bottom: 2px;
}
input#toggle_debug:not(checked) + label > img {
margin-right: -2px !important;
}
input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
.iframed input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
.iframed input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
/* end debug panel */
hr.debug {
width: 100%;
background: #131;
background: linear-gradient(to right, #131 50%, #000700);
}
hr.debug + b {
color: #ff7;
text-transform: uppercase;
}
hr.debug:first-of-type {
background: transparent;
margin-bottom: -5px;
margin-top: -2px;
}
hr.debug + hr {
display: block;
background: transparent;
margin-bottom: -3px;
}
hr.debug:nth-child(n+7) {
margin-top: -11px;
margin-bottom: 2px;
opacity: 0.5;
}
hr.debug:last-child {
background: #000;
margin-bottom: -5px;
}
/* end debug */ /* end debug */
#totals { #totals {
@ -2032,14 +2149,7 @@ label.toggleview, .snarkConfigTitle a:visited {
/* configs */ /* configs */
#bwHelp i { #configs a {
display: inline-block;
vertical-align: middle;
}
#bwHelp a {
font-style: normal;
font-weight: bold; font-weight: bold;
} }
@ -2282,6 +2392,19 @@ b.alwaysShow {
#configs td:first-child { #configs td:first-child {
min-width: 200px !important; min-width: 200px !important;
} }
.snarkFileStatus {
width: 110px;
}
.snarkFileStatus img[src*="clock"] {
margin-top: 6px;
}
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter {
width: 60px;
padding: 0;
}
} }
@media screen and (max-width: 1200px) { @media screen and (max-width: 1200px) {
@ -2312,6 +2435,22 @@ td#bwHelp a {
#trackerselect a { #trackerselect a {
max-width: 300px; max-width: 300px;
} }
.percentBarOuter {
margin: 2px auto !important;
}
.percentBarText {
line-height: 130%;
}
.percentBarText, .percentBarOuter, .snarkTorrentDownloaded {
width: 100px;
}
.snarkFileStatus img[src*="clock"] {
margin-top: 4px;
}
} }
@media screen and (min-width: 1100px) { @media screen and (min-width: 1100px) {
@ -2325,8 +2464,8 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, code, textarea, input, input[ty
} }
.snarkTorrentInfo td, .snarkDirInfo td, .snarkTorrents .peerinfo td { .snarkTorrentInfo td, .snarkDirInfo td, .snarkTorrents .peerinfo td {
padding-top: 6px !important; padding-top: 4px !important;
padding-bottom: 6px !important; padding-bottom: 4px !important;
} }
#configs td:first-child { #configs td:first-child {
@ -2339,10 +2478,32 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, code, textarea, input, input[ty
} }
@media screen and (min-width: 1200px) { @media screen and (min-width: 1200px) {
.snarkRefresh:link {
font-size: 11pt !important;
}
.snarkRefresh:link, .snarkRefresh:hover, .snarkRefresh:focus, .snarkRefresh:active, .snarkRefresh:visited,
.snarkRefresh:link:first-child, .snarkRefresh:hover:first-child, .snarkRefresh:focus:first-child, .snarkRefresh:active:first-child, .snarkRefresh:visited:first-child,
.snarkRefresh:link:nth-child(2), .snarkRefresh:hover:nth-child(2), .snarkRefresh:focus:nth-child(2), .snarkRefresh:active:nth-child(2), .snarkRefresh:visited:nth-child(2) {
background-size: 16px auto, 100% 100% !important;
padding-left: 24px !important;
}
.snarkRefresh:link:first-child {
padding-left: 25px !important;
}
.snarkConfigtitle, .snarkConfigTitle a, label.toggleview { .snarkConfigtitle, .snarkConfigTitle a, label.toggleview {
font-size: 12pt !important; font-size: 12pt !important;
} }
.snarkTorrentDownloaded {
white-space: nowrap;
padding: 0 8px;
width: 110px;
text-align: center;
}
.percentDownloaded { .percentDownloaded {
pointer-events: none; /* hide tooltip */ pointer-events: none; /* hide tooltip */
} }
@ -2351,7 +2512,7 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, code, textarea, input, input[ty
min-height: 26px; min-height: 26px;
} }
td#bwHelp a { #configs a {
display: inline-block; display: inline-block;
white-space: nowrap; white-space: nowrap;
margin-left: 4px; margin-left: 4px;
@ -2367,10 +2528,6 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, code, textarea, input, input[ty
font-size: 10pt !important; font-size: 10pt !important;
} }
.snarkRefresh:link {
font-size: 11pt !important;
}
.snarkConfigTitle, .snarkConfigTitle a, label.toggleview { .snarkConfigTitle, .snarkConfigTitle a, label.toggleview {
font-size: 12pt !important; font-size: 12pt !important;
} }
@ -2380,17 +2537,6 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, code, textarea, input, input[ty
padding-top: 4px; padding-top: 4px;
} }
.snarkRefresh:link, .snarkRefresh:hover, .snarkRefresh:focus, .snarkRefresh:active, .snarkRefresh:visited,
.snarkRefresh:link:first-child, .snarkRefresh:hover:first-child, .snarkRefresh:focus:first-child, .snarkRefresh:active:first-child, .snarkRefresh:visited:first-child,
.snarkRefresh:link:nth-child(2), .snarkRefresh:hover:nth-child(2), .snarkRefresh:focus:nth-child(2), .snarkRefresh:active:nth-child(2), .snarkRefresh:visited:nth-child(2) {
background-size: 16px auto, 100% 100% !important;
padding-left: 24px !important;
}
.snarkRefresh:link:first-child {
padding-left: 25px !important;
}
tt, .snarkTorrents tt, .snarkMessages, .snarkMessages a { tt, .snarkTorrents tt, .snarkMessages, .snarkMessages a {
font-size: 9pt !important; font-size: 9pt !important;
} }
@ -2405,11 +2551,6 @@ textarea[name="i2cpOpts"] {
height: 11px; height: 11px;
} }
.snarkTorrentDownloaded {
white-space: nowrap;
padding: 0 8px;
}
.snarkTorrents td:nth-child(3), .SnarkTorrents td:nth-child(4) { .snarkTorrents td:nth-child(3), .SnarkTorrents td:nth-child(4) {
width: 18px !important; width: 18px !important;
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 668 B

View File

@ -41,6 +41,12 @@ body.iframed {
outline: none !important; outline: none !important;
} }
.toggleview, .snarkConfigTitle, .snarknavbar, img, input[type="image"] {
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}
a:focus img, input[type="image"]:focus, a.control:focus, input[type="radio"]:focus, input[type="checkbox"]:focus, select:focus, input[type="text"]:focus, input.r:focus, input[name="nofilter_dataDir"]:focus, textarea:focus { a:focus img, input[type="image"]:focus, a.control:focus, input[type="radio"]:focus, input[type="checkbox"]:focus, select:focus, input[type="text"]:focus, input.r:focus, input[name="nofilter_dataDir"]:focus, textarea:focus {
filter: drop-shadow(0 0 1px #6f072b) !important; filter: drop-shadow(0 0 1px #6f072b) !important;
} }
@ -474,24 +480,12 @@ tfoot tr:nth-child(n+1) {
font-weight: normal; font-weight: normal;
} }
.snarkTorrents tfoot th { .snarkTorrents tfoot tr:first-child th {
padding: 5px 4px !important; padding: 5px 4px !important;
background: #fff; background: #fff;
vertical-align: top; vertical-align: middle;
} }
/*
.snarkTorrents td:nth-child(n+6), .snarkTorrents tfoot th:nth-child(n+2) {
font-variant: all-small-caps !important;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.snarkTorrents td:nth-child(n+6), .snarkTorrents tfoot th:nth-child(n+2) {
font-variant: normal !important;
}
}
*/
td { td {
padding: 2px 4px; padding: 2px 4px;
color: #272e3f !important; color: #272e3f !important;
@ -540,7 +534,7 @@ td:first-child {
opacity: 1; opacity: 1;
} }
.snarkTorrents th:last-child br { /* kill "start all/stop all" button wrapping in the header */ .snarkTorrents thead th:last-child br { /* kill "start all/stop all" button wrapping in the header */
display: none; display: none;
} }
@ -641,6 +635,10 @@ td:first-child {
color: #0c111f !important; color: #0c111f !important;
} }
tr:hover .percentBarText {
opacity: 0.75;
}
.peerinfo:hover td:first-child { .peerinfo:hover td:first-child {
background: url(images/peer.png) center center no-repeat #ffd !important; background: url(images/peer.png) center center no-repeat #ffd !important;
} }
@ -672,15 +670,98 @@ td:first-child {
.snarkFileSize { .snarkFileSize {
padding: 4px 2px; padding: 4px 2px;
font-weight: normal; font-weight: normal;
width: 1%;
white-space: nowrap;
} }
.snarkFileStatus { .snarkFileStatus {
padding: 4px 5px;
font-style: italic; font-style: italic;
text-align: left; text-align: left;
white-space: nowrap; white-space: nowrap;
width: 140px;
} }
/* download bars */
.snarkTorrentDownloaded {
width: 110px !important;
text-align: center !important;
}
.priorityIndicator {
width: 32px;
margin: 0;
}
.snarkDirInfo .snarkFileStatus img {
float: left;
margin: 0 10px 0 5px;
}
.snarkFileStatus img[src*="clock"] {
margin-top: 2px;
}
.percentBarOuter {
background: #eef;
background: repeating-linear-gradient(135deg, rgba(238, 238, 255,0.7) 1px, rgba(238, 238, 255, 0.7) 5px, rgba(221, 221, 255, 0.7) 6px, rgba(221, 221, 255, 0.7) 11px);
border: 1px solid #99f;
box-shadow: none;
box-shadow: 0 0 1px rgba(200,200,200,0.8);
margin: 0 auto;
}
.percentBarInner {
border: none;
height: 100%;
background: #bbf;
background: linear-gradient(to bottom, #fff 0%, #eef 50%, #ddf 50%, #bbf 100%);
box-shadow: inset 0 0 0 1px #ddf;
}
.percentBarInner.percentBarComplete {
background: transparent;
vertical-align: middle;
}
.percentBarText, .percentBarOuter {
text-align: center;
height: 16px;
vertical-align: middle;
}
.percentBarText {
text-align: center;
font-weight: bold !important;
line-height: 15px;
padding: 1px 0;
white-space: nowrap;
display: block;
color: #005;
text-shadow: 0 0 1px rgba(255,255,255,0.5);
opacity: 0;
transition: ease opacity 0.3s 0.5s;
}
.percentBarText:hover, .percentBarText:focus {
opacity: 0.75;
transition: ease opacity 0.3s;
}
.percentBarOuterComplete .percentBarText {
opacity: 1;
}
.snarkTorrentDownloaded .percentBarText, .snarkTorrentDownloaded .percentBarOuter {
width: 110px !important;
}
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter, .peerinfo .percentBarText, .peerinfo .percentBarOuter {
width: 80px !important;
}
/* end download bars */
.choked { .choked {
color: #a00 !important; color: #a00 !important;
} }
@ -902,25 +983,16 @@ p {
} }
hr { hr {
color: #444; color: #339;
background: #444; background: #339;
background: linear-gradient(to right, #339, rgba(110,100,200,0.5));
height: 1px; height: 1px;
border: 0 solid #444; border: 0 solid #339;
width: 0; width: 0;
margin: 5px 0 7px 0; margin: 5px 0 7px 0;
text-align: center; text-align: center;
} }
hr.debug {
width: 100%;
margin: 3px 0;
}
hr.debug:nth-child(n+7) {
margin-top: -10px;
background: #339;
}
.headerpriority br { .headerpriority br {
display: none; display: none;
} }
@ -1123,6 +1195,12 @@ select:active, select option {
background: #fff; background: #fff;
} }
select[disabled], select[disabled]:hover {
background: #efefff url(images/dropdown.png) right center no-repeat !important;
opacity: 0.7;
cursor: not-allowed;
}
select::-ms-expand { select::-ms-expand {
display: none; display: none;
} }
@ -1459,6 +1537,83 @@ input#toggle_addtorrent:checked + label + hr + table, input#toggle_createtorrent
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif; font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif;
} }
.dhtDebug th, .dhtDebug:hover {
font-weight: normal;
padding: 0 10px 10px !important;
background: #efefff;
background: repeating-linear-gradient(45deg, rgba(255,255,255,0.5) 2px, rgba(230, 230, 255, 0.3) 3px, #fff 5px) #fff !important;
word-break: break-all;
}
/* debug panel */
#dhtdebugPanel {
background: linear-gradient(to top, rgba(224, 224, 255, 0.5), #fff), repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.5) 2px, rgb(221, 221, 255) 3px, #fff 5px);
box-shadow: inset 0 0 0 1px #efefff;
border: 1px solid #7778bf;
border-top: none;
text-align: center;
padding-bottom: 13px;
}
#dhtDebugInner {
text-align: left;
padding: 5px;
background: #efefff;
box-shadow: inset 0 0 0 1px #fff, 0 0 1px 0 rgba(160,160,160,0.5);
margin: -26px 0 -12px;
}
.dhtDebug th b:first-of-type, .dhtDebug th b:first-of-type + br + hr.debug {
display: none;
}
input#toggle_debug:not(checked) + label {
padding-bottom: 2px;
}
input#toggle_debug:not(checked) + label > img {
margin-right: -2px !important;
}
input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
.iframed input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
.iframed input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
/* end debug panel */
hr.debug {
width: 100%;
margin: 3px 0;
}
hr.debug:first-of-type {
background: transparent;
margin-top: -5px;
margin-bottom: -5px;
}
hr.debug:nth-child(n+7) {
margin-top: -10px;
}
hr.debug:last-child {
background: transparent;
margin-bottom: -4px;
}
/* end debug */ /* end debug */
/* Resource Errors */ /* Resource Errors */
@ -1532,7 +1687,7 @@ input#toggle_addtorrent:checked + label + hr + table, input#toggle_createtorrent
.priority::after { .priority::after {
content: ""; content: "";
display: inline-block; display: inline-block;
min-height: 30px; min-height: 28px;
vertical-align: middle; vertical-align: middle;
} }
@ -1580,10 +1735,10 @@ input#toggle_addtorrent:checked + label + hr + table, input#toggle_createtorrent
line-height: 100%; line-height: 100%;
} }
#bwHelp a { #configs a {
display: inline-block; display: inline-block;
white-space: nowrap; white-space: nowrap;
font-style: normal; margin-left: 4px;
font-weight: bold; font-weight: bold;
} }
@ -1640,57 +1795,6 @@ _:-ms-lang(x), *, *:hover, *:focus, input, input:hover, input:focus, a:hover, a:
/*responsive layout */ /*responsive layout */
@media screen and (max-width: 1000px) {
body, td, .snarkMessages li, .snarkMessages a, button, input, select, .snarkAddInfo, code, tt, th, a, a:link, .snarkAddInfo, .snarkFileStatus {
font-size: 8pt !important;
}
.snarkRefresh:link {
font-size: 9pt !important;
}
.snarkConfigTitle a, .snarkConfigTitle, label.toggleview {
font-size: 10pt !important;
}
.snarkTorrents td:first-child img {
max-height: 16px;
}
.snarkTorrentName, .snarkTorrentName a {
font-weight: bold;
}
.snarkTorrents td:nth-child(2), .snarkTorrents td:nth-child(2) a {
white-space: nowrap;
font-weight: bold;
}
.snarkTorrentStatus b {
display: none;
}
b.alwaysShow {
display: inline;
}
}
@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 1000px) {
.snarkConfigTitle a, label.toggleview, .configsectionpanel .snarkConfigTitle {
font-size: 12pt !important;
}
}
@media screen and (max-width: 1200px) {
.dirInfoComplete {
display: none;
}
a.snarkRefresh:first-child {
padding-left: 26px !important;
}
}
/* mini-mode: hide status text, upload speed + upload amount in main torrent table at 800px or less */ /* mini-mode: hide status text, upload speed + upload amount in main torrent table at 800px or less */
@media screen and (max-width: 800px) { @media screen and (max-width: 800px) {
@ -1712,7 +1816,7 @@ a.snarkRefresh:first-child {
padding: 0 !important; padding: 0 !important;
} }
.snarkTorrents th:nth-child(7) img { .snarkTorrents th:nth-child(7) img, .snarkTorrents th:nth-child(9) img {
display: none; display: none;
} }
@ -1779,7 +1883,76 @@ input[name="nofilter_dataDir"], textarea[name="i2cpOpts"] {
/* end mini-mode */ /* end mini-mode */
@media screen and (max-width: 1000px) {
body, td, .snarkMessages li, .snarkMessages a, button, input, select, .snarkAddInfo, code, tt, th, a, a:link, .snarkAddInfo, .snarkFileStatus {
font-size: 8pt !important;
}
.snarkRefresh:link {
font-size: 9pt !important;
}
.snarkConfigTitle a, .snarkConfigTitle, label.toggleview {
font-size: 10pt !important;
}
.snarkTorrents td:first-child img {
max-height: 16px;
}
.snarkTorrentName, .snarkTorrentName a {
font-weight: bold;
}
.snarkTorrents td:nth-child(2), .snarkTorrents td:nth-child(2) a {
white-space: nowrap;
font-weight: bold;
}
.snarkTorrentStatus b {
display: none;
}
b.alwaysShow {
display: inline;
}
.snarkTorrentDownloaded .percentBarText, .snarkTorrentDownloaded .percentBarOuter {
width: 100px !important;
}
}
@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 1000px) {
.snarkConfigTitle a, label.toggleview, .configsectionpanel .snarkConfigTitle {
font-size: 12pt !important;
}
}
@media screen and (max-width: 1200px) {
.dirInfoComplete {
display: none;
}
a.snarkRefresh:first-child {
padding-left: 26px !important;
}
}
@media screen and (max-width: 1400px) {
#dhtDebugInner {
margin-top: -22px !important;
}
}
@media screen and (min-width: 1200px) { @media screen and (min-width: 1200px) {
a.snarkRefresh {
font-size: 10pt !important;
}
a.snarkRefresh:first-child {
padding-left: 26px !important;
}
.percentDownloaded { .percentDownloaded {
pointer-events: none; /* hide tooltip */ pointer-events: none; /* hide tooltip */
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 668 B

View File

@ -41,6 +41,12 @@ body.iframed {
outline: none; outline: none;
} }
.toggleview, .snarkConfigTitle, .snarknavbar, img, input[type="image"] {
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}
.page { .page {
font-size: 9pt !important; font-size: 9pt !important;
line-height: 160% !important; line-height: 160% !important;
@ -335,11 +341,6 @@ th:first-child {
text-align: left !important; text-align: left !important;
} }
tfoot td:first-child {
padding-left: 0;
text-align: left !important;
}
th:first-child img { th:first-child img {
margin: 1px -2px 3px 1px !important; margin: 1px -2px 3px 1px !important;
} }
@ -352,6 +353,15 @@ tfoot th {
padding-bottom: 4px !important; padding-bottom: 4px !important;
} }
tfoot tr:first-child th {
vertical-align: middle !important;
}
tfoot td:first-child {
padding-left: 0;
text-align: left !important;
}
tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) img, tfoot:nth-child(4) img { tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) img, tfoot:nth-child(4) img {
margin: 0 2px 3px 0 !important; margin: 0 2px 3px 0 !important;
padding-right: 0 !important; padding-right: 0 !important;
@ -403,7 +413,6 @@ tfoot tr:nth-child(n+1) {
.snarkTorrents thead th:first-child { .snarkTorrents thead th:first-child {
width: 36px; width: 36px;
/* padding-right: 0;*/
text-align: center !important; text-align: center !important;
} }
@ -500,6 +509,10 @@ tfoot tr:nth-child(n+1) {
text-align: center !important; text-align: center !important;
} }
.peerinfo td:nth-child(4) {
font-weight: bold;
}
.snarkTorrents td[colspan="10"] { .snarkTorrents td[colspan="10"] {
padding: 2px; padding: 2px;
} }
@ -708,17 +721,18 @@ th.headerdownloaded {
mix-blend-mode: luminosity; mix-blend-mode: luminosity;
} }
td.snarkFileStatus { .snarkFileStatus {
font-size: 8pt; font-size: 8pt;
text-align: left; text-align: left;
width: 140px;
} }
td.snarkFileIcon { .snarkFileIcon {
width: 16px; width: 16px;
padding: 0; padding: 0;
} }
td.snarkFileStatusIcon { .snarkFileStatusIcon {
width: 24px; width: 24px;
padding: 0 4px 0 0; padding: 0 4px 0 0;
text-align: center; text-align: center;
@ -870,31 +884,19 @@ td.snarkTorrentDownloaded {
mix-blend-mode: normal; mix-blend-mode: normal;
} }
/* tr:hover .percentBarText {
.ParentDir a, .ParentDir a:visited { opacity: 0.9;
color: #7972d1 !important;
} }
*/
.snarkTorrents a { .snarkTorrents a {
display: inline-block; display: inline-block;
width: 100%; width: 100%;
} }
/* .snarkTorrents th a {
.snarkTorrents tr:hover a, .snarkDirInfo tr:hover a { display: inline;
color: #a099ff;
} }
.snarkTorrents a:hover, td[onclick]:hover a, .snarkDirInfo a:hover {
color: #652787 !important;
}
td[onclick]:hover {
cursor: pointer !important;
}
*/
.snarkTorrentEven { .snarkTorrentEven {
background: #010010; background: #010010;
} }
@ -946,6 +948,8 @@ _:-ms-lang(x), .snarkTorrentOdd, .snarkTorrentOdd td, .SnarkTorrentEven, .SnarkT
font-weight: normal; font-weight: normal;
padding: 4px 2px; padding: 4px 2px;
color: #7670c2 !important; color: #7670c2 !important;
width: 1%;
white-space: nowrap;
} }
.snarkFileStatus { .snarkFileStatus {
@ -962,51 +966,89 @@ _:-ms-lang(x), .snarkTorrentOdd, .snarkTorrentOdd td, .SnarkTorrentEven, .SnarkT
text-align: center !important; text-align: center !important;
} }
/* /* download bars */
div.percentBarOuter {
background: #000 !important; .snarkTorrentDownloaded {
border: 1px solid #9f9; width: 110px !important;
border-bottom: 1px solid #474; text-align: center !important;
border-right: 1px solid #474; }
border-radius: 0;
.snarkDirInfo .snarkFileStatus img {
float: left; float: left;
margin: 0 10px 0 5px;
}
.snarkFileStatus img[src*="clock"] {
margin-top: 4px;
}
.percentBarOuter {
background: #000;
background: repeating-linear-gradient(135deg, #001 1px, #001 5px, #003 6px, #003 11px);
border: 1px solid #171c3f;
box-shadow: none; box-shadow: none;
opacity: 1; box-shadow: 0 0 1px 1px rgba(0,0,0,0.8);
margin: 3px auto;
} }
div.percentBarInner { .peerinfo .percentBarOuter {
opacity: 0.8;
}
.percentBarInner {
border: none; border: none;
height: 14px; height: 100%;
background: #1c943a; background: #33a;
background: linear-gradient(to bottom, #1c943a 0%, #092f10 50%, #0d2707 50%, #091b05 50%, #091503 100%); background: linear-gradient(to bottom, #33a 0%, #226 50%, #003 50%, #000 100%);
box-shadow: inset 0 0 0 1px #000;
opacity: 0.8;
} }
div.percentBarInner.percentBarComplete { .snarkTorrentDownloaded .percentBarInner {
background: #001100; background: linear-gradient(to bottom, rgba(51, 51, 170, 0.6) 0%, rgba(34, 34, 102, 0.7) 50%, rgba(0, 0, 51, 0.8) 50%, rgba(0, 0, 0, 0.9) 100%), linear-gradient(to right, rgba(255, 255, 0, 0.5) 55px, rgba(0, 255, 0, 0.5));
background: linear-gradient(to bottom, #001100 0%, #002200 52%, #000000 52%, #001100 100%); }
.snarkDirInfo .percentBarInner {
background: linear-gradient(to bottom, rgba(51, 51, 170, 0.6) 0%, rgba(34, 34, 102, 0.7) 50%, rgba(0, 0, 51, 0.8) 50%, rgba(0, 0, 0, 0.9) 100%), linear-gradient(to right, rgba(255, 255, 0, 0.5) 40px, rgba(0, 255, 0, 0.5));
}
.snarkDirInfo .percentBarInner[style="width: 0%;"] .percentBarText {
opacity: 0.9;
} }
.percentBarText, .percentBarOuter { .percentBarText, .percentBarOuter {
text-align: center; text-align: center;
height: 14px; height: 16px;
top: 0; vertical-align: middle;
width: 110px;
}
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter, .peerinfo .percentBarText, .peerinfo .percentBarOuter {
width: 80px; width: 80px;
} }
.percentBarText { .percentBarText {
text-align: center; text-align: center;
font-weight: bold; font-weight: bold !important;
line-height: 140%; line-height: 16px;
text-shadow: 0 1px 1px #000; white-space: nowrap;
display: block;
color: #00ecff;
text-shadow: 0 0 1px rgba(0,0,0,0.8);
opacity: 0;
transition: ease opacity 0.3s 0.5s;
} }
.snarkTorrentDownloaded .percentBarText, .snarkTorrentDownloaded .percentBarOuter { .peerinfo .percentbartext {
width: 110px !important; color: #dff1ff;
word-spacing: -0.2em;
font-size: 7.5pt;
} }
*/ .percentBarText:hover, .percentBarText:focus {
opacity: 0.9;
transition: ease opacity 0.3s;
}
/* end download bars */
.choked { .choked {
color: #900 !important; color: #900 !important;
@ -1127,7 +1169,6 @@ div.percentBarInner.percentBarComplete {
margin-right: -2px; margin-right: -2px;
margin-top: -1px; margin-top: -1px;
filter: drop-shadow(0 0 1px #000); filter: drop-shadow(0 0 1px #000);
/* filter: sepia(100%) hue-rotate(150deg) drop-shadow(0 0 1px #000);*/
} }
.snarkConfig { .snarkConfig {
@ -1157,21 +1198,6 @@ hr {
background: #3e3d4b; background: #3e3d4b;
} }
hr.debug {
width: 100%;
background: #120f35;
margin: 3px 0;
}
hr.debug:nth-child(n+7) {
margin: -10px 0 3px;
}
hr.debug:last-child {
background: #000;
margin-bottom: -5px;
}
.configsectionpanel hr { .configsectionpanel hr {
margin-bottom: 10px; margin-bottom: 10px;
} }
@ -1453,6 +1479,17 @@ select:hover {
box-shadow: inset 0 1px 1px 0 #c9ceff; box-shadow: inset 0 1px 1px 0 #c9ceff;
} }
select[disabled], select[disabled]:hover {
color: #4e47bf !important;
background: #000 url(images/dropdown.png) right 3px center no-repeat !important;
border: 1px solid #3e3f8f;
border-bottom-color: #14144f;
border-right-color: #14144f;
box-shadow: none !important;
opacity: 0.7;
cursor: not-allowed;
}
select option { select option {
font-size: 9.5pt; font-size: 9.5pt;
font-weight: normal; font-weight: normal;
@ -1778,11 +1815,11 @@ _:-ms-lang(x), #trackerselect tr:last-child {
padding-left: 5px !important; padding-left: 5px !important;
} }
#bwHelp a { #configs a {
display: inline-block; display: inline-block;
white-space: nowrap; white-space: nowrap;
margin-left: 5px; margin-left: 4px;
font-style: normal; font-weight: bold;
} }
.snarkConfig tr:nth-last-child(2) { .snarkConfig tr:nth-last-child(2) {
@ -2038,6 +2075,90 @@ label.toggleview, .snarkConfigTitle a, .snarkConfigTitle a:visited {
color: #c9ceff; color: #c9ceff;
} }
tfoot .dhtDebug th {
word-break: break-all;
padding: 0 10px 10px !important;
}
/* debug panel */
#dhtDebugPanel {
background: linear-gradient(to bottom, #001, #000009);
border: 1px solid #443da0;
border-top: none;
box-shadow: inset 0 0 0 1px #000;
text-align: center;
padding-bottom: 13px;
}
#dhtDebugPanel .toggleview {
padding-bottom: 2px !important;
}
#dhtDebugInner {
text-align: left;
padding: 5px;
background: #000;
margin: -23px 0 -12px;
}
.dhtDebug th b:first-of-type, .dhtDebug th b:first-of-type + br + hr.debug {
display: none;
}
input#toggle_debug:not(checked) + label {
padding-bottom: 2px;
}
input#toggle_debug:not(checked) + label > img {
margin-right: -2px !important;
}
input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
.iframed input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
.iframed input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
/* end debug panel */
hr.debug {
width: 100%;
background: #120f35;
margin: 3px 0;
}
hr.debug:first-of-type {
background: transparent;
margin-bottom: -5px;
margin-top: -2px;
}
hr.debug + hr {
display: block;
background: transparent;
margin-bottom: -3px;
}
hr.debug:nth-child(n+7) {
margin: -10px 0 3px;
}
hr.debug:last-child {
background: #000;
margin-bottom: -5px;
}
/* end debug */ /* end debug */
/* Resource Errors */ /* Resource Errors */
@ -2080,7 +2201,7 @@ label.toggleview, .snarkConfigTitle a, .snarkConfigTitle a:visited {
} }
#NotFound { #NotFound {
border-bottom: 1px solid #443da0; border: 1px solid #443da0;
} }
/* end Resource Errors */ /* end Resource Errors */
@ -2257,6 +2378,26 @@ b.alwaysShow {
width: 30px !important; width: 30px !important;
} }
.peerinfo .percentBarText, .snarkDirInfo .percentBarText {
line-height: 18px;
}
.percentBarText, .percentBarOuter {
width: 100px;
}
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter, .peerinfo .percentBarText, .peerinfo .percentBarOuter {
width: 60px;
}
.snarkTorrentDownloaded .percentBarInner {
background: linear-gradient(to bottom, rgba(51, 51, 170, 0.6) 0%, rgba(34, 34, 102, 0.7) 50%, rgba(0, 0, 51, 0.8) 50%, rgba(0, 0, 0, 0.9) 100%), linear-gradient(to right, rgba(255, 255, 0, 0.5) 50px, rgba(0, 255, 0, 0.5));
}
.snarkDirInfo .percentBarInner {
background: linear-gradient(to bottom, rgba(51, 51, 170, 0.6) 0%, rgba(34, 34, 102, 0.7) 50%, rgba(0, 0, 51, 0.8) 50%, rgba(0, 0, 0, 0.9) 100%), linear-gradient(to right, rgba(255, 255, 0, 0.5) 30px, rgba(0, 255, 0, 0.5));
}
.configsectionpanel .snarkConfigTitle { .configsectionpanel .snarkConfigTitle {
font-size: 10.5pt !important; font-size: 10.5pt !important;
} }
@ -2298,6 +2439,10 @@ a, th, thead th, tfoot th, td, select, select option, .snarkAddInfo, .snarkFileN
font-size: 9pt !important; font-size: 9pt !important;
} }
.snarkRefresh {
font-size: 10.5pt !important;
}
.snarkConfigTitle, .snarkConfigTitle a, label.toggleview, .snarkRefresh:link { .snarkConfigTitle, .snarkConfigTitle a, label.toggleview, .snarkRefresh:link {
font-size: 11pt !important; font-size: 11pt !important;
} }
@ -2316,10 +2461,6 @@ a, th, thead th, tfoot th, td, select, select option, .snarkAddInfo, .snarkFileN
font-size: 10pt !important; font-size: 10pt !important;
} }
.snarkRefresh {
font-size: 10.5pt !important;
}
.snarkConfigTitle, .toggleview { .snarkConfigTitle, .toggleview {
padding: 4px 25px 4px 22px; padding: 4px 25px 4px 22px;
} }

Binary file not shown.

After

Width:  |  Height:  |  Size: 668 B

View File

@ -382,11 +382,6 @@ th:nth-child(2) img {
margin: 1px 7px 3px 2px !important; margin: 1px 7px 3px 2px !important;
} }
tfoot th {
padding-bottom: 4px !important;
vertical-align: top;
}
tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) img, tfoot:nth-child(4) img { tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) img, tfoot:nth-child(4) img {
margin: 0 2px 3px 0 !important; margin: 0 2px 3px 0 !important;
padding-right: 0 !important; padding-right: 0 !important;
@ -398,7 +393,7 @@ tfoot tr:nth-child(n+1) {
.headerstatus { .headerstatus {
text-align: left; text-align: left;
padding-left: 15px; padding-left: 5px;
} }
.headerpriority { .headerpriority {
@ -486,9 +481,10 @@ tfoot tr:nth-child(n+1) {
.snarkTorrents tfoot th { .snarkTorrents tfoot th {
padding: 5px 2px; padding: 5px 2px;
font-weight: normal; font-weight: normal;
vertical-align: middle;
} }
.snarkTorrents tfoot th::first-line { .snarkTorrents tfoot tr:first-child th {
font-weight: bold; font-weight: bold;
vertical-align: middle; vertical-align: middle;
} }
@ -497,7 +493,7 @@ tfoot tr:nth-child(n+1) {
background: #120012; background: #120012;
} }
.snarkTorrents thead th:nth-last-child(4), .snarkTorrents thead th:nth-last-child(5), .snarkTorrents tfoot th:nth-last-child(4), .snarkTorrents tfoot th:nth-last-child(5) { .snarkTorrents thead th:nth-last-child(4), .snarkTorrents tfoot th:nth-last-child(4) {
text-align: center; text-align: center;
} }
@ -509,21 +505,17 @@ tfoot tr:nth-child(n+1) {
text-align: right; text-align: right;
} }
.snarkTorrents tfoot th:nth-child(2) {
text-align: center;
}
.snarkTorrents td:nth-child(3), .SnarkTorrents td:nth-child(4) { .snarkTorrents td:nth-child(3), .SnarkTorrents td:nth-child(4) {
width: 16px; width: 16px;
padding: 2px 0; padding: 2px 0;
} }
.snarkTorrents td:nth-child(3) { .snarkTorrents .peerinfo td:nth-child(3), .snarkTorrents .peerinfo td:nth-child(4) {
text-align: right; padding: 2px 4px;
} }
.snarkTorrents td:nth-child(4) { .snarkTorrents td:nth-child(3) {
text-align: left; text-align: right;
} }
.snarkTorrents tt { .snarkTorrents tt {
@ -555,7 +547,7 @@ td:first-child {
.snarkTorrentName { .snarkTorrentName {
line-height: 110%; line-height: 110%;
padding: 2px 1px 2px 0; padding: 2px 1px 2px 3px;
} }
.snarkTorrentName img { .snarkTorrentName img {
@ -571,11 +563,11 @@ td:first-child {
white-space: nowrap; white-space: nowrap;
} }
.snarkTorrents th:last-child { .snarkTorrents thead th:last-child {
white-space: nowrap !important; white-space: nowrap !important;
text-align: center; text-align: center;
padding-right: 4px; padding-right: 4px;
width: 40px; width: 1%;
} }
.snarkTorrents th:last-child input[type="image"] { .snarkTorrents th:last-child input[type="image"] {
@ -644,12 +636,6 @@ a img[src$="details.png"]:hover, a:focus img[src$="details.png"] {
padding-left: 0; padding-left: 0;
} }
.snarkTorrentDownloaded {
color: #76a !important;
white-space: nowrap;
text-align: center !important;
}
.snarkTorrentUploaded { .snarkTorrentUploaded {
color: #b9b !important; color: #b9b !important;
} }
@ -705,7 +691,8 @@ a img[src$="details.png"]:hover, a:focus img[src$="details.png"] {
} }
.snarkTorrentEven + .snarkTorrentEven td:nth-child(4), .snarkTorrentOdd + .snarkTorrentOdd td:nth-child(4) { .snarkTorrentEven + .snarkTorrentEven td:nth-child(4), .snarkTorrentOdd + .snarkTorrentOdd td:nth-child(4) {
text-align: center !important; text-align: right !important;
font-weight: bold;
} }
.snarkTorrentEven + .snarkTorrentEven td:nth-child(n+5), .snarkTorrentOdd + .snarkTorrentOdd td:nth-child(n+5) { .snarkTorrentEven + .snarkTorrentEven td:nth-child(n+5), .snarkTorrentOdd + .snarkTorrentOdd td:nth-child(n+5) {
@ -719,8 +706,8 @@ table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:hover {
border-bottom: 1px solid #101 !important; border-bottom: 1px solid #101 !important;
} }
table.snarkTorrents tbody tr:hover { tr:hover .percentBarText {
box-shadow: inset 0 1px 1px 0 #939; opacity: 1;
} }
/* MS Edge fix */ /* MS Edge fix */
@ -755,17 +742,19 @@ table.snarkTorrents tbody tr:hover .snarkTorrentName, table.snarkDirInfo tbody t
padding: 4px 2px; padding: 4px 2px;
font-weight: bold; font-weight: bold;
color: #b6b !important; color: #b6b !important;
width: 9em !important; width: 1%;
white-space: nowrap;
} }
.snarkFileStatus { .snarkFileStatus {
padding: 2px 5px 2px 15px; padding: 2px 5px;
font-style: italic; font-style: italic;
font-size: 8pt; font-size: 8pt;
text-align: left !important; text-align: left !important;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
width: 140px;
} }
.snarkFileStatus img[src*="clock"] { .snarkFileStatus img[src*="clock"] {
@ -897,12 +886,105 @@ _:-ms-lang(x), .snarkDirInfo img, .snarkTorrents img {
color: #f90; color: #f90;
} }
/* download bars */
.snarkTorrentDownloaded {
text-align: right !important;
width: 110px;
color: #76a !important;
white-space: nowrap;
}
.snarkDirInfo .snarkFileStatus img {
float: left;
margin: 0 10px 0 7px;
}
.priorityIndicator img[src*="clock"] {
margin-top: 4px;
}
.percentBarOuter {
background: #000 !important;
background: repeating-linear-gradient(135deg, #000 1px, #000 5px, #101 6px, #101 11px) !important;
border: 1px solid #414;
border-bottom: 1px solid #212;
border-right: 1px solid #212;
opacity: 0.7;
box-shadow: 0 0 1px 1px rgba(0,0,0,0.5);
margin: 2px 0 !important;
}
.snarkTorrentDownloaded .percentBarOuter {
margin-left: 5px !important;
}
.peerinfo .percentBarOuter {
background: repeating-linear-gradient(135deg, #000 1px, #000 5px, #0f0a08 6px, #0f0a08 11px) !important;
height: 16px;
line-height: 13px;
}
.percentBarInner {
border: none;
height: 100%;
background: #515;
background: linear-gradient(to bottom, rgba(136, 17, 136, 0.7) 0%, rgba(85, 17, 85, 0.7) 50%, rgba(51, 17, 51, 0.7) 50%, rgba(0, 0, 0, 0.9) 100%);
box-shadow: inset 0 0 0 1px #000;
}
.peerinfo .percentBarInner {
background: linear-gradient(to bottom, rgba(82, 57, 67, 0.7) 0%, rgba(95, 70, 41, 0.7) 50%, rgba(63, 47, 27, 0.7) 50%, rgba(31, 23, 13, 0.9) 100%);
}
.peerinfo .percentBarText {
color: #C19E91;
}
.percentBarText, .percentBarOuter {
width: 110px;
text-align: center;
vertical-align: middle;
}
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter, .peerinfo .percentBarText, .peerinfo .percentBarOuter {
width: 80px;
}
.snarkDirInfo .percentBarOuter {
float: left;
}
.peerinfo .percentBarOuter {
float: right;
}
.percentBarText {
text-align: center;
font-weight: bold;
padding: 2px 0;
white-space: nowrap;
display: block;
color: #dd7;
text-shadow: 0 0 1px rgba(0,0,0,0.8);
opacity: 0;
transition: ease opacity 0.3s 0.5s;
}
.percentBarText:hover, .percentBarText:focus {
opacity: 1;
transition: ease opacity 0.3s;
}
/* end download bars */
.choked { .choked {
color: #f00000 !important; color: #f00000 !important;
} }
.unchoked { .unchoked {
color: #00f000 !important; color: #00f000 !important;
color: #34CF19 !important;
} }
.choked, .unchoked { .choked, .unchoked {
@ -972,6 +1054,12 @@ table#trackerselect {
user-select: all; user-select: all;
} }
.toggleview, .snarkConfigTitle, .snarknavbar, img, input[type="image"] {
-moz-user-select: none;
-webkit-user-select: none;
user-select: none;
}
.snarkConfigTitle, label.toggleview, .configsectionpanel .snarkConfigTitle:hover, .configsectionpanel .snarkConfigTitle:active { .snarkConfigTitle, label.toggleview, .configsectionpanel .snarkConfigTitle:hover, .configsectionpanel .snarkConfigTitle:active {
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "DejaVu Sans", Verdana, sans-serif; font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "DejaVu Sans", Verdana, sans-serif;
font-size: 12pt; font-size: 12pt;
@ -1037,21 +1125,6 @@ hr {
text-align: center; text-align: center;
} }
hr.debug {
width: 100%;
}
hr.debug:nth-child(n+7) {
margin-top: -11px;
margin-bottom: 2px;
opacity: 0.5;
}
hr.debug:last-child {
background: #303;
margin-bottom: -4px;
}
a:link { a:link {
color: #f70; color: #f70;
text-decoration: none; text-decoration: none;
@ -1482,6 +1555,15 @@ select:hover, select:focus, select:active {
background-blend-mode: luminosity; background-blend-mode: luminosity;
} }
select[disabled], select[disabled]:hover, select[disabled]:focus {
opacity: 0.5;
background: #212 url(images/graytile.png) !important;
background: url(images/dropdown.png) right center no-repeat, url(images/graytile.png) #212 !important;
background-blend-mode: normal;
color: #f60 !important;
cursor: not-allowed;
}
select option { select option {
background: #f50; background: #f50;
color: #fff; color: #fff;
@ -1905,6 +1987,122 @@ label.toggleview img:active, label.toggleview:active img, .snarkConfigTitle a:ac
color: #b9b; color: #b9b;
} }
hr.debug {
background: linear-gradient(to right, #313, #414, #313);
background: rgba(32,16,32,0.3);
border-bottom: 1px solid rgba(128, 0, 128, 0.3);
width: 100%;
height: 1px;
}
@-moz-document url-prefix() {
hr.debug {
height: 2px;
}
}
hr.debug:nth-child(n+7) {
margin-top: -7px;
margin-bottom: 7px;
}
hr.debug:first-of-type {
background: transparent;
border: none;
margin-bottom: -2px;
}
hr.debug:last-child {
background: transparent;
border: none;
margin-bottom: -4px;
}
hr.debug + hr {
background: transparent !important;
display: block !important;
margin-bottom: -7px;
}
tr.dhtDebug th {
white-space: normal;
word-break: break-all;
border-top: 1px solid #313;
background: #1f021f;
padding: 0 10px 5px;
padding: 0 0 4px;
background: linear-gradient(to right, rgba(30,0,30,0.4) 0%, rgba(55,0,55,0.5) 50%, rgba(30,0,30,0.4) 100%), url(images/tile2.png);
}
.dhtDebug th > br:first-child {
display: none;
}
/* debug panel */
#dhtDebugPanel {
background: #101;
background: linear-gradient(to bottom, #545 0%, #434 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.2) 30%, rgba(0,0,0,1)), linear-gradient(to right, rgba(128,0,128,0) 30%, #414 50%, rgba(128,0,128,0) 70%), linear-gradient(to bottom, #101, #000);
border: 1px solid #414;
border-top: none;
border-radius: 0 0 4px 4px;
box-shadow: 0 1px 2px 0 rgba(16,0,16,0.6);
text-align: center;
padding-bottom: 13px;
margin: 0 8px 4px;
}
#dhtDebugPanel label {
padding: 8px 4px 4px !important;
display: block;
margin: 0 0 -13px !important;
border-radius: 0 0 4px 4px;
background: #202;
}
input#toggle_debug:not(checked) + label {
border-radius: 0;
background: #101;
text-align: center;
}
#dhtDebugInner {
text-align: left;
padding: 3px 10px 5px;
background: #000;
margin: -33px 0 -12px;
}
.dhtDebug th b:first-of-type, .dhtDebug th b:first-of-type + br + hr.debug {
display: none;
}
input#toggle_debug:not(checked) + label {
padding-bottom: 2px;
}
input#toggle_debug:not(checked) + label > img {
margin-right: -2px !important;
}
input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
.iframed input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
.iframed input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
/* end debug panel */
/* end debug */ /* end debug */
/* Resource Errors */ /* Resource Errors */
@ -2034,7 +2232,7 @@ label.toggleview img:active, label.toggleview:active img, .snarkConfigTitle a:ac
font-weight: bold; font-weight: bold;
} }
td#bwHelp { #bwHelp {
background: url(images/infocircle.png) left 8px center no-repeat; background: url(images/infocircle.png) left 8px center no-repeat;
background-size: 14px auto; background-size: 14px auto;
padding-left: 26px !important; padding-left: 26px !important;
@ -2042,7 +2240,7 @@ td#bwHelp {
line-height: 100%; line-height: 100%;
} }
td#bwHelp a { #bwHelp a {
display: inline-block; display: inline-block;
white-space: nowrap; white-space: nowrap;
margin-left: 4px; margin-left: 4px;
@ -2155,13 +2353,26 @@ table.snarkDirInfo {
} }
.snarkTorrentName a:not(old) { .snarkTorrentName a:not(old) {
max-width: 300px; max-width: 300px !important;
} }
.snarkTorrentDownloaded { .snarkTorrentDownloaded {
white-space: nowrap; white-space: nowrap;
} }
.percentBarOuter {
margin: 0 !important;
display: inline-block;
}
.percentBarOuter, .percentBarText {
width: 105px;
}
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter {
width: 60px;
}
.snarkTorrentStatus b { .snarkTorrentStatus b {
display: none; display: none;
} }
@ -2202,6 +2413,10 @@ b.alwaysShow {
#trackerselect td a { #trackerselect td a {
max-width: 350px; max-width: 350px;
} }
.priorityIndicator img[src*="clock"] {
margin-top: 0;
}
} }
@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 1050px) { @media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 1050px) {
@ -2232,6 +2447,10 @@ b.alwaysShow {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.snarkFileStatus {
width: 120px;
}
.toggleview, .snarkConfigTitle, .snarkConfigTitle a { .toggleview, .snarkConfigTitle, .snarkConfigTitle a {
font-size: 11pt !important; font-size: 11pt !important;
} }
@ -2256,6 +2475,16 @@ _:-ms-lang(x), .snarkRefresh:link, .snarkRefresh:visited {
background-position: 11px 5px, center center !important; background-position: 11px 5px, center center !important;
background-size: 15px auto, 100% 100% !important; background-size: 15px auto, 100% 100% !important;
} }
.peerinfo .percentBarOuter {
filter: sepia(1);
height: 14px;
line-height: 11px;
}
#dhtDebugInner {
padding-top: 15px !important;
}
} }
@media screen and (min-width: 1050px) { @media screen and (min-width: 1050px) {
@ -2359,10 +2588,6 @@ input[type="submit"], input[type="reset"], select, select option, button, a.cont
display: inline-block; display: inline-block;
} }
.SnarkTorrents td:nth-child(4) {
padding-right: 5px;
}
.snarkTorrentName a:not(old) { .snarkTorrentName a:not(old) {
max-width: none; max-width: none;
} }
@ -2413,14 +2638,6 @@ select {
font-size: 9pt !important; font-size: 9pt !important;
} }
.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded, .snarkFileSize {
padding: 0 8px !important;
}
.choked, .unchoked {
margin-right: 6px;
}
#pagenav img { #pagenav img {
width: 16px !important; width: 16px !important;
height: 16px !important; height: 16px !important;

Binary file not shown.

After

Width:  |  Height:  |  Size: 668 B

View File

@ -108,10 +108,9 @@ td a:active, td a:visited:active {
color: #FF2F85 !important; color: #FF2F85 !important;
} }
.snarkRefresh, .toggleview, .snarkConfigTitle, thead img, .snarkTorrentAction, .toggleview, .snarkConfigTitle, .snarknavbar, img, input[type="image"] {
input[type="submit"], input[type="reset"], .control, .input[type="radio"], input[type="checkbox"] {
-webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
-webkit-user-select: none;
user-select: none; user-select: none;
} }
@ -448,8 +447,9 @@ tfoot td:first-child {
padding-left: 0; padding-left: 0;
} }
tfoot th { tfoot tr:first-child th {
padding-bottom: 4px !important; vertical-align: middle;
font-weight: bold;
} }
tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) img, tfoot:nth-child(4) img { tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) img, tfoot:nth-child(4) img {
@ -457,10 +457,6 @@ tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) im
padding-right: 0 !important; padding-right: 0 !important;
} }
tfoot tr:nth-child(n+1) {
text-align: left;
}
.headerstatus { .headerstatus {
text-align: left; text-align: left;
} }
@ -540,12 +536,12 @@ tfoot tr:nth-child(n+1) {
} }
.snarkTorrents th:first-child, .snarkTorrents td:first-child { .snarkTorrents th:first-child, .snarkTorrents td:first-child {
width: 30px; width: 1%;
white-space: nowrap; white-space: nowrap;
} }
.snarkTorrents th:last-child, .snarkTorrents td:last-child { .snarkTorrents th:last-child, .snarkTorrents td:last-child {
width: 36px; width: 1%;
white-space: nowrap; white-space: nowrap;
} }
@ -553,10 +549,6 @@ tfoot tr:nth-child(n+1) {
vertical-align: top; vertical-align: top;
} }
.snarkTorrents tfoot th:nth-child(2) {
text-align: center;
}
.snarkTorrents td:first-child, .snarkTorrents td:nth-child(2) { .snarkTorrents td:first-child, .snarkTorrents td:nth-child(2) {
padding: 2px 0 !important; padding: 2px 0 !important;
} }
@ -571,8 +563,6 @@ tfoot tr:nth-child(n+1) {
} }
.snarkTorrents td:nth-child(4) { .snarkTorrents td:nth-child(4) {
text-align: center;
padding-right: 4px !important;
font-weight: bold; font-weight: bold;
} }
@ -586,6 +576,7 @@ td {
color: #2f1500 !important; color: #2f1500 !important;
opacity: 1; opacity: 1;
font-size: 8pt; font-size: 8pt;
vertical-align: middle;
} }
td:first-child { td:first-child {
@ -598,7 +589,7 @@ td:first-child {
} }
.snarkTorrentName { .snarkTorrentName {
padding: 3px 0; padding-left: 5px !important;
line-height: 110%; line-height: 110%;
} }
@ -612,7 +603,7 @@ td:first-child {
padding: 1px 1px 1px 1px !important; padding: 1px 1px 1px 1px !important;
margin: 0 !important; margin: 0 !important;
text-align: center; text-align: center;
width: 68px; width: 1%;
white-space: nowrap; white-space: nowrap;
} }
@ -668,7 +659,6 @@ _:-ms-lang(x), .snarkTorrentAction {
.snarkTorrentStatus { .snarkTorrentStatus {
padding: 2px 0; padding: 2px 0;
line-height: 100%;
} }
.snarkTorrentStatus:first-child { .snarkTorrentStatus:first-child {
@ -689,7 +679,7 @@ _:-ms-lang(x), .snarkTorrentAction {
font-size: 8pt; font-size: 8pt;
font-weight: bold; font-weight: bold;
padding: 0 3px; padding: 0 3px;
line-height: 120% !important; /* line-height: 120% !important;*/
} }
.snarkTorrentDownloaded { .snarkTorrentDownloaded {
@ -732,7 +722,11 @@ _:-ms-lang(x), .snarkTorrentOdd td, .snarkTorrentEven td, .snarkTorrentInfo td,
table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:hover { table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:hover {
background: #f9efcf !important; background: #f9efcf !important;
background: linear-gradient(to right, #700 3px, #f9efcf 3px) !important; background: linear-gradient(to right, rgba(119, 0, 0, 0.7) 3px, #f9efcf 3px) !important;
}
tr:hover .percentBarText {
opacity: 1;
} }
@media screen and (-webkit-min-device-pixel-ratio:0) { @media screen and (-webkit-min-device-pixel-ratio:0) {
@ -822,6 +816,8 @@ td.snarkFileIcon:first-child {
padding: 4px 2px; padding: 4px 2px;
font-weight: bold; font-weight: bold;
color: #727 !important; color: #727 !important;
width: 1%;
white-space: nowrap;
} }
.snarkFileStatus { .snarkFileStatus {
@ -831,6 +827,7 @@ td.snarkFileIcon:first-child {
font-size: 8pt; font-size: 8pt;
text-align: left; text-align: left;
white-space: nowrap; white-space: nowrap;
width: 140px;
} }
.snarkTorrentETA { .snarkTorrentETA {
@ -905,6 +902,10 @@ td.snarkFileIcon:first-child {
border-top: none !important; border-top: none !important;
} }
.snarkDirInfo thead th:nth-child(n+2) {
text-align: center;
}
.snarkDirInfo thead img { .snarkDirInfo thead img {
margin: 0 -1px 0 0 !important; margin: 0 -1px 0 0 !important;
padding: 0 3px !important; padding: 0 3px !important;
@ -936,7 +937,7 @@ thead img.disable, img.disable:hover {
text-align: center !important; text-align: center !important;
vertical-align: middle; vertical-align: middle;
padding: 5px !important; padding: 5px !important;
width: 160px width: 160px;
} }
#setPriority .headerpriority { #setPriority .headerpriority {
@ -958,6 +959,107 @@ thead img.disable, img.disable:hover {
display: none; display: none;
} }
/* download bars */
.snarkTorrents th:nth-child(6) {
text-align: right;
}
.snarkTorrentDownloaded {
width: 110px !important;
text-align: right !important;
}
.snarkDirInfo .snarkFileStatus img {
float: left;
margin: 1px 10px 0 7px;
}
.percentBarOuter, .percentBarText {
width: 110px;
}
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter {
width: 90px;
}
.percentBarOuter {
background: #fff7ef;
background: repeating-linear-gradient(135deg, #fff7ef 1px, #fff7ef 5px, #efdfd1 6px, #efdfd1 11px);
border: 1px solid #998;
border-bottom: 1px solid #776;
border-right: 1px solid #776;
box-shadow: none;
opacity: 1;
margin: 0;
}
.snarkTorrentDownloaded .percentBarOuter {
margin-left: 5px;
}
.peerinfo .percentBarOuter, .peerinfo .percentBarText {
width: 70px;
}
.peerinfo .percentBarText {
padding: 1px;
color: #3f3927;
}
.snarkDirInfo .percentBarOuter {
float: left;
}
.percentBarInner {
border: none;
height: 100%;
background: #cfc1b5;
background: linear-gradient(to bottom, rgba(255, 247, 239, 0.8) 0%, rgba(255, 247, 239, 0.8) 50%, rgba(207, 193, 181, 0.9) 50%, rgba(207, 193, 181, 1) 100%);
box-shadow: inset 0 0 0 1px #efe6e0;
vertical-align: middle;
height: 16px;
}
.snarkTorrentDownloaded .percentBarInner {
background: linear-gradient(to bottom, rgba(255, 247, 239, 0.75) 0%, rgba(255, 247, 239, 0.75) 50%, rgba(207, 193, 181, 0.8) 50%, rgba(207, 193, 181, 0.9) 100%), linear-gradient(to right, rgba(255, 100, 0, 0.5) 37px, rgba(255, 255, 0, 0.5) 74px, rgba(0, 255, 0, 0.5));
}
.snarkDirInfo .percentBarInner {
background: linear-gradient(to bottom, rgba(255, 247, 239, 0.75) 0%, rgba(255, 247, 239, 0.75) 50%, rgba(207, 193, 181, 0.8) 50%, rgba(207, 193, 181, 0.9) 100%), linear-gradient(to right, rgba(255, 100, 0, 0.5) 30px, rgba(255, 255, 0, 0.5) 60px, rgba(0, 255, 0, 0.5));
}
.percentBarText, .percentBarOuter {
text-align: center;
vertical-align: middle;
}
.percentBarText {
text-align: center;
font-weight: bold;
white-space: nowrap;
color: #919;
opacity: 0;
transition: ease opacity 0.3s 0.5s;
vertical-align: middle;
}
.snarkTorrentDownloaded .percentBarText {
line-height: 16px;
}
.snarkDirInfo .percentBarText {
padding: 1px 0;
}
.percentBarText:hover, .percentBarText:focus {
opacity: 0.9;
transition: ease opacity 0.3s;
filter: none;
}
/* end download bars */
.choked { .choked {
color: #a00000 !important; color: #a00000 !important;
} }
@ -1149,26 +1251,6 @@ hr {
text-align: center; text-align: center;
} }
hr.debug {
width: 100%;
margin: 5px 0;
background: linear-gradient(to right, #6f533e 40%, #9f8877);
}
hr.debug:nth-child(n+7) {
margin: 2px 0 3px;
}
hr.debug:last-child {
display: none;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
hr.debug:nth-child(n+7) {
margin: -10px 0 4px;
}
}
/* buttons & inputs */ /* buttons & inputs */
.script { .script {
@ -1201,7 +1283,6 @@ a.control, a.controld {
a.controld { a.controld {
color: #f60; color: #f60;
font-weight: normal; font-weight: normal;
/* display: none;*/
} }
a.control:hover, a.control:focus { a.control:hover, a.control:focus {
@ -1636,6 +1717,9 @@ code, tt {
padding: 0 1px; padding: 0 1px;
font-weight: bold; font-weight: bold;
font-family: "DejaVu Sans Mono", "Droid Sans Mono", "Lucida Console", monospace; font-family: "DejaVu Sans Mono", "Droid Sans Mono", "Lucida Console", monospace;
-moz-user-select: all;
-webkit-user-select: all;
user-select: all;
} }
.routerdown { .routerdown {
@ -1821,6 +1905,116 @@ code, tt {
margin: 2px 3px !important; margin: 2px 3px !important;
} }
.dhtDebug th {
padding: 0 10px 10px;
background: #fff;
background: repeating-linear-gradient(to bottom, #ecebdd 1px, #efebdd 2px, #ebe5d5 5px);
word-break: break-all;
}
hr.debug {
width: 100%;
height: 1px;
margin: 5px 0;
background: linear-gradient(to right, #6f533e 40%, #9f8877);
border-bottom: 1px solid #fff;
}
@-moz-document url-prefix() {
hr.debug {
height: 2px;
}
}
hr.debug + hr {
margin-bottom: -1px;
}
hr.debug:first-of-type {
background: transparent;
border: none;
margin-top: 10px;
margin-bottom: -5px;
}
hr.debug:nth-child(n+7) {
margin: 4px 0;
}
hr.debug:last-child {
background: transparent;
border: none;
margin-bottom: 5px !important;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
hr.debug:first-of-type {
background: transparent;
margin-top: -5px;
margin-bottom: -5px;
}
hr.debug:nth-child(n+7) {
margin: -10px 0 4px;
}
hr.debug:last-child {
background: transparent;
margin-bottom: 0 !important;
}
}
/* debug panel */
#dhtdebugPanel {
background: linear-gradient(to bottom, #efefef, #cfc7c2);
border: 1px solid #212;
border-top: none;
border-radius: 0 0 2px 2px;
box-shadow: 0 0 0 1px #efe6e0 inset, 0 0 1px 0 #4f3d36;
text-align: center;
padding-bottom: 13px;
}
#dhtDebugInner {
text-align: left;
margin: -24px 0 -13px;
padding: 0 8px 1px;
background: #efefef;
border-radius: 0 0 2px 2px;
}
.dhtDebug th b:first-of-type, .dhtDebug th b:first-of-type + br + hr.debug {
display: none;
}
/* toggle debug view */
input#toggle_debug:not(checked) + label {
padding-bottom: 2px;
}
input#toggle_debug:not(checked) + label > img {
margin-right: -2px !important;
}
input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
.iframed input#toggle_debug:not(checked) + label + #dhtDebugInner {
display: block;
}
.iframed input#toggle_debug:checked + label + #dhtDebugInner {
display: none;
}
/* end debug panel */
/* end debug */ /* end debug */
.peerinfo td:first-child { .peerinfo td:first-child {
@ -1838,6 +2032,10 @@ code, tt {
font-weight: bold; font-weight: bold;
} }
#totals tt {
line-height: 170%;
}
/* Resource Errors */ /* Resource Errors */
.resourceError { .resourceError {
@ -1948,6 +2146,7 @@ td#bwHelp a {
display: inline-block; display: inline-block;
white-space: nowrap; white-space: nowrap;
font-style: normal; font-style: normal;
margin-left: 4px;
} }
/* end configs */ /* end configs */
@ -2045,6 +2244,26 @@ b.alwaysShow {
padding-bottom: 3px; padding-bottom: 3px;
} }
.percentBarOuter, .percentBarText, .snarkTorrentDownloaded {
width: 100px !important;
}
.snarkTorrentDownloaded .percentBarInner {
background: linear-gradient(to bottom, rgba(255, 247, 239, 0.75) 0%, rgba(255, 247, 239, 0.75) 50%, rgba(207, 193, 181, 0.8) 50%, rgba(207, 193, 181, 0.9) 100%), linear-gradient(to right, rgba(255, 100, 0, 0.5) 33px, rgba(255, 255, 0, 0.5) 66px, rgba(0, 255, 0, 0.5));
}
.snarkDirInfo .percentBarInner {
background: linear-gradient(to bottom, rgba(255, 247, 239, 0.75) 0%, rgba(255, 247, 239, 0.75) 50%, rgba(207, 193, 181, 0.8) 50%, rgba(207, 193, 181, 0.9) 100%), linear-gradient(to right, rgba(255, 100, 0, 0.5) 23px, rgba(255, 255, 0, 0.5) 47px, rgba(0, 255, 0, 0.5));
}
.snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter, .peerinfo .percentBarOuter, .peerinfo .percentBarText {
width: 70px !important;
}
.snarkFileStatus {
width: 120px;
}
.snarkTorrents tt { .snarkTorrents tt {
background: none; background: none;
color: #030; color: #030;
@ -2081,6 +2300,12 @@ b.alwaysShow {
transition: ease width 0.5s 0.5s; transition: ease width 0.5s 0.5s;
} }
.snarkTorrentAction input[type="image"], .snarkTorrents th:last-child input[type="image"] {
max-height: 9px;
margin-top: 2px;
margin-bottom: 2px;
}
.snarkRefresh:nth-child(n+2) { .snarkRefresh:nth-child(n+2) {
padding: 4px 8px 4px 24px !important; padding: 4px 8px 4px 24px !important;
background-size: 14px auto, 100% 100%, 100% 100% !important; background-size: 14px auto, 100% 100%, 100% 100% !important;
@ -2113,6 +2338,23 @@ _:-ms-lang(x), .snarkRefresh:link, .snarkRefresh:visited {
#pagenav img { #pagenav img {
height: 14px; height: 14px;
} }
.snarkTorrentDownloaded .percentBarOuter {
margin-left: 0;
}
.snarkTorrents tfoot tr:first-child th {
padding-top: 2px;
padding-bottom: 2px;
line-height: 120%;
}
}
@media screen and (max-width: 1400px) {
#dhtDebugInner {
margin-top: -21px !important;
padding-top: 15px;
}
} }
@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 1200px) { @media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 1200px) {
@ -2137,6 +2379,12 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, .snarkFileName, a.control, input
padding-bottom: 3px !important; padding-bottom: 3px !important;
} }
.snarkTorrents tfoot tr:first-child th {
padding-top: 4px;
padding-bottom: 4px;
line-height: 150%;
}
.peerinfo tt { .peerinfo tt {
display: inline-block; display: inline-block;
margin: 0 3px; margin: 0 3px;
@ -2211,7 +2459,6 @@ select {
.snarkTorrentDownloaded { .snarkTorrentDownloaded {
white-space: nowrap; white-space: nowrap;
padding: 0 8px;
} }
thead a img, thead img { thead a img, thead img {
@ -2234,19 +2481,10 @@ thead a img, thead img {
padding-bottom: 2px !important; padding-bottom: 2px !important;
} }
.snarkTorrentInfo td, .snarkDirInfo td {
padding-top: 5px !important;
padding-bottom: 5px !important;
}
.peerinfo tt { .peerinfo tt {
margin: 1px 4px; margin: 1px 4px;
} }
.snarkTorrentName {
padding-left: 2px;
}
.snarkTorrentStatus b, .dirInfoComplete { .snarkTorrentStatus b, .dirInfoComplete {
margin-right: 4px; margin-right: 4px;
} }