diff --git a/apps/i2psnark/java/src/org/klomp/snark/web/I2PSnarkServlet.java b/apps/i2psnark/java/src/org/klomp/snark/web/I2PSnarkServlet.java index 0a6e096b46..0572dfff7a 100644 --- a/apps/i2psnark/java/src/org/klomp/snark/web/I2PSnarkServlet.java +++ b/apps/i2psnark/java/src/org/klomp/snark/web/I2PSnarkServlet.java @@ -452,7 +452,7 @@ public class I2PSnarkServlet extends BasicServlet { String currentSort = req.getParameter("sort"); boolean showSort = total > 1; - out.write(""); + out.write(""); String sort = ("2".equals(currentSort)) ? "-2" : "2"; if (showSort) { out.write(""); - out.write("\n"); + out.write("\n"); if (_manager.util().connected() && !snarks.isEmpty()) { out.write("
\n"); + out.write("
\n"); } out.write("\n"); // cycle through sort by name or type @@ -510,7 +510,7 @@ public class I2PSnarkServlet extends BasicServlet { if (total > 0 && (start > 0 || total > pageSize)) { writePageNav(out, req, start, pageSize, total, noThinsp); } - out.write("\n"); + out.write("\n"); if (_manager.util().connected() && !snarks.isEmpty()) { if (showSort) { sort = ("4".equals(currentSort)) ? "-4" : "4"; @@ -525,7 +525,7 @@ public class I2PSnarkServlet extends BasicServlet { if (showSort) out.write(""); } - out.write("\n"); + out.write("\n"); // cycle through sort by size or downloaded boolean isDlSort = false; if (showSort) { @@ -550,7 +550,7 @@ public class I2PSnarkServlet extends BasicServlet { : _t("Downloaded"))); if (showSort) out.write(""); - out.write("\n"); + out.write("\n"); boolean isRatSort = false; if (!snarks.isEmpty()) { // cycle through sort by uploaded or ratio @@ -582,7 +582,7 @@ public class I2PSnarkServlet extends BasicServlet { if (showSort) out.write(""); } - out.write("\n"); + out.write("\n"); if (_manager.util().connected() && !snarks.isEmpty()) { if (showSort) { sort = ("8".equals(currentSort)) ? "-8" : "8"; @@ -597,7 +597,7 @@ public class I2PSnarkServlet extends BasicServlet { if (showSort) out.write(""); } - out.write("\n"); + out.write("\n"); if (_manager.util().connected() && !snarks.isEmpty()) { if (showSort) { sort = ("9".equals(currentSort)) ? "-9" : "9"; @@ -612,7 +612,7 @@ public class I2PSnarkServlet extends BasicServlet { if (showSort) out.write(""); } - out.write("\n"); + out.write("\n"); if (_manager.isStopping()) { out.write(" "); @@ -674,13 +674,12 @@ public class I2PSnarkServlet extends BasicServlet { if (total == 0) { out.write("" + - ""); + ""); out.write(_t("No torrents loaded.")); out.write("\n"); } else /** if (snarks.size() > 1) */ { out.write("\n" + - " "); + " "); out.write(""); out.write(_t("Totals")); out.write(": "); @@ -695,32 +694,34 @@ public class I2PSnarkServlet extends BasicServlet { if (dht != null) { int dhts = dht.size(); if (dhts > 0) { - out.write(", "); + out.write(", "); out.write(ngettext("1 DHT peer", "{0} DHT peers", dhts)); + out.write(""); } } String IPString = _manager.util().getOurIPString(); if(!IPString.equals("unknown")) { // Only truncate if it's an actual dest - out.write("; "); + out.write("; "); out.write(_t("Dest")); out.write(": "); out.write(IPString.substring(0, 4)); - out.write(""); + out.write(""); } out.write(""); out.write("\n"); if (_manager.util().connected() && total > 0) { - out.write(" " + formatSize(stats[0]) + "\n" + - " " + formatSize(stats[1]) + "\n" + - " " + formatSize(stats[2]) + "ps\n" + - " " + formatSize(stats[3]) + "ps\n" + - " "); + out.write(" " + formatSize(stats[0]) + "\n" + + " " + formatSize(stats[1]) + "\n" + + " " + formatSize(stats[2]) + "ps\n" + + " " + formatSize(stats[3]) + "ps\n" + + " "); } else { out.write(""); } + // TODO javascript handler to remember checkbox status for debug panel visibility (otherwise resets with ajax/meta refresh) if (dht != null) { if (showDebug) { out.write("\n"); @@ -1582,11 +1583,14 @@ public class I2PSnarkServlet extends BasicServlet { String txt; if (remaining == 0) { img = "seeding"; - txt = _t("Seeding"); + txt = _t("Seeding to {0} of {1} peers in swarm", curPeers, knownPeers); } else { // partial img = "complete"; txt = _t("Complete"); + if (curPeers > 0) { + txt = txt + " (" + _t("Seeding to {0} of {1} peers in swarm", curPeers, knownPeers) + ")"; + } } if (curPeers > 0 && !showPeers) { statusString = toThemeImg(img, "", txt) + "" + @@ -1606,29 +1610,29 @@ public class I2PSnarkServlet extends BasicServlet { } } else { if (isRunning && curPeers > 0 && downBps > 0 && !showPeers) { - statusString = toThemeImg("downloading", "", _t("OK")) + "" + + statusString = toThemeImg("downloading", "", _t("OK") + " (" + _t("Downloading from {0} of {1} peers in swarm", curPeers, knownPeers) + ")") + "" + "" + _t("OK") + ": " + curPeers + thinsp(noThinsp) + ngettext("1 peer", "{0} peers", knownPeers) + ""; } else if (isRunning && curPeers > 0 && downBps > 0) { - statusString = toThemeImg("downloading", "", _t("OK")) + "" + + statusString = toThemeImg("downloading", "", _t("OK") + " (" + _t("Downloading from {0} of {1} peers in swarm", curPeers, knownPeers) + ")") + "" + "" + _t("OK") + ": " + curPeers + thinsp(noThinsp) + ngettext("1 peer", "{0} peers", knownPeers); } else if (isRunning && curPeers > 0 && !showPeers) { - statusString = toThemeImg("stalled", "", _t("Stalled")) + "" + + statusString = toThemeImg("stalled", "", _t("Stalled") + " (" + _t("Connected to {0} of {1} peers in swarm", curPeers, knownPeers) + ")") + "" + "" + _t("Stalled") + ": " + curPeers + thinsp(noThinsp) + ngettext("1 peer", "{0} peers", knownPeers) + ""; } else if (isRunning && curPeers > 0) { - statusString = toThemeImg("stalled", "", _t("Stalled")) + "" + + statusString = toThemeImg("stalled", "", _t("Stalled") + " (" + _t("Connected to {0} of {1} peers in swarm", curPeers, knownPeers) + ")") + "" + "" + _t("Stalled") + ": " + curPeers + thinsp(noThinsp) + ngettext("1 peer", "{0} peers", knownPeers); } else if (isRunning && knownPeers > 0) { - statusString = toThemeImg("nopeers", "", _t("No Peers")) + "" + + statusString = toThemeImg("nopeers", "", _t("No Peers") + " (" + _t("Connected to {0} of {1} peers in swarm", curPeers, knownPeers) + ")") + "" + "" + _t("No Peers") + ": 0" + thinsp(noThinsp) + knownPeers ; } else if (isRunning) { @@ -1641,11 +1645,11 @@ public class I2PSnarkServlet extends BasicServlet { } out.write(""); - out.write(""); + out.write(""); out.write(statusString + "\n\t"); // (i) icon column - out.write(""); + out.write(""); if (isValid) { String announce = meta.getAnnounce(); if (announce == null) @@ -1660,7 +1664,7 @@ public class I2PSnarkServlet extends BasicServlet { String encodedBaseName = encodePath(fullBasename); // File type icon column - out.write("\n"); + out.write("\n"); if (isValid) { // Link to local details page - note that trailing slash on a single-file torrent // gets us to the details page instead of the file. @@ -1845,7 +1849,7 @@ public class I2PSnarkServlet extends BasicServlet { for (Peer peer : peers) { if (!peer.isConnected()) continue; - out.write(""); PeerID pid = peer.getPeerID(); @@ -1877,9 +1881,9 @@ public class I2PSnarkServlet extends BasicServlet { if (showDebug) out.write(" inactive " + (peer.getInactiveTime() / 1000) + "s"); out.write("\n\t"); - out.write(""); + out.write(""); out.write("\n\t"); - out.write(""); + out.write(""); float pct; if (isValid) { pct = (float) (100.0 * peer.completed() / meta.getPieces()); @@ -1900,9 +1904,9 @@ public class I2PSnarkServlet extends BasicServlet { //out.write("??"); } out.write("\n\t"); - out.write(""); + out.write(""); out.write("\n\t"); - out.write(""); + out.write(""); if (needed > 0) { if (peer.isInteresting() && !peer.isChoked()) { out.write(""); @@ -1924,7 +1928,7 @@ public class I2PSnarkServlet extends BasicServlet { //} } out.write("\n\t"); - out.write(""); + out.write(""); if (isValid && pct < 100.0) { if (peer.isInterested() && !peer.isChoking()) { out.write(""); @@ -1940,10 +1944,10 @@ public class I2PSnarkServlet extends BasicServlet { } } out.write("\n\t"); - out.write(""); + out.write(""); out.write("\n\t"); if (showDebug) - out.write("" + peer.getSocket() + ""); + out.write("" + peer.getSocket() + ""); } } } @@ -2448,11 +2452,8 @@ public class I2PSnarkServlet extends BasicServlet { out.write(_t("Comment Author")); out.write(":" + - "\n"); + out.write(_t("Set the author name for your comments and ratings")); + out.write("\" >\n"); // ""); //out.write(_t("Open tracker announce URLs")); @@ -2923,9 +2924,9 @@ public class I2PSnarkServlet extends BasicServlet { toThemeImg(buf, "details"); buf.append("") .append(_t("Info hash")) - .append(": ") + .append(": ") .append(hex.toUpperCase(Locale.US)) - .append("\n"); + .append("\n"); String announce = null; MetaInfo meta = snark.getMetaInfo(); @@ -3308,7 +3309,7 @@ public class I2PSnarkServlet extends BasicServlet { String rowClass = (rowEven ? "snarkTorrentEven" : "snarkTorrentOdd"); rowEven = !rowEven; - buf.append(""); + buf.append(""); // Get completeness and status string boolean complete = false; @@ -3358,7 +3359,7 @@ public class I2PSnarkServlet extends BasicServlet { path = encodePath(path); String icon = toIcon(item); - buf.append(""); + buf.append(""); if (complete) { buf.append(""); // thumbnail ? @@ -3373,19 +3374,19 @@ public class I2PSnarkServlet extends BasicServlet { } else { buf.append(toImg(icon)); } - buf.append(""); + buf.append(""); if (complete) buf.append(""); buf.append(DataHelper.escapeHTML(item.getName())); if (complete) buf.append(""); - buf.append(""); + buf.append(""); if (!item.isDirectory()) buf.append(DataHelper.formatSize2(length)).append('B'); - buf.append(""); + buf.append(""); //buf.append(dfmt.format(new Date(item.lastModified()))); buf.append(status); - buf.append(""); + buf.append(""); if (showPriority) { buf.append(""); if ((!complete) && (!item.isDirectory())) { @@ -3413,7 +3414,7 @@ public class I2PSnarkServlet extends BasicServlet { } buf.append(""); } - buf.append("\n"); + buf.append("\n"); } if (showSaveButton) { buf.append("" + @@ -3449,17 +3450,23 @@ public class I2PSnarkServlet extends BasicServlet { int myRating = 0; CommentSet comments = snark.getComments(); - buf.append("
") + buf.append("
\n\n"); + buf.append("\n"); + + // new rating / comment form + buf.append("\n"); + if (er) { + buf.append(""); + } + if (esc) { + buf.append(""); + } else { + buf.append(""); + } + buf.append("\n"); + buf.append("\n"); if (comments != null) { synchronized(comments) { @@ -3501,7 +3541,7 @@ public class I2PSnarkServlet extends BasicServlet { } else { buf.append(_t("Average Rating")).append(":"); } @@ -3513,38 +3553,7 @@ public class I2PSnarkServlet extends BasicServlet { } } - // new rating / comment form - buf.append(""); - } - if (esc) { - buf.append(""); - } else { - buf.append(""); - } - buf.append("
") .append(_t("Ratings and Comments")); if (esc && _manager.util().getCommentsName().length() == 0) { buf.append("   "); - buf.append(_t("Author name required to post comments")); + buf.append(_t("Author name required to rate or comment")); buf.append("  "); buf.append(_t("[Configure]")); buf.append(""); + } else { + buf.append("   "); + buf.append(DataHelper.escapeHTML(_manager.util().getCommentsName())); + buf.append(""); } - buf.append("
"); + buf.append("
"); buf.append(_t("Comments")); buf.append(":
\n\n
"); - buf.append(_t("No community ratings currently available for this torrent")); + buf.append(_t("No community ratings currently available")); } buf.append("
"); - if (er) { - buf.append("\n"); - buf.append("
"); + buf.append("
"); // TODO disable / enable comments for this torrent // existing ratings / comments table int ccount = 0; @@ -3553,19 +3562,6 @@ public class I2PSnarkServlet extends BasicServlet { fmt.setTimeZone(SystemVersion.getSystemTimeZone(_context)); buf.append(""); - // TODO Make .commentText and .commentDelete columns display only when comments are enabled - // buf.append(""); - while (iter.hasNext()) { Comment c = iter.next(); buf.append("\n"); } @@ -3613,6 +3609,7 @@ public class I2PSnarkServlet extends BasicServlet { } else if (esc) { //buf.append(_t("No comments for this torrent")); } // iter != null + buf.append(""); } /** diff --git a/history.txt b/history.txt index 940edd78f7..e867a27a7a 100644 --- a/history.txt +++ b/history.txt @@ -15,6 +15,20 @@ - Update fallback images for en and fr - Update overview text - added tabindex="0" to destination addresses, highlighted on :focus + * i2psnark: + - Reorder .snarkCommentInfo sections so my rating / average rating is located + directly above posted comments/ratings in .snarkComments + - If author name for comments is configured, display it in .snarkCommentInfo + table header + - Full status tooltips for status icons in .snarkTorrents + - Rework td/th classes for .snarkTorrents so each column (both th + td) now + belongs to a given class + - Stop .snarkTorrentStatus class being incorrectly applied to .peerinfo + columns + - Spans for DHT peers / Dest in #totals, .snarkTorrentInfo info hash + - Delete icon for delete comments td + - Overhaul .snarkTorrents column widths + - CSS tidyups 2017-05-25 zzz * Crypto: Fix AES NPE on 4-core RPi 2nd try (ticket #1989) diff --git a/installer/resources/themes/snark/classic/snark.css b/installer/resources/themes/snark/classic/snark.css index 0eee69ebf3..ba61966c92 100644 --- a/installer/resources/themes/snark/classic/snark.css +++ b/installer/resources/themes/snark/classic/snark.css @@ -319,37 +319,44 @@ body.iframed { text-align: center; } -.snarkTorrents th:nth-child(4), -.snarkTorrents th:nth-child(5), -.snarkTorrents th:nth-child(6), -.snarkTorrents th:nth-child(7), -.snarkTorrents th:nth-child(8), -.snarkTorrents th:nth-child(9), -.snarkTorrents th:last-child { +#pagenav, .snarkTorrentETA, .snarkTorrentDownloaded, .snarkTorrentUploaded, .snarkTorrentRateDown, .snarkTorrentRateUp, .snarkTorrentAction { text-align: center; } -.snarkTorrents td:nth-child(6), -.snarkTorrents td:nth-child(7), -.snarkTorrents td:nth-child(8) { - text-align: center !important; +.snarkTorrentAction { + padding-right: 2px !important; } -table.snarkTorrents { +.snarkTorrents { margin-top: -1px !important; } -.snarkTorrents td:nth-child(1) { - width: 24px !important; -} - -.snarkTorrents td:nth-child(3), -.snarkTorrents td:nth-child(4) { +.snarkTrackerDetails, .snarkTorrentDetails { width: 16px !important; text-align: center !important; font-weight: bold; } +.snarkGraphicStatus, .snarkTorrentStatus { + white-space: nowrap; + width: 1%; +} + +.snarkGraphicStatus { + width: 24px !important; +} + + +.snarkTorrentETA, .snarkTorrentUploaded, .snarkTorrentRateDown, .snarkTorrentRateUp { + width: 5%; + min-width: 40px; + white-space: nowrap; +} + +.snarkTorrents th:empty + th:empty, .snarkTorrents td:empty + td:empty, .snarkTorrents th:last-child:empty, .snarkTorrents td:last-child:empty { + width: 0 !important; +} + pre { font: 8pt "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", monospace; font-weight: bold !important; @@ -522,7 +529,7 @@ tfoot tr:nth-child(n+1) { text-align: center !important; } -table.snarkTorrents { +.snarkTorrents { margin-top: -1px !important; border: none; } @@ -605,7 +612,7 @@ tt { .snarkTorrentInfo td:first-child { width: 20px !important; - padding: 3px 4px 4px!important; + padding: 4px !important; } .snarkTorrentInfo input[type="submit"] { @@ -627,7 +634,7 @@ tt { border-top: 1px solid #89f !important; } -table.SnarkTorrentInfo { +.SnarkTorrentInfo { margin-bottom: 1px !important; border-bottom: 1px solid #89f; background: #eef; @@ -653,11 +660,18 @@ table.SnarkTorrentInfo { text-align: left; } +#infohash { + color: #090; + -moz-user-select: all; + -webkit-user-select: all; + user-select: all; +} + /* end torrent info */ /* torrent directory */ -table.SnarkDirInfo { +.SnarkDirInfo { margin-top: 10px !important; margin-bottom: 0; border-bottom: 1px solid #89f; @@ -721,7 +735,7 @@ table.SnarkDirInfo { margin: 5px; } -table.SnarkDirInfo img { +.SnarkDirInfo img { max-width: 16px; max-height: 16px; } @@ -826,8 +840,9 @@ td:first-child { /* torrent control buttons */ .snarkTorrentAction { - margin: 0 !important; - padding: 1px 1px 1px 1px !important; + width: 1%; + white-space: nowrap; + padding: 1px 2px 1px 1px !important; text-align: center !important; } @@ -840,8 +855,7 @@ td:first-child { box-shadow: 0 0 1px 1px #f90; } -.snarkTorrentAction input[type="image"], -.snarkTorrents th:last-child input[type="image"] { +.snarkTorrentAction input[type="image"] { padding: 3px !important; background: #339; background: linear-gradient(to bottom, #fff 0%, #fff 50%, #ddf 51%, #ddf 100%); @@ -852,34 +866,17 @@ td:first-child { height: 10px; } -.snarkTorrentAction input[type="image"]:hover, -.snarkTorrentAction input[type="image"]:focus, -.snarkTorrents th:last-child input[type="image"]:hover, -.snarkTorrents th:last-child input[type="image"]:focus { - border: 1px solid #f60; +.snarkTorrentAction input[type="image"]:hover, .snarkTorrentAction input[type="image"]:focus { + border: 1px solid #f60 !important; filter: drop-shadow(0 0 1px #f60); } -.snarkTorrentAction input[type="image"]:active, -.snarkTorrents th:last-child input[type="image"]:active { +.snarkTorrentAction input[type="image"]:active { background: linear-gradient(to bottom, #ddf 0%, #ddf 50%, #99f 51%, #99f 100%); box-shadow: inset 0 0 0 1px #fff, inset 2px 2px 2px #333; filter: none !important; } -.snarkTorrents th:last-child input[type="image"]:hover, -.snarkTorrents td:last-child input[type="image"]:hover, -.snarkTorrents th:last-child input[type="image"]:focus, -.snarkTorrents td:last-child input[type="image"]:focus { /* borders on hover only for torrent control buttons, otherwise drop-shadow */ - border: 1px solid #f60 !important; -} - -td.snarkTorrentAction { - width: 1%; - padding-right: 2px !important; - white-space: nowrap; -} - /* end torrent control buttons */ .snarkTorrentNoneLoaded { @@ -1494,9 +1491,16 @@ input[size="85"] { margin-left: 5px !important; } +select, input.r { + min-width: 120px; +} + +input[name="nofilter_commentsName"] { + width: 250px; +} + select { font: 9pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", Verdana, "Bitstream Vera Sans", "DejaVu Sans", "Lucida Grande", Helvetica, sans-serif; - min-width: 100px; margin: 2px 4px 2px 0; padding: 4px 16px 4px 2px; cursor: pointer; @@ -1737,7 +1741,7 @@ div.configsectionpanel td:first-child { border: 1px solid #89f; } -table.trackerconfig td:first-child { +.trackerconfig td:first-child { width: 24px !important; padding: 5px 2px; } @@ -2272,6 +2276,7 @@ td#bwHelp a { white-space: nowrap; display: inline-block; margin-right: 7px; + vertical-align: middle; } #filecheck { @@ -2285,9 +2290,213 @@ td#bwHelp a { margin: 8px; } - /* end Resource Errors */ +/* Comments Section */ + +.snarkCommentInfo, .snarkComments { + margin: 10px 0 0 !important; + border: 1px solid #bbf; + border-left: none; + border-right: none; + background: #eef; +} + +.snarkComments { + margin-top: -1px !important; +} + +.snarkCommentInfo th, .snarkComments th { + padding: 8px 5px; +} + +.snarkCommentInfo th { + background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #fff, #eef) #fff; + padding-left: 30px !important; +} + +.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(odd) { + border-top: 1px solid #bbf; + background: rgba(240, 240, 255, 0.5) #fff; +} + +.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(even) { + border-top: 1px solid #bbf; + background: rgba(220, 220, 255, 0.5); +} + +.snarkCommentInfo th { + padding: 8px 5px; +} + +.snarkCommentInfo td, .snarkComments td { + padding: 8px 5px; +} + +.snarkCommentInfo td:first-child { + white-space: nowrap; +} + +.snarkCommentInfo td:first-child { + font-weight: bold; +} + +.snarkCommentInfo input.accept { + float: right; + margin-right: 5px !important; +} + +.snarkCommentInfo textarea { + font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", Verdana, "Bitstream Vera Sans", "DejaVu Sans", "Lucida Grande", Helvetica, sans-serif !important; + font-weight: normal; + width: 100%; + min-height: 64px; + height: 64px; + resize: vertical; + opacity: 0.8; +} + +.snarkCommentInfo textarea:focus { + opacity: 1; +} + +.snarkComments th { + text-align: left; +} + +.commentRating, .commentAuthor { + width: 1%; +} + +#nameRequired { + float: right; + margin-right: 5px; +} + +#nameRequired a { + font-weight: bold; +} + +.commentRating { + padding-right: 10px !important; +} + +.commentRating img { + margin: 0; + padding: 0; + height: 16px; + width: 16px; +} + +.commentText { + white-space: normal; + text-align: justify; + width: 90%; +} + +.commentDate { + width: 100px; + background: url(images/clock.png) left center no-repeat; + padding-left: 20px !important; +} + +.snarkCommentInfo td:first-child, .commentAuthor { + width: 160px !important; + min-width: 160px !important; + padding-right: 2px; +} + +.snarkCommentInfo td:last-child, .snarkComments td:last-child { + width: 1% !important; +} + +.snarkComments td { + white-space: nowrap; +} + +.commentAuthorName { + background: url(images/author.png) left center no-repeat; + padding-left: 20px; +} + +.commentWrapper { + border: 1px solid #bbf; + margin: 2px 0; + padding: 8px 10px 8px 26px; + border-radius: 3px; + box-shadow: inset 0 0 0 1px #fff, 0 0 1px 0 rgba(0,0,0,0.3); + background: url(images/comment.png) 6px center no-repeat #eef; + background-blend-mode: luminosity; +} + +#commentsConfig .optbox { + vertical-align: middle !important; +} + +.snarkComments select { + margin-right: 0 !important; +} + +#commentDeleteAction { + background: #fff; +} + +#commentDeleteAction td { + padding: 8px 6px; + border-top: 1px solid #89f; + border-bottom: 1px solid #89f; +} + +.commentAction, .commentDelete { + width: 1%; + white-space: nowrap; + padding-left: 0; +} + +.addCommentText, .commentText { + padding-right: 0; +} + +.commentAction input[type="submit"] { + margin-top: 3px; + margin-bottom: 3px; +} + +.commentDelete { + background: url(../ubergine/images/nuke.png) 2px center no-repeat; + text-align: left; + padding-left: 24px !important; +} + +#newRating td:first-child { + text-align: right; +} + +#newRating select { + width: 90%; +} + +#myRating td:empty { + padding: 0 !important; + border-top: none !important; + border-bottom: none !important; +} + +#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ + min-height: 1px !important; +} + +.commentRating img { + margin: 0 0 4px; + padding: 0; + font-size: 14pt; + color: #FF7200; + text-shadow: 0 0 1px #900; + filter: none; +} + +/* end Comments section */ + /* MS Edge fix */ _:-ms-lang(x), * { filter: none !important; @@ -2380,7 +2589,7 @@ body { margin-bottom: 0 !important; } -table.SnarkDirInfo { +.SnarkDirInfo { margin-top: 4px !important; } @@ -2448,7 +2657,7 @@ body, th, td, table a, input, input[type="text"], input.r, input[name="nofilter_ } @media screen and (min-width: 1400px) { -body, th, td, table a, input, input[type="text"], input.r, input[name="nofilter_dataDir"], select, textarea, textarea[name="i2cpOpts"], .snarkAddInfo, code { +body, th, td, table a, input, input[type="text"], input.r, input[name="nofilter_dataDir"], select, textarea, textarea[name="i2cpOpts"], .snarkAddInfo, code, .snarkCommentInfo textarea { font-size: 10pt !important; } @@ -2479,194 +2688,3 @@ td.snarkTorrentDownloaded { } /* end responsive layout */ -/* Comments Section */ -/* TODO: merge with other rules where applicable */ - -.snarkCommentInfo, .snarkComments { - margin: 10px 0 0 !important; - border: 1px solid #bbf; - border-left: none; - border-right: none; - background: #eef; -} - -.snarkCommentInfo th, .snarkComments th { - padding: 8px 5px; -} - -.snarkCommentInfo th { - background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #fff, #eef) #fff; - padding-left: 30px !important; -} - -.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(even) { - border-top: 1px solid #bbf; - background: rgba(240, 240, 255, 0.5) #fff; -} - -.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(odd) { - border-top: 1px solid #bbf; - background: rgba(220, 220, 255, 0.5); -} - -.snarkCommentInfo th { - padding: 8px 5px; -} - -.snarkCommentInfo td, .snarkComments td { - padding: 8px 5px; -} - -.snarkCommentInfo td:first-child { - white-space: nowrap; -} - -.snarkCommentInfo td:first-child { - font-weight: bold; -} - -.snarkCommentInfo input.accept { - float: right; - margin-right: 5px !important; -} - -.snarkCommentInfo textarea { /* remember to set 10pt @ > 1400px */ - font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", Verdana, "Bitstream Vera Sans", "DejaVu Sans", "Lucida Grande", Helvetica, sans-serif !important; - font-weight: normal; - width: 100%; - min-height: 64px; - height: 64px; - resize: vertical; - opacity: 0.8; -} - -.snarkCommentInfo textarea:focus { - opacity: 1; -} - -.snarkComments th { - text-align: left; -} - -.commentRating, .commentAuthor { - width: 1%; -} - -#nameRequired { - float: right; - margin-right: 5px; -} - -#nameRequired a { - font-weight: bold; -} - -.commentRating { - padding-right: 10px !important; -} - -.commentRating img { - margin: 0; - padding: 0; - height: 16px; - width: 16px; -} - -.commentText { - white-space: normal; - text-align: justify; - width: 80%; -} - -.commentDate { - width: 100px; - background: url(images/clock.png) left center no-repeat; - padding-left: 20px !important; -} - -.snarkCommentInfo td:first-child, .commentAuthor { - width: 180px !important; - padding-right: 2px; -} - -.snarkCommentInfo td:last-child, .snarkComments td:last-child { - width: 1% !important; -} - -.snarkComments td { - white-space: nowrap; -} - -.commentAuthorName { - background: url(images/author.png) left center no-repeat; - padding-left: 20px; -} - -.commentWrapper { - border: 1px solid #bbf; - margin: 2px 0; - padding: 8px 10px 8px 26px; - border-radius: 3px; - box-shadow: inset 0 0 0 1px #fff, 0 0 1px 0 rgba(0,0,0,0.3); - background: url(images/comment.png) 6px center no-repeat #eef; - background-blend-mode: luminosity; -} - -#commentsConfig .optbox { - vertical-align: middle !important; -} - -.snarkComments select { - margin-right: 0 !important; -} - -#commentDeleteAction { - background: #fff; -} - -#commentDeleteAction td { - padding: 0 6px; - border-top: 1px solid #89f; - border-bottom: 1px solid #89f; -} - -.commentAction, .commentDelete { - width: 1%; - white-space: nowrap; - min-width: 180px !important; - padding-left: 0; -} - -.addCommentText, .commentText { - padding-right: 0; -} - -.commentAction input[type="submit"] { - margin-top: 10px; - margin-bottom: 10px; -} - -.commentDelete { - text-align: left; -} - -#myRating td:empty { - padding: 0 !important; - border-top: none !important; - border-bottom: none !important; -} - -#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ - min-height: 1px !important; -} - -.commentRating img { - margin: 0 0 4px; - padding: 0; - font-size: 14pt; - color: #FF7200; - text-shadow: 0 0 1px #900; - filter: none; -} - -/* end Comments section */ \ No newline at end of file diff --git a/installer/resources/themes/snark/dark/snark.css b/installer/resources/themes/snark/dark/snark.css index 5369397546..2f30d72719 100644 --- a/installer/resources/themes/snark/dark/snark.css +++ b/installer/resources/themes/snark/dark/snark.css @@ -314,10 +314,6 @@ table { opacity: 1 !important; } -tr { - opacity: 1; -} - thead, tfoot { background: #000; } @@ -445,38 +441,53 @@ tfoot tr:nth-child(n+1) { margin-left: 20px !important; } -.SnarkTorrents td:nth-child(6), .SnarkTorrents td:nth-child(7), .SnarkTorrents td:nth-child(8) { +.snarkTorrentETA, .snarkTorrentDownloaded, .snarkTorrentUploaded { text-align: center !important; } -table.SnarkTorrents { +.SnarkTorrents { margin-top: -1px !important; } -.snarkTorrents th { - text-align: left; -} - .snarkTorrents td { line-height: 120%; text-align: left; font-size: 8pt !important; } -.snarkTorrents td:nth-child(1) { +.snarkGraphicStatus { width: 24px !important; } -.snarkTorrents td:nth-child(3), .SnarkTorrents td:nth-child(4) { +.snarkTrackerDetails, .SnarkTorrentDetails { width: 16px !important; padding: 0 !important; text-align: center !important; } -.snarkTorrents td:nth-child(3) { +.snarkTrackerDetails { text-align: right !important; } +.snarkGraphicStatus, .snarkTorrentStatus { + white-space: nowrap; + width: 1%; +} + +th.snarkTorrentStatus { + text-align: center !important; +} + +.snarkTorrentETA, .snarkTorrentUploaded, .snarkTorrentRateDown, .snarkTorrentRateUp { + width: 5%; + min-width: 40px; + white-space: nowrap; +} + +.snarkTorrents th:empty + th:empty, .snarkTorrents td:empty + td:empty, .snarkTorrents th:last-child:empty, .snarkTorrents td:last-child:empty { + width: 0 !important; +} + .snarkTorrents td[colspan="10"]{ padding: 2px; color: #cc7 !important; @@ -546,7 +557,7 @@ table.SnarkTorrents { box-shadow: inset 0 0 0 1px #030; } -table.SnarkTorrentInfo { +.SnarkTorrentInfo { margin-bottom: 1px !important; background: url(/themes/console/dark/images/camotile2.png) repeat scroll center bottom #001100; border-bottom: 1px solid #494; @@ -563,12 +574,19 @@ table.SnarkTorrentInfo { color: #bb7; } -table.SnarkDirInfo { +.SnarkDirInfo { margin-top: 10px !important; margin-bottom: 0; border-bottom: 1px solid #494; } +#infohash { + color: #cc0; + -moz-user-select: all; + -webkit-user-select: all; + user-select: all; +} + .snarkDirInfo th img { margin: 0 !important; max-height: 20px !important; @@ -687,12 +705,12 @@ th.headerdownloaded { white-space: nowrap; } -td.snarkFileIcon { +.snarkFileIcon { width: 16px; padding: 0; } -td.snarkFileStatusIcon { +.snarkFileStatusIcon { width: 24px; padding: 0 4px 0 0; text-align: center; @@ -712,11 +730,6 @@ td { td:first-child { text-align: right; - font-size: 9pt; -} - -.center { - text-align: center !important; } .snarkTorrentName { @@ -756,18 +769,14 @@ td:first-child { border-bottom: 1px solid #494; } +.snarkGraphicStatus { + text-align: center !important; +} + .snarkTorrentStatus { - padding: 2px 2px 2px 0; + padding: 3px 5px 3px 0 !important; line-height: 90%; min-width: 0; -} - -td.snarkTorrentStatus { - text-align: center !important; - padding: 3px 0; -} - -td.snarkTorrentStatus:nth-child(2) { text-align: left !important; } @@ -1345,6 +1354,15 @@ input[name="nofilter_dataDir"] { height: auto; } +input[name="nofilter_commentsName"] { + width: 250px; + text-overflow: ellipsis; +} + +input[name="nofilter_commentsName"]:focus::placeholder { + opacity: 0; +} + .configsectionpanel input[type=text], input.r, textarea[name="i2cpOpts"], input[name="nofilter_dataDir"], #configs select { margin-top: 4px; margin-bottom: 4px; @@ -1359,8 +1377,8 @@ input[type=image], th a:link img, th a:visited img { opacity: 1; } -input[type=text], input.r { - min-width: 100px; +input[type=text], input.r, select { + min-width: 120px !important; } input[type=radio] { @@ -1686,7 +1704,7 @@ _:-ms-lang(x), #trackerselect tr:last-child { border: 1px solid #494; } -table.trackerconfig td:first-child { +.trackerconfig td:first-child { padding: 5px 2px; width: 24px !important; } @@ -2360,6 +2378,207 @@ input[type="checkbox"][disabled]:checked, input[type="radio"][disabled]:checked, /* end custom radios/checkboxes */ +/* Comments Section */ +/* TODO: merge with other rules where applicable */ + +.snarkCommentInfo, .snarkComments { + margin: 10px 0 0 !important; + border: 1px solid #494; + border-left: none; + border-right: none; + background: #001100 url(/themes/console/dark/images/camotile2.png) repeat scroll center bottom; + filter: drop-shadow(0px 0 1px rgba(16, 8, 16, 0.7)); +} + +.snarkComments { + margin-top: -1px !important; + border-top: none; +} + +.snarkCommentInfo th, .snarkComments th { + background: linear-gradient(to bottom, #001000 0%, #001900 50%, #000 50%, #000 100%); + padding: 8px 5px; + white-space: normal; +} + +.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(odd) { + background: #001000; + border-bottom: 1px inset #000; +} + +.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(even) { + background: #000800; + border-bottom: 1px inset #000; +} + +.snarkCommentInfo th { + padding: 8px 5px 8px 30px; + background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #001000 0%, #001900 50%, #000 50%, #000 100%); +} + +.snarkCommentInfo td, .snarkComments td { + padding: 8px 5px; +} + +.snarkCommentInfo td:first-child { + white-space: nowrap; +} + +.snarkCommentInfo td:first-child { + font-weight: bold; +} + +.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after { + content: ""; + display: inline-block; + min-height: 22px; + vertical-align: middle; +} + +.snarkCommentInfo input.accept { + float: right; + margin-right: 5px !important; +} + +#myRating { + border-top: 1px solid #050; +} + +.snarkCommentInfo textarea { /* remember to set 10pt @ > 1400px */ + font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif; + width: 100%; + min-height: 64px; + height: 64px; + resize: vertical; + opacity: 0.8; +} + +.snarkComments th { + text-align: left; +} + +.commentRating, .commentAuthor { + width: 1%; +} + +#nameRequired { + float: right; + margin-right: 5px; +} + +.commentRating { + width: 80px; + white-space: nowrap; +} + +.commentRating img { + margin: 0; + padding: 0; + height: 16px; + width: 16px; +} + +.commentDate { + width: 105px; + background: url(images/clock.png) left center no-repeat; + padding-left: 20px !important; +} + +.snarkCommentInfo td:first-child, .snarkComments td:first-child { + min-width: 160px !important; + width: 160px !important; + padding-right: 2px; +} + +.snarkCommentInfo td:last-child, .snarkComments td:last-child { + width: 1% !important; +} + +.snarkComments td { + white-space: nowrap; +} + +.commentAuthorName { + background: url(images/author.png) left center no-repeat; + padding-left: 20px; +} + +.commentText { + white-space: normal; + text-align: justify; + width: 90%; +} + +.commentWrapper { + border: 1px solid #030; + margin: 2px 0; + padding: 8px 10px 8px 26px; + border-radius: 3px; + box-shadow: inset 0 0 0 1px #393, 0 0 1px 0 rgba(0,0,0,0.3); + background: url(images/comment.png) 6px center no-repeat #010; + background-blend-mode: luminosity; +} + +#commentsConfig .optbox { + vertical-align: middle !important; +} + +.snarkComments select { + margin-right: 0 !important; +} + +#commentDeleteAction { + border-top: 1px solid #050; + background: none;; +} + +#commentDeleteAction td { + padding-right: 6px; +} + +.commentAction, .commentDelete { + width: 1%; + white-space: nowrap; + padding-left: 0; +} + +.addCommentText, .commentText { + padding-right: 0; +} + +.commentDelete { + background: url(../ubergine/images/nuke.png) 2px center no-repeat; + text-align: left; + padding: 8px 6px 8px 24px !important; +} + +#newRating td { + padding-top: 10px !important; + padding-bottom: 10px !important; + border-top: 1px solid #050; +} + +#myRating td:empty { + padding: 0 !important; + border-top: none !important; + border-bottom: none !important; +} + +#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ + min-height: 1px !important; +} + +.commentRating img { + margin: 0 0 4px; + padding: 0; + font-size: 14pt; + color: #FF7200; + text-shadow: 0 0 1px #900; + filter: none; +} + +/* end Comments section */ + /* responsive layout */ @media screen and (max-width: 950px) { @@ -2497,6 +2716,10 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, code, textarea, input, input[ty font-size: 12pt !important; } +.snarkTorrentStatus { + padding-right: 10px !important; +} + .snarkTorrentDownloaded { white-space: nowrap; padding: 0 8px; @@ -2609,201 +2832,3 @@ textarea[name="i2cpOpts"] { /* end responsive layout */ -/* Comments Section */ -/* TODO: merge with other rules where applicable */ - -.snarkCommentInfo, .snarkComments { - margin: 10px 0 0 !important; - border: 1px solid #494; - border-left: none; - border-right: none; - background: #001100 url(/themes/console/dark/images/camotile2.png) repeat scroll center bottom; - filter: drop-shadow(0px 0 1px rgba(16, 8, 16, 0.7)); -} - -.snarkCommentInfo th, .snarkComments th { - background: linear-gradient(to bottom, #001000 0%, #001900 50%, #000 50%, #000 100%); - padding: 8px 5px; - white-space: normal; -} - -.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(even) { - background: #001000; - border-bottom: 1px inset #000; -} - -.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(odd) { - background: #000800; - border-bottom: 1px inset #000; -} - -.snarkCommentInfo th { - padding: 8px 5px 8px 30px; - background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #001000 0%, #001900 50%, #000 50%, #000 100%); -} - -.snarkCommentInfo td, .snarkComments td { - padding: 8px 5px; -} - -.snarkCommentInfo td:first-child { - white-space: nowrap; -} - -.snarkCommentInfo td:first-child { - font-weight: bold; -} - -.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after { - content: ""; - display: inline-block; - min-height: 32px; - vertical-align: middle; -} - -.snarkCommentInfo input.accept { - float: right; - margin-right: 5px !important; -} - -.snarkCommentInfo textarea { /* remember to set 10pt @ > 1400px */ - font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif; - width: 100%; - min-height: 64px; - height: 64px; - resize: vertical; - opacity: 0.8; -} - -.snarkComments th { - text-align: left; -} - -.commentRating, .commentAuthor { - width: 1%; -} - -#nameRequired { - float: right; - margin-right: 5px; -} - -.commentRating { - padding-right: 10px !important; -} - -.commentRating img { - margin: 0; - padding: 0; - height: 16px; - width: 16px; -} - -.commentDate { - width: 100px; - background: url(images/clock.png) left center no-repeat; - padding-left: 20px !important; -} - -.snarkCommentInfo td:first-child, .snarkComments td:first-child { - width: 160px !important; - padding-right: 2px; -} - -.snarkCommentInfo td:last-child, .snarkComments td:last-child { - width: 1% !important; -} - -.snarkComments td { - white-space: nowrap; -} - -.commentAuthorName { - background: url(images/author.png) left center no-repeat; - padding-left: 20px; -} - -.commentText { - white-space: normal; - text-align: justify; - width: 90%; -} - -.commentWrapper { - border: 1px solid #030; - margin: 2px 0; - padding: 8px 10px 8px 26px; - border-radius: 3px; - box-shadow: inset 0 0 0 1px #393, 0 0 1px 0 rgba(0,0,0,0.3); - background: url(images/comment.png) 6px center no-repeat #010; - background-blend-mode: luminosity; -} - -.commentText .optbox { - position: fixed; - right: 20px; - top: 10px; -} - -#commentsConfig .optbox { - vertical-align: middle !important; -} - -.snarkComments select { - margin-right: 0 !important; -} - -#commentDeleteAction { - border-top: 1px solid #494; - background: none;; -} - -#commentDeleteAction td { - padding-right: 6px; -} - -.commentAction, .commentDelete { - width: 1%; - white-space: nowrap; -/* min-width: 180px !important;*/ - padding-left: 0; -} - -.addCommentText, .commentText { - padding-right: 0; -} - -.commentAction input[type="submit"] { - margin-top: 10px; - margin-bottom: 10px; -} - -.commentDelete { - text-align: left; -} - -#newRating td { - padding-top: 10px !important; - padding-bottom: 10px !important; -} - -#myRating td:empty { - padding: 0 !important; - border-top: none !important; - border-bottom: none !important; -} - -#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ - min-height: 1px !important; -} - -.commentRating img { - margin: 0 0 4px; - padding: 0; - font-size: 14pt; - color: #FF7200; - text-shadow: 0 0 1px #900; - filter: none; -} - -/* end Comments section */ diff --git a/installer/resources/themes/snark/light/snark.css b/installer/resources/themes/snark/light/snark.css index f5700e5d2b..1a8b27f365 100644 --- a/installer/resources/themes/snark/light/snark.css +++ b/installer/resources/themes/snark/light/snark.css @@ -145,7 +145,6 @@ button::-moz-focus-inner, input::-moz-focus-inner { } .snarkRefresh:first-child { -/* padding: 4px 10px 4px 19px !important;*/ border-radius: 2px 0 0 2px; background: #fff url(images/button_snark.png) 10px center no-repeat; background: url(images/button_snark.png) 10px center no-repeat, linear-gradient(to bottom, #fff 50%, #eef 51%, #eef 100%); @@ -308,10 +307,6 @@ table { opacity: 1 !important; } -tr { - opacity: 1; -} - thead, tfoot { background: #fff; } @@ -416,6 +411,13 @@ tfoot tr:nth-child(n+1) { white-space: nowrap; } +/* main torrents listing */ + +.snarkTorrents thead th { + padding-top: 4px; + padding-bottom: 4px; +} + .snarkTorrents { margin: -1px 0; background: #fff; @@ -433,80 +435,75 @@ tfoot tr:nth-child(n+1) { text-align: center !important; } +.snarkTorrents th:empty + th:empty, .snarkTorrents td:empty + td:empty, .snarkTorrents th:last-child:empty, .snarkTorrents td:last-child:empty { + width: 0 !important; +} + +.snarkTorrents tfoot tr:first-child th { + padding: 5px 4px; + background: #fff; + background: linear-gradient(to bottom, #fff 50%, rgb(240, 240, 255)) #fff; + vertical-align: middle; + font-weight: bold; + font-style: normal !important; + color: #31334f !important; +} + .snarkTorrents td { line-height: 110%; } -.snarkTorrents thead th:nth-child(1), .snarkTorrents td:nth-child(1) { - width: 20px !important; -} - -.snarkTorrents td:nth-child(1) { - text-align: left; - padding: 2px; -} - -.snarkTorrents td:nth-child(2) { - white-space: nowrap; -} - -.snarkTorrentStatus b { - margin-right: 3px; -} - -.snarkTorrents td[colspan="10"] { - white-space: normal !important; -} - -.snarkTorrents td:nth-child(3), .SnarkTorrents td:nth-child(4) { - width: 16px !important; - padding: 2px 1px 2px 0; -} - -.SnarkTorrents td:nth-child(4) { - text-align: center; -} - .snarkTorrents td[colspan="4"], .snarkTorrents td[colspan="10"] { text-align: left !important; padding-left: 0; } -.snarkTorrents th[colspan="6"]::first-line { - font-weight: bold; +.snarkTorrents td[colspan="10"] { + white-space: normal !important; } -.snarkTorrents th[colspan="6"] { - font-weight: normal; +.snarkGraphicStatus, .snarkTorrentStatus { + white-space: nowrap; + width: 1%; } -.snarkTorrents tfoot tr:first-child th { - padding: 5px 4px !important; - background: #fff; - vertical-align: middle; +.snarkGraphicStatus { + max-width: 32px !important; + text-align: center !important; + padding-left: 2px; } -td { - padding: 2px 4px; - color: #272e3f !important; - opacity: 1; - font-size: 9pt; +.snarkTorrentStatus { + padding-right: 5px; } -.mainsection td { - color: #272e3f; -} - -td:first-child { - text-align: right; -} - -.center { +th.snarkTorrentStatus { text-align: center !important; } +.snarkTorrentStatus b { + margin-right: 3px; +} + +.snarkTorrentStatus a:visited { + color: #559; +} + +.snarkTorrentStatus a:hover { + color: #f60; +} + +.snarkTrackerDetails, .SnarkTorrentDetails { + width: 16px !important; + padding: 2px 1px 2px 0; +} + +.SnarkTorrentDetails { + text-align: center; +} + .snarkTorrentName { - padding: 0; + padding: 0 0 0 3px; line-height: 90%; } @@ -515,6 +512,12 @@ td:first-child { width: 100%; } +.snarkTorrentETA, .snarkTorrentUploaded, .snarkTorrentRateDown, .snarkTorrentRateUp { + width: 5%; + min-width: 40px; + white-space: nowrap; +} + .snarkTorrentAction { text-shadow: 1px 1px #550000; padding: 2px 1px !important; @@ -534,10 +537,6 @@ td:first-child { opacity: 1; } -.snarkTorrents thead th:last-child br { /* kill "start all/stop all" button wrapping in the header */ - display: none; -} - .snarkTorrentAction input[type="image"], .snarkTorrents th:last-child input[type="image"] { padding: 3px !important; background: #339; @@ -561,12 +560,6 @@ td:first-child { filter: hue-rotate(110deg) !important; } -.snarkTorrentEven { - font-size: 8pt; - background: #eef; - background: repeating-linear-gradient(135deg, rgba(255,255,255,0.5) 2px, rgba(240, 240, 255, 0.3) 3px, #fff 5px); -} - .snarkTorrentNoneLoaded, .snarkTorrentNoneLoaded:hover { background: #fff !important; background: linear-gradient(to right, #eef, #fff, #eef) !important; @@ -579,48 +572,82 @@ td:first-child { color: #272e3f !important; } -.snarkTorrentStatus a:visited { - color: #559; -} - -.snarkTorrentStatus a:hover { - color: #f60; -} - -.snarkTorrentStatus:first-child { - text-align: left !important; - padding-left: 0; - min-width: 48px; - font-weight: bold; - color: #dd9 !important; - font-size: 8pt; - padding: 1px !important; -} - -.snarkTorrentStatus:first-child img { - margin-right: 10px !important; - margin-left: 6px; -} - .snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded { padding: 0 3px; line-height: 90%; } +.snarkTorrentRateUp:empty, .snarkTorrentRateDown:empty, .snarkTorrentAction:empty { + width: 0; + padding: 0; +} + .snarkTorrentUploaded, .snarkTorrentRateUp { font-style: italic !important; color: #59698f !important; } -.snarkTorrentDownloaded, .snarkTorrents tfoot th:nth-last-child(5) { +.snarkTorrentDownloaded { text-align: center; white-space: nowrap; } +.choked, .unchoked { + font-style: italic; +} + +.choked { + color: #a00 !important; +} + +.unchoked { + color: #070 !important; +} + +.snarkTorrents tt { + background: #99f; + color: #fff; + border-radius: 2px; + padding: 2px 3px; + margin: 0 3px; + display: inline-block; +} + +#totals { + display: inline-block; + margin: 2px 0 2px 5px; + font-weight: bold !important; +} + +#totals span, #ourDest { + white-space: nowrap; +} + +.routerdown { + color: #001; +} + +/* end main torrents listing */ + +td { + padding: 2px 4px; + color: #272e3f !important; + opacity: 1; + font-size: 9pt; +} + +.mainsection td { + color: #272e3f; +} + +.snarkTorrentEven { + background: #eef; + background: repeating-linear-gradient(135deg, rgba(255,255,255,0.5) 2px, rgba(240, 240, 255, 0.3) 3px, #fff 5px); +} + .snarkTorrentOdd { background: #e0e0ff; background: repeating-linear-gradient(45deg, rgba(255,255,255,0.5) 2px, rgba(221, 221, 255, 0.3) 3px, #fff 5px); - font-size: 8pt; } .snarkTorrentOdd td, .snarkTorrentEven td { @@ -635,6 +662,10 @@ td:first-child { color: #0c111f !important; } +.snarkTorrents tr:hover img { + mix-blend-mode: normal; +} + tr:hover .percentBarText { opacity: 0.75; } @@ -643,10 +674,6 @@ tr:hover .percentBarText { background: url(images/peer.png) center center no-repeat #ffd !important; } -.snarkTorrents tr:hover img { - mix-blend-mode: normal; -} - .snarkTorrentEven + .snarkTorrentEven td:nth-child(2), .snarkTorrentOdd td + .snarkTorrentOdd td:nth-child(2) { padding: 4px 0; text-align: left; @@ -706,7 +733,6 @@ tr:hover .percentBarText { 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; } @@ -715,7 +741,7 @@ tr:hover .percentBarText { border: none; height: 100%; background: #bbf; - background: linear-gradient(to bottom, #fff 0%, #eef 50%, #ddf 50%, #bbf 100%); + background: linear-gradient(to bottom, rgba(255, 255, 255,0.6) 0%, rgba(238, 238, 255, 0.6) 50%, rgba(221, 221, 255, 0.7) 50%, rgba(187, 187, 255, 0.7) 100%); box-shadow: inset 0 0 0 1px #ddf; } @@ -762,18 +788,6 @@ tr:hover .percentBarText { /* end download bars */ -.choked { - color: #a00 !important; -} - -.unchoked { - color: #070 !important; -} - -.snarkTorrents td:nth-last-child(2) .choked, .snarkTorrents td:nth-last-child(2) .unchoked { - font-style: italic; -} - .thumb { max-width: 16px; transition: ease all 0.3s 0s; @@ -907,7 +921,7 @@ tr:hover .percentBarText { .snarkTorrentInfo td { text-align: left !important; - padding: 3px 0 3px 1px !important; + padding: 4px 0 4px 1px !important; border-top: 1px solid #bbf; vertical-align: middle; } @@ -928,6 +942,14 @@ tr:hover .percentBarText { .snarkTorrentInfo tr:last-child td { border-bottom: 1px solid #7778bf; + border-top: 1px solid #7778bf; +} + +#infohash { + color: #070; + -moz-user-select: all; + -webkit-user-select: all; + user-select: all; } .snarkDirInfo thead img { @@ -1126,6 +1148,10 @@ input[name="nofilter_dataDir"], textarea[name="i2cpOpts"] { font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif; } +#configureAuthor input { + width: 250px; +} + input[type="radio"] { padding: 2px; margin: 0 3px 0 8px; @@ -1250,6 +1276,7 @@ img[src$="details.png"] { .newtorrentsection td:first-child, .addtorrentsection td:first-child, .configsectionpanel td:first-child { width: auto !important; + text-align: right; } .configsectionpanel td:first-child { @@ -1380,19 +1407,6 @@ code, tt { font-family: "Droid Sans Mono", "Lucida Console", "DejaVu Sans Mono", monospace; } -.snarkTorrents tt { - background: #99f; - color: #fff; - border-radius: 2px; - padding: 2px 3px; - margin: 0 3px; - display: inline-block; -} - -.routerdown { - color: #001; -} - .trackerconfig { text-align: left !important; width: 100%; @@ -1663,12 +1677,6 @@ hr.debug:last-child { /* end Resource Errors */ -#totals { - display: inline-block; - margin: 2px 0 2px 5px; - font-weight: bold !important; -} - /* Downloading Priorities */ .snarkDirInfo input[type="radio"], .snarkDirInfo input[type="radio"]:checked { @@ -1767,7 +1775,7 @@ hr.debug:last-child { } #setPriority th { - border-bottom: 1px solid #eef; + border-bottom: 1px solid #7778bf; } #torrentInfoStats td { @@ -1789,6 +1797,207 @@ hr.debug:last-child { margin-right: 7px; } +/* Comments Section */ + +.snarkCommentInfo, .snarkComments { + margin: 10px 0 0 !important; + border: 1px solid #7778bf; + border-left: none; + border-right: none; +} + +.iframed .snarkComments { + border-bottom: none; +} + +.snarkComments { + margin-top: -1px !important; + border-top: none !important; +} + +.snarkCommentInfo th, .snarkComments th { + padding: 8px 5px; +} + +.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(odd) { + border-top: 1px solid #bbf; + background: repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.5) 2px, rgba(240, 240, 255, 0.3) 3px, #fff 5px) #fff; +} + +.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(even) { + border-top: 1px solid #bbf; + background: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.5) 2px, rgba(221, 221, 255, 0.3) 3px, #fff 5px) #fff; +} + +.snarkCommentInfo th { + padding: 8px 5px; + background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #fff 50%, rgb(240, 240, 255)); + padding-left: 30px; +} + +.snarkCommentInfo td, .snarkComments td { + padding: 6px 5px; +} + +.snarkCommentInfo td:first-child, .snarkComments td:first-child { + text-align: right; +} + +.snarkCommentInfo td:first-child { + font-weight: bold; + white-space: nowrap; +} + +.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after { + content: ""; + display: inline-block; + min-height: 32px; + vertical-align: middle; +} + +.snarkCommentInfo input.accept { + float: right; + margin-right: 5px !important; +} + +.snarkCommentInfo textarea { + font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Bitstream Vera Sans", Verdana, "Lucida Grande", Helvetica, sans-serif !important; + font-weight: normal; + width: 100%; + min-height: 64px; + height: 64px; + resize: vertical; +} + +.snarkComments tr:last-child { + border-top: 1px solid #7778bf !important; +} + +.commentRating, .commentAuthor { + width: 1%; +} + +#nameRequired { + float: right; + margin-right: 5px; +} + +.commentRating { + padding-right: 10px !important; +} + +.commentRating img { + margin: 0; + padding: 0; + width: 16px; + height: 16px; + filter: drop-shadow(0 0 1px rgba(128,0,0,0.3)) !important; +} + +.commentDate { + width: 100px; + background: url(images/clock.png) left center no-repeat; + padding-left: 20px !important; +} + +.snarkCommentInfo td:first-child, .snarkComments td:first-child { + width: 160px !important; + min-width: 160px !important; + padding-right: 2px; +} + +.snarkCommentInfo td:last-child, .snarkComments td:last-child { + width: 1% !important; +} + +.snarkComments td { + white-space: nowrap; +} + +.commentAuthorName { + background: url(images/author.png) left center no-repeat; + padding-left: 20px; +} + +.commentText { + white-space: normal; + text-align: justify; + width: 90%; +} + +.commentWrapper { + border: 1px solid #bbf; + margin: 2px 0; + padding: 8px 10px 8px 26px; + border-radius: 3px; + box-shadow: inset 0 0 0 1px #fff, 0 0 1px 0 rgba(0,0,0,0.3); + background: url(images/comment.png) 6px center no-repeat #eef; + background-blend-mode: luminosity; +} + +#commentsConfig .optbox { + vertical-align: middle !important; +} + +.snarkComments select { + margin-right: 0 !important; +} + +#commentDeleteAction { + border-top: 1px solid #bbf; + background: linear-gradient(to bottom, #fff, #eef); +} + +#commentDeleteAction td { + padding-right: 6px; +} + +.commentAction, .commentDelete { + width: 1%; + white-space: nowrap; + padding-left: 0; +} + +.addCommentText, .commentText { + padding-right: 0; +} + +.commentDelete { + text-align: left; + padding: 2px 3px 2px 20px !important; + background: url(../ubergine/images/nuke.png) left center no-repeat; +} + +#newRating td:first-child { + text-align: center; +} + +#newRating select { + width: 90%; + margin-left: 10px; +} + +#myRating td:empty { + padding: 0 !important; + border-top: none !important; + border-bottom: none !important; +} + +#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ + min-height: 0 !important; +} + +.commentRating img { + margin: 0 0 4px; + padding: 0; + font-size: 14pt; + color: #FF7200; + text-shadow: 0 0 1px #900; + filter: none; +} + +/* end Comments section */ + /* MS Edge 14+ rendering bug fix */ _:-ms-lang(x), *, *:hover, *:focus, input, input:hover, input:focus, a:hover, a:focus { filter: none !important; @@ -1807,9 +2016,8 @@ _:-ms-lang(x), *, *:hover, *:focus, input, input:hover, input:focus, a:hover, a: min-width: 580px !important; } -.snarkTorrents th:nth-child(2), .snarkTorrents td:nth-child(2), .snarkTorrents th:nth-child(7), -.snarkTorrents tfoot th:nth-child(3), .snarkTorrents td.snarkTorrentUploaded, .snarkTorrents th:nth-child(9), -.snarkTorrents tfoot th:nth-child(5), .snarkTorrents td.snarkTorrentRateUp { +.snarkTorrentStatus, .snarkTorrentUploaded, .snarkTorrentRateUp, +.snarkTorrents tfoot th:nth-child(3), .snarkTorrents tfoot th:nth-child(5) { max-width: 0 !important; overflow: hidden; white-space: nowrap; @@ -1821,19 +2029,26 @@ _:-ms-lang(x), *, *:hover, *:focus, input, input:hover, input:focus, a:hover, a: display: none; } -.snarkTorrents td:first-child img, .snarkTorrents td:nth-child(3) img, .snarkTorrents td:nth-child(4) img { +.snarkGraphicStatus img, .snarkTrackerDetails img, .snarkTorrentDetails img { max-height: 14px !important; width: auto; } +.snarkGraphicStatus, .snarkTorrentStatus { + width: 0; +} + +.snarkTorrentETA, .snarkTorrentUploaded, .snarkTorrentRateDown, .snarkTorrentRateUp { + min-width: 0; +} + .snarkTorrents thead img { max-height: 18px !important; width: auto; } -.snarkTorrents thead th:nth-child(1), .snarkTorrents td:nth-child(1) { - width: 18px !important; - padding: 0; +.snarkGraphicStatus { + max-width: 24px !important; } .snarkTorrentAction { @@ -1905,7 +2120,15 @@ body, td, .snarkMessages li, .snarkMessages a, button, input, select, .snarkAddI font-weight: bold; } -.snarkTorrents td:nth-child(2), .snarkTorrents td:nth-child(2) a { +.snarkGraphicStatus { + max-width: 28px !important; +} + +th.snarkTorrentStatus { + text-align: right !important; +} + +.snarkTorrentStatus, .snarkTorrentStatus a { white-space: nowrap; font-weight: bold; } @@ -1914,12 +2137,13 @@ body, td, .snarkMessages li, .snarkMessages a, button, input, select, .snarkAddI display: none; } -b.alwaysShow { - display: inline; +.percentBarOuter, .percentBarText { + line-height: 11px !important; + height: 12px !important; } -.snarkTorrentDownloaded .percentBarText, .snarkTorrentDownloaded .percentBarOuter { - width: 100px !important; +b.alwaysShow { + display: inline; } } @@ -1937,6 +2161,14 @@ b.alwaysShow { a.snarkRefresh:first-child { padding-left: 26px !important; } + +.snarkTorrentDownloaded .percentBarText, .snarkTorrentDownloaded .percentBarOuter { + width: 100px !important; +} + +.peerinfo .snarkTorrentDownloaded .percentBarText, .peerinfo .snarkTorrentDownloaded .percentBarOuter { + width: 80px !important; +} } @media screen and (max-width: 1400px) { @@ -1958,18 +2190,30 @@ a.snarkRefresh:first-child { pointer-events: none; /* hide tooltip */ } +.snarkTorrentAction { + padding-right: 3px !important; +} + #configs tr:nth-last-child(n+4) td { padding-top: 3px; padding-bottom: 3px; } +.snarkTorrentStatus { + padding-right: 10px; +} + .snarkTorrentName { padding-left: 4px; } + +.snarkTorrentRateUp, .snarkTorrents tfoot th.snarkTorrentRateUp, .peerinfo .snarkTorrentRateUp { + padding-right: 10px !important; +} } @media screen and (min-width: 1400px) { -body, td, button, input, select, .snarkAddInfo, code, tt, th, a, a:link, textarea { +body, td, button, input, select, .snarkAddInfo, code, tt, th, a, a:link, textarea, .snarkCommentInfo textarea { font-size: 10pt !important; } @@ -2032,7 +2276,7 @@ input[type="submit"] { .debuginfo td { font-size: 10pt !important; - word-spacing: 0em; + word-spacing: 0; padding-top: 4px !important; padding-bottom: 4px !important; } @@ -2059,197 +2303,3 @@ input[type="submit"] { /* end responsive layout */ -/* Comments Section */ -/* TODO: merge with other rules where applicable */ - -.snarkCommentInfo, .snarkComments { - margin: 10px 0 0 !important; - border: 1px solid #7778bf; - border-left: none; - border-right: none; -} - -.snarkCommentInfo th, .snarkComments th { - padding: 8px 5px; -} - -.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(even) { - border-top: 1px solid #bbf; - background: repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.5) 2px, rgba(240, 240, 255, 0.3) 3px, #fff 5px) #fff; -} - -.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(odd) { - border-top: 1px solid #bbf; - background: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.5) 2px, rgba(221, 221, 255, 0.3) 3px, #fff 5px) #fff; -} - -.snarkCommentInfo th { - padding: 8px 5px; - background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #fff 50%, rgb(240, 240, 255)); - padding-left: 30px; -} - -.snarkCommentInfo td, .snarkComments td { - padding: 8px 5px; -} - -.snarkCommentInfo td:first-child { - white-space: nowrap; -} - -.snarkCommentInfo td:first-child { - font-weight: bold; -} - -.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after { - content: ""; - display: inline-block; - min-height: 32px; - vertical-align: middle; -} - -.snarkCommentInfo input.accept { - float: right; - margin-right: 5px !important; -} - -.snarkCommentInfo textarea { /* remember to set 10pt @ > 1400px */ - width: 100%; - min-height: 64px; - height: 64px; - resize: vertical; -} - -.snarkComments tr:first-child, .snarkComments tr:last-child { - text-align: left; - border-top: 1px solid #7778bf !important; -} - -.commentRating, .commentAuthor { - width: 1%; -} - -#nameRequired { - float: right; - margin-right: 5px; -} - -.commentRating { - padding-right: 10px !important; -} - -.commentRating img { - margin: 0; - padding: 0; - width: 16px; - height: 16px; -} - -.commentDate { - width: 100px; - background: url(images/clock.png) left center no-repeat; - padding-left: 20px !important; -} - -.snarkCommentInfo td:first-child, .snarkComments td:first-child { - width: 160px !important; - padding-right: 2px; -} - -.snarkCommentInfo td:last-child, .snarkComments td:last-child { - width: 1% !important; -} - -.snarkComments td { - white-space: nowrap; -} - -.commentAuthorName { - background: url(images/author.png) left center no-repeat; - padding-left: 20px; -} - -.commentText { - white-space: normal; - text-align: justify; - width: 90%; -} - -.commentWrapper { - border: 1px solid #bbf; - margin: 2px 0; - padding: 8px 10px 8px 26px; - border-radius: 3px; - box-shadow: inset 0 0 0 1px #fff, 0 0 1px 0 rgba(0,0,0,0.3); - background: url(images/comment.png) 6px center no-repeat #eef; - background-blend-mode: luminosity; -} - -.commentText .optbox { - position: fixed; - right: 20px; - top: 10px; -} - -#commentsConfig .optbox { - vertical-align: middle !important; -} - -.snarkComments select { - margin-right: 0 !important; -} - -#commentDeleteAction { - border-top: 1px solid #bbf; - background: linear-gradient(to bottom, #fff, #eef); -} - -#commentDeleteAction td { - padding-right: 6px; -} - -.commentAction, .commentDelete { - width: 1%; - white-space: nowrap; -/* min-width: 180px !important;*/ - padding-left: 0; -} - -.addCommentText, .commentText { - padding-right: 0; -} - -.commentAction input[type="submit"] { - margin-top: 10px; - margin-bottom: 10px; -} - -.commentDelete { - text-align: left; -} - -#newRating td { - padding-top: 10px !important; - padding-bottom: 10px !important; -} - -#myRating td:empty { - padding: 0 !important; - border-top: none !important; - border-bottom: none !important; -} - -#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ - min-height: 1px !important; -} - -.commentRating img { - margin: 0 0 4px; - padding: 0; - font-size: 14pt; - color: #FF7200; - text-shadow: 0 0 1px #900; - filter: none; -} - -/* end Comments section */ \ No newline at end of file diff --git a/installer/resources/themes/snark/midnight/snark.css b/installer/resources/themes/snark/midnight/snark.css index 40cda88eb9..c4512c4f2a 100644 --- a/installer/resources/themes/snark/midnight/snark.css +++ b/installer/resources/themes/snark/midnight/snark.css @@ -266,6 +266,7 @@ body.iframed { mix-blend-mode: luminosity; position: sticky; top: -3px; + z-index: 1; } .snarkMessages img:hover, .snarkMessages img:focus { @@ -311,10 +312,6 @@ table { border: 0; } -tr { - opacity: 1; -} - thead, tfoot { background: #001; } @@ -324,12 +321,12 @@ thead { } th { - font-size: 8pt; padding: 8px 2px; color: #c9ceff; border-top: 1px solid #443da0; border-bottom: 1px solid #443da0; background: #001; + font-size: 9pt; } thead th, #torrentInfoControl td { @@ -337,7 +334,6 @@ thead th, #torrentInfoControl td { } th:first-child { - padding-left: 2px; text-align: left !important; } @@ -371,31 +367,7 @@ tfoot tr:nth-child(n+1) { text-align: left; } -.headerstatus { - text-align: left; -} - -.headerpriority { - padding-left: 10px; - text-align: left; -} - -.ParentDir { - font-size: 8pt; - padding: 4px 0; - text-align: left !important; - border: 1px solid #1d1b3f !important; - border-right: 0 !important; - border-left: 0 !important; - background: #001; -} - -.ParentDir a { - font-weight: bold !important; - margin-left: -4px; - display: inline-block; - width: 100%; -} +/* main torrent listing */ .snarkTorrents { margin: 10px 0 0 0; @@ -407,21 +379,41 @@ tfoot tr:nth-child(n+1) { margin-top: -1px; } +.snarkTorrents th br { + display: none; /* kill double height button display */ +} + .snarkTorrents th { text-align: center; } -.snarkTorrents thead th:first-child { - width: 36px; - text-align: center !important; +.snarkTorrents thead th { + background: linear-gradient(to bottom, #121225 0%, #121225 50%, #000011 50%, #00000d 50%, #00000d 100%) !important; + padding: 2px 1px; } -.snarkTorrents th:nth-child(2) { - text-align: left; +.snarkTorrents thead th:nth-child(3) { + text-align: right; } -.snarkTorrents th br { - display: none; /* kill double height button display */ +.snarkTorrents th:empty + th:empty, .snarkTorrents td:empty + td:empty, .snarkTorrents th:last-child:empty, .snarkTorrents td:last-child:empty { + width: 0 !important; +} + +.snarkTorrents img { + margin: 0 !important; + padding: 0 !important; +} + +.snarkTorrents tt { + font-family: "Droid Sans Mono", "Noto Mono", "Noto Mono", "DejaVu Sans Mono", "Lucida Console", monospace; + background: #2d103f; + color: #fff; + padding: 2px 3px; + border-radius: 2px; + display: inline-block; + margin: 1px 3px; + letter-spacing: 0.1em; } .snarkTorrents tbody tr:last-child td { @@ -470,69 +462,202 @@ tfoot tr:nth-child(n+1) { margin-left: 20px !important; } -.SnarkTorrents td:nth-child(6), .SnarkTorrents td:nth-child(7), .SnarkTorrents td:nth-child(8) { - text-align: center !important; -} - -.snarkTorrents th { - text-align: left; -} - -.snarkTorrents thead th { - background: linear-gradient(to bottom, #121225 0%, #121225 50%, #000011 50%, #00000d 50%, #00000d 100%) !important; - padding: 2px 1px; -} - -.snarkTorrents thead th:nth-child(3) { - text-align: right; -} - .snarkTorrents td { line-height: 110%; text-align: left; padding: 1px; } -.snarkTorrents td:nth-child(1) { - width: 36px !important; +.snarkTorrents td[colspan="10"] { + padding: 2px; } -.snarkTorrents td:nth-child(3) { +th.snarkTorrentStatus { + text-align: center !important; +} + +.snarkTrackerDetails, .SnarkTorrentDetails { width: 16px !important; padding: 0 !important; + text-align: center !important; +} + +.snarkTrackerDetails { text-align: right !important; } -.snarkTorrents td:nth-child(4) { - width: 16px !important; - padding: 0 2px 0 0 !important; +.snarkGraphicStatus, .snarkTorrentStatus { + white-space: nowrap; + width: 1%; +} + +.snarkGraphicStatus { text-align: center !important; + padding: 2px !important; + width: 26px !important; +} + +.snarkTorrentETA, .snarkTorrentUploaded, .snarkTorrentRateDown, .snarkTorrentRateUp { + text-align: center !important; + width: 5%; + min-width: 40px; + white-space: nowrap; +} + +.snarkTorrentName { + line-height: 110%; + padding-left: 3px !important; +} + +.snarkTorrentName a, .snarkDirInfo .snarkFileName a { + font-weight: bold !important; +} + +.snarkTorrentNoneLoaded td { + border-bottom: 1px solid #443da0; + text-align: center !important; + font-weight: bold; + color: #c9ceff !important; + padding: 10px; + background: #001; +} + +.snarkTorrentStatus { + padding: 2px 5px 2px 2px !important; + text-align: left !important; + text-align: left !important; + color: #9b96e0 !important; + white-space: nowrap; +} + +.snarkTorrentStatus b { + margin-right: 3px; +} + +.snarkTorrentStatus, .snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded { + line-height: 90%; + padding: 0 3px; +} + +.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded { + text-align: center !important; +} + +.snarkTorrentDownloaded { + font-weight: bold; + color: #c9ceff !important; + padding: 0 5px; + white-space: nowrap; +} + +.snarkTorrentUploaded { + color: #7670c2 !important; +} + +.snarkTorrentRateUp { + color: #7670c2 !important; +} + +.snarkTorrentRateDown { + color: #7670c2 !important; +} + +.snarkTorrents img { + padding: 2px !important; +} + +.snarkTorrents a { + display: inline-block; + width: 100%; +} + +.snarkTorrents th a { + display: inline; +} + +.snarkTorrents th img { + padding: 2px !important; + margin-bottom: 2px !important; +} + +.snarkTorrents thead th:last-child img { + padding: 2px !important; +} + +.snarkTorrents tfoot th { + padding: 6px 4px !important; + background: #000; +} + +.snarkTorrents tr:hover, .snarkDirInfo tr:hover { + background: #040033 !important; +} + +.snarkTorrents tr:hover td, .snarkDirInfo tr:hover td { + color: #c9ceff !important; +} + +.snarkTorrentETA { + font-style: italic; + color: #7b74e0 !important; + padding-left: 3px !important; + padding-right: 3px !important; + text-align: center !important; +} + +.snarkTorrentAction { + width: 1% !important; + padding: 1px 2px 1px 1px !important; + text-align: center !important; + white-space: nowrap; +} + +.snarkTorrentAction img { + margin: 0 2px !important; + opacity: 1; +} + +.snarkTorrentAction img:hover { + opacity: 1; + box-shadow: 0 0 1px 1px #652787; +} + +.snarkTorrentAction input[type="image"] { + background: linear-gradient(to bottom, #181d4f 0%, #181d4f 50%, #001 50%, #001 100%); + border: 1px solid #443da0 !important; + border: 1px solid #171c3f !important; + box-shadow: inset 0 0 0 1px #000; + padding: 4px !important; + border-radius: 2px; + text-align: center; + mix-blend-mode: normal; + margin: 0 2px; +} + +th.snarkTorrentAction input[type="image"] { + width: 20px; + padding: 4px !important; + margin-bottom: 1px; +} + +td.snarkTorrentAction input[type="image"] { + width: 10px; +} + +.snarkTorrentAction input[type="image"]:hover, .snarkTorrentAction input[type="image"]:focus { +/* borders on hover only for torrent control buttons, otherwise drop-shadow */ + border: 1px solid #652787 !important; +} + +.snarkTorrentAction input[type="image"]:active { + box-shadow: inset 3px 3px 2px #000; } .peerinfo td:nth-child(4) { font-weight: bold; } -.snarkTorrents td[colspan="10"] { - padding: 2px; -} - -.snarkTorrents img { - margin: 0 !important; - padding: 0 !important; -} - -.snarkTorrents tt { - font-family: "Droid Sans Mono", "Noto Mono", "Noto Mono", "DejaVu Sans Mono", "Lucida Console", monospace; - font-size: 8pt; - background: #2d103f; - color: #fff; - padding: 2px 3px; - border-radius: 2px; - display: inline-block; - margin: 1px 3px; - letter-spacing: 0.1em; -} +/* end main torrent listing */ .snarkTorrentInfo img { max-height: 16px !important; @@ -549,7 +674,7 @@ tfoot tr:nth-child(n+1) { } .snarkTorrentInfo th { - padding: 4px !important; + padding: 8px 4px !important; text-align: left; border-top: none; } @@ -560,20 +685,18 @@ tfoot tr:nth-child(n+1) { background-blend-mode: luminosity; } -.snarkTorrentInfo th:nth-child(2) { - font-size: 9pt; - padding: 5px 5px 5px 0 !important; +.snarkTorrentInfo th:nth-child(2), .snarkTorrentInfo td:nth-child(2) { + padding-left: 0 !important; } .snarkTorrentInfo td { text-align: left !important; vertical-align: middle !important; - font-size: 9pt; + padding: 6px 4px; } .snarkTorrentInfo td:first-child { width: 20px !important; - padding: 3px 4px 4px !important; } .snarkTorrentInfo input[type="submit"] { @@ -582,7 +705,7 @@ tfoot tr:nth-child(n+1) { } .snarkTorrentInfo tr:nth-last-child(2) td { - padding: 5px 2px; + padding: 6px 2px; } .snarkTorrentInfo tr:last-child { @@ -610,17 +733,27 @@ tfoot tr:nth-child(n+1) { background: #02001a; } +#infohash { + color: #cc0; + -moz-user-select: all; + -webkit-user-select: all; + user-select: all; +} + .SnarkDirInfo { margin-top: 10px !important; margin-bottom: -13px; border-bottom: 1px solid #443da0; } +.snarkDirInfo th { + padding: 4px 6px; +} + .snarkDirInfo th img { margin: 0 !important; } - .snarkDirInfo th:nth-child(2) { padding-right: 10px; } @@ -630,7 +763,7 @@ tfoot tr:nth-child(n+1) { } .snarkDirInfo th:first-child { - padding-left: 5px; + padding-left: 6px; } .snarkDirInfo td:first-child { @@ -638,10 +771,6 @@ tfoot tr:nth-child(n+1) { text-align: left; } -.snarkDirInfo td:first-child img { - padding-right: 6px; -} - .snarkDirInfo tr:last-child td { border-bottom: 1px solid #443da0 !important; } @@ -655,11 +784,7 @@ tfoot tr:nth-child(n+1) { border-bottom: 1px solid #443da0 !important; } -.headerpriority input[type=submit] { - margin: 5px; -} - -table.SnarkDirInfo img { +.SnarkDirInfo img { max-width: 16px; max-height: 16px; } @@ -670,15 +795,52 @@ table.SnarkDirInfo img { margin: 0 !important; } -td.subHeaderPriority, td.priority { +.ParentDir { + padding: 6px !important; + text-align: left !important; + border: 1px solid #1d1b3f !important; + border-right: 0 !important; + border-left: 0 !important; + background: #001; +} + +.ParentDir a { + font-weight: bold !important; + margin-left: -4px; + display: inline-block; + width: 100%; +} + +.parentDir img { + margin-right: 5px; + padding-left: 3px; +} + +.parentDir img { + mix-blend-mode: luminosity; +} + +.headerstatus { + text-align: center; +} + +.headerpriority { + padding-left: 10px; + text-align: left; +} + +.headerpriority input[type=submit] { + margin: 5px; +} + +.subHeaderPriority, .priority { width: 0; min-width: 160px !important; padding: 0 5px 0 0 !important; text-align: center !important; } -td.subHeaderPriority { - font-size: 7.5pt; +.subHeaderPriority { font-weight: bold; padding: 0 1px !important; text-align: center !important; @@ -716,11 +878,6 @@ th.headerdownloaded { display: none; } -.parentDir img { - padding-left: 3px; - mix-blend-mode: luminosity; -} - .snarkFileStatus { font-size: 8pt; text-align: left; @@ -748,138 +905,10 @@ td { color: #c9ceff; } -td:first-child { - font-size: 9pt; +#configs td:first-child, .snarkCommentInfo td:first-child, .snarkComments td:first-child { text-align: right; } -.center { - text-align: center !important; -} - -.snarkTorrentName { - line-height: 110%; - padding: 0; - font-size: 8.5pt; -} - -.snarkTorrentName a, .snarkDirInfo td.snarkFileName a { - font-weight: bold !important; -} - -.snarkTorrentAction { - width: 60px; - margin: 0 !important; - padding: 1px !important; - text-align: center !important; -} - -/* MS Edge fix */ -_:-ms-lang(x), .snarkTorrentAction { - width: 72px !important; -} - -.snarkTorrentAction img { - margin: 0 2px !important; - opacity: 1; -} - -.snarkTorrentAction img:hover { - opacity: 1; - box-shadow: 0 0 1px 1px #652787; -} - -td.snarkTorrentAction { - width: 66px; - min-width: 66px; -} - -.snarkTorrentNoneLoaded { - font-size: 8.5pt; - font-weight: bold; - padding: 10px 5px; - text-align: center !important; - color: #3222ff !important; - border-bottom: 1px solid #443da0; - background: #001; -} - -.snarkTorrentStatus { - padding: 2px 2px 2px 0; - text-align: left !important; - font-size: 8pt; - min-width: 48px; - text-align: left !important; - color: #9b96e0 !important; - white-space: nowrap; -} - -.snarkTorrentStatus { - padding-right: 3px !important; -} - -.snarkTorrentStatus b { - margin-right: 3px; -} - -.snarkTorrentStatus, .snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded { - font-size: 8pt; - line-height: 90%; - padding: 0 3px; -} - -.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded { - text-align: center !important; -} - -.snarkTorrentDownloaded { - color: #c9ceff !important; - white-space: nowrap; -} - -td.snarkTorrentDownloaded { - font-weight: bold; - padding: 0 5px; -} - -.snarkTorrentUploaded { - color: #7670c2 !important; -} - -.snarkTorrentRateUp { - color: #7670c2 !important; -} - -.snarkTorrentRateDown { - color: #7670c2 !important; -} - -.snarkTorrents img { - padding: 2px !important; -} - -.snarkTorrents th img { - padding: 2px !important; - margin-bottom: 2px !important; -} - -.snarkTorrents thead th:last-child img { - padding: 2px !important; -} - -.snarkTorrents tfoot th { - padding: 6px 4px !important; - background: #000; -} - -.snarkTorrents tr:hover, .snarkDirInfo tr:hover { - background: #040033 !important; -} - -.snarkTorrents tr:hover td, .snarkDirInfo tr:hover td { - color: #c9ceff !important; -} - .snarkDirInfo tr:hover .snarkFileStatus img { mix-blend-mode: normal; } @@ -888,15 +917,6 @@ tr:hover .percentBarText { opacity: 0.9; } -.snarkTorrents a { - display: inline-block; - width: 100%; -} - -.snarkTorrents th a { - display: inline; -} - .snarkTorrentEven { background: #010010; } @@ -958,14 +978,6 @@ _:-ms-lang(x), .snarkTorrentOdd, .snarkTorrentOdd td, .SnarkTorrentEven, .SnarkT white-space: nowrap; } -.snarkTorrentETA { - font-style: italic; - color: #7b74e0 !important; - padding-left: 3px !important; - padding-right: 3px !important; - text-align: center !important; -} - /* download bars */ .snarkTorrentDownloaded { @@ -1012,6 +1024,10 @@ _:-ms-lang(x), .snarkTorrentOdd, .snarkTorrentOdd td, .SnarkTorrentEven, .SnarkT 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)); } +.peerinfo .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%); +} + .snarkDirInfo .percentBarInner[style="width: 0%;"] .percentBarText { opacity: 0.9; } @@ -1030,7 +1046,7 @@ _:-ms-lang(x), .snarkTorrentOdd, .snarkTorrentOdd td, .SnarkTorrentEven, .SnarkT .percentBarText { text-align: center; font-weight: bold !important; - line-height: 16px; + line-height: 17px; white-space: nowrap; display: block; color: #00ecff; @@ -1348,50 +1364,6 @@ thead a img:hover { filter: drop-shadow(0 0 1px #f60) !important; } -.snarkTorrentAction { - white-space: nowrap; -} - -.snarkTorrents td:last-child { - padding: 4px 2px !important; -} - -.snarkTorrents th:last-child input[type="image"], -.snarkTorrents td:last-child input[type="image"] { - background: linear-gradient(to bottom, #181d4f 0%, #181d4f 50%, #001 50%, #001 100%); - border: 1px solid #443da0 !important; - border: 1px solid #171c3f !important; - box-shadow: inset 0 0 0 1px #000; - padding: 4px !important; - border-radius: 2px; - text-align: center; - mix-blend-mode: normal; - margin: 0 2px; -} - -.snarkTorrents th:last-child input[type="image"] { - width: 20px; - padding: 4px !important; - margin-bottom: 1px; -} - -.snarkTorrents td:last-child input[type="image"] { - width: 10px; -} - -.snarkTorrents th:last-child input[type="image"]:hover, -.snarkTorrents th:last-child input[type="image"]:focus, -.snarkTorrents td:last-child input[type="image"]:hover, -.snarkTorrents td:last-child input[type="image"]:focus { -/* borders on hover only for torrent control buttons, otherwise drop-shadow */ - border: 1px solid #652787 !important; -} - -.snarkTorrents th:last-child input[type="image"]:active, -.snarkTorrents td:last-child input[type="image"]:active { - box-shadow: inset 3px 3px 2px #000; -} - input[type=text]:hover, input.r:hover { cursor: text; } @@ -1560,6 +1532,8 @@ img.thumb { mix-blend-mode: normal !important; } +/* pagenav */ + #pagenav img.disable, #pagenav img.disable:hover { opacity: .3; @@ -1598,17 +1572,15 @@ img.thumb { border: 1px solid #000 !important; } -.newtorrentsection td:first-child, -.addtorrentsection td:first-child { +/* end pagenav */ + +.newtorrentsection td:first-child, .addtorrentsection td:first-child { font-weight: bold; padding-right: 5px; padding-left: 5px; white-space: nowrap; -} - -.newtorrentsection td:first-child, -.addtorrentsection td:first-child { width: 120px; + text-align: right; } #trackerselect { @@ -1717,18 +1689,11 @@ _:-ms-lang(x), #trackerselect tr:last-child { cursor: default; } -.snarkTorrentNoneLoaded td { - color: #c9ceff !important; - padding: 10px; - background: #001; -} - .snarkNewTorrent td { padding: 2px 3px; } -.snarkNewTorrent td:nth-child(2), -.snarkNewTorrent td:nth-child(3) { +.snarkNewTorrent td:nth-child(2), .snarkNewTorrent td:nth-child(3) { font-weight: bold; padding-right: 5px; } @@ -1757,6 +1722,13 @@ _:-ms-lang(x), #trackerselect tr:last-child { display: inline-block; } +#configs input.r, #configs input[type="text"], select { + min-width: 120px; +} + +input[name="nofilter_commentsName"] { + width: 250px; +} #configs td, .trackerconfig td { padding: 6px 5px !important; @@ -2320,6 +2292,210 @@ td#bwHelp a { margin: 8px; } +/* Comments Section */ + +.snarkCommentInfo, .snarkComments { + margin: 10px 0 0 !important; + background: #000; + border: 1px solid #443da0; + filter: drop-shadow(0px 0 1px rgba(16, 8, 16, 0.7)); +} + +.iframed .snarkCommentInfo, .iframed .snarkComments { + border-left: none; + border-right: none; +} + +.snarkComments { + margin-top: -1px !important; + border-top: 1px inset #12111f; +} + +.snarkCommentInfo th { + background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #121225, #00000d); + padding: 8px 5px 8px 30px !important; +} + +.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(odd) { + background: #010010; + border-bottom: 1px inset #12111f; +} + +.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(even) { + background: #010008; + border-bottom: 1px inset #12111f; +} + +.snarkCommentInfo th { + padding: 8px 5px; +} + +.snarkCommentInfo td, .snarkComments td { + padding: 8px 5px; +} + +.snarkCommentInfo td:first-child { + white-space: nowrap; +} + +.snarkCommentInfo td:first-child { + font-weight: bold; +} + +.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after { + content: ""; + display: inline-block; + min-height: 32px; + vertical-align: middle; +} + +.snarkCommentInfo input.accept { + float: right; + margin-right: 5px !important; +} + +.snarkCommentInfo textarea { + font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "DejaVu Sans", Verdana, Helvetica, sans-serif; + font-weight: normal; + width: 100%; + min-height: 64px; + height: 64px; + resize: vertical; +} + +.snarkComments th { + text-align: left; +} + +.commentRating, .commentAuthor { + width: 1%; +} + +#nameRequired { + float: right; + margin-right: 5px; +} + +.commentRating { + padding-right: 10px !important; +} + +.commentRating img { + margin: 0; + padding: 0; +} + +.commentDate { + width: 100px; + background: url(images/clock.png) left center no-repeat; + padding-left: 20px !important; +} + +.snarkCommentInfo td:first-child, .snarkComments td:first-child { + width: 160px !important; + min-width: 160px !important; + padding-right: 2px; +} + +.snarkCommentInfo td:last-child, .snarkComments td:last-child { + width: 1% !important; +} + +.snarkComments td { + white-space: nowrap; +} + +.commentAuthorName { + background: url(images/author.png) left center no-repeat; + padding-left: 20px; +} + +.commentText { + white-space: normal; + text-align: justify; + width: 90%; +} + +.commentWrapper { + border: 1px solid #003; + margin: 2px 0; + padding: 8px 10px 8px 26px; + border-radius: 3px; + box-shadow: inset 0 0 0 1px #339, 0 0 1px 0 rgba(0,0,0,0.3); + background: url(images/comment.png) 6px center no-repeat #002; + background-blend-mode: luminosity; +} + +#commentsConfig .optbox { + vertical-align: middle !important; +} + +.snarkComments select { + margin-right: 0 !important; +} + +#commentDeleteAction { + border-top: 1px solid #443da0; + background: linear-gradient(to bottom, #000018, #00000d); +} + +#commentDeleteAction td { + padding-right: 6px; +} + +.commentAction, .commentDelete { + width: 1%; + white-space: nowrap; + padding-left: 0; +} + +.addCommentText, .commentText { + padding-right: 0; +} + +.commentAction input[type="submit"] { + margin-top: 10px; + margin-bottom: 10px; +} + +.commentDelete { + background: url(../ubergine/images/nuke.png) 2px center no-repeat; + text-align: center; + padding-left: 22px !important; +} + +#newRating td { + padding-top: 10px !important; + padding-bottom: 10px !important; +} + +#newRating select { + width: 90%; +} + +#myRating td:empty { + padding: 0 !important; + border-top: none !important; + border-bottom: none !important; +} + +#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ + min-height: 1px !important; +} + +.commentRating img { + margin: 0 0 4px; + padding: 0; + width: 16px; + height: 16px; + font-size: 14pt; + color: #FF7200; + text-shadow: 0 0 1px #900; + filter: none; +} + +/* end Comments section */ + /* MS Edge fix */ _:-ms-lang(x), * { filter: none !important; @@ -2327,7 +2503,13 @@ _:-ms-lang(x), * { /* responsive layout */ +/* mini-mode - hides upload columns + text torrent status in main torrent listing and shrinks other ui elements */ + @media screen and (max-width: 950px) { +td, th, td a, input { + font-size: 8pt !important; +} + .snarkTorrents td:nth-child(2) { white-space: nowrap; } @@ -2343,19 +2525,87 @@ b.alwaysShow { display: inline; } -.snarkTorrents th:first-child, .snarkTorrents td:first-child { - width: 26px !important; -} - .snarkTorrents td:first-child img { max-height: 16px; } -.snarkTorrents td:nth-child(2) { +.snarkTorrentStatus { font-weight: bold; } + +.snarknavbar, .page { + min-width: 600px !important; } +.snarkTorrentName { + max-width: 260px; +} + +.snarkTorrentStatus, .snarkTorrentUploaded, .snarkTorrentRateUp, tfoot .snarkTorrentAction { + display: none; +} + +tfoot .snarkTorrentDownloaded, tfoot .snarkTorrentRateDown { + font-size: 0 !important; +} + +.snarkMessages li:first-child::after { + content: "minimode"; + display: inline-block; + font-size: 9pt !important; + float: right; + vertical-align: middle; + position: relative; + bottom: -38px; + right: -16px; + background: rgba(0,0,48,0.3); + padding: 2px; + border-radius: 4px; + z-index: 0; +} + +td.snarkTorrentAction input[type="image"] { + width: 9px; +} + +textarea[name="i2cpOpts"], input[name="nofilter_dataDir"] { + width: 350px !important; + min-width: 350px !important; +} + +input.trackerhome, input.trackerannounce, .knownTracker a, #trackerselect a { + max-width: 130px !important; +} + +#configs td:first-child { + min-width: 150px !important; +} + +.trackerconfig th { + min-width: 32px; +} + +.trackerconfig td { + padding 5px 2px !important; +} + +.snarkCommentInfo td:first-child, .snarkComments td:first-child { + min-width: 0 !important; + width: 140px !important; +} + +.snarkTorrentInfo a { + display: inline-block; + vertical-align: text-top; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + max-width: 400px; +} +} + +/* end mini-mode */ + @media screen and (max-width: 1200px) { .dirInfoComplete { display: none; @@ -2374,16 +2624,13 @@ b.alwaysShow { background-size: 14px 14px !important; } -.snarkTorrents th:first-child, .snarkTorrents td:first-child { - width: 30px !important; -} - .peerinfo .percentBarText, .snarkDirInfo .percentBarText { line-height: 18px; } .percentBarText, .percentBarOuter { width: 100px; + height: 14px; } .snarkDirInfo .percentBarText, .snarkDirInfo .percentBarOuter, .peerinfo .percentBarText, .peerinfo .percentBarOuter { @@ -2398,6 +2645,10 @@ b.alwaysShow { 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)); } +.peerinfo .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%); +} + .configsectionpanel .snarkConfigTitle { font-size: 10.5pt !important; } @@ -2432,6 +2683,10 @@ b.alwaysShow { .configsectionpanel .snarkConfigTitle { margin-top: -1px; } + +#snarkCommentSection { + margin: 23px -1px 0 !important; +} } @media screen and (min-width: 1200px) { @@ -2450,6 +2705,10 @@ a, th, thead th, tfoot th, td, select, select option, .snarkAddInfo, .snarkFileN .percentDownloaded { pointer-events: none; /* hide tooltip */ } + +.snarkTorrentStatus { + padding-right: 10px !important; +} } @media screen and (min-width: 1400px) { @@ -2543,197 +2802,3 @@ a, th, thead th, tfoot th, td, select, select option, .snarkAddInfo, .snarkFileN /* end responsive layout */ -/* Comments Section */ -/* TODO: merge with other rules where applicable */ - -.snarkCommentInfo, .snarkComments { - margin: 10px 0 0 !important; - background: #000; - border: 1px solid #443da0; - filter: drop-shadow(0px 0 1px rgba(16, 8, 16, 0.7)); -} - -.snarkCommentInfo th { - background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #121225, #00000d); - padding: 8px 5px 8px 30px !important; -} - -.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(even) { - background: #010010; - border-bottom: 1px inset #12111f; -} - -.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(odd) { - background: #010008; - border-bottom: 1px inset #12111f; -} - -.snarkCommentInfo th { - padding: 8px 5px; -} - -.snarkCommentInfo td, .snarkComments td { - padding: 8px 5px; -} - -.snarkCommentInfo td:first-child { - white-space: nowrap; -} - -.snarkCommentInfo td:first-child { - font-weight: bold; -} - -.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after { - content: ""; - display: inline-block; - min-height: 32px; - vertical-align: middle; -} - -.snarkCommentInfo input.accept { - float: right; - margin-right: 5px !important; -} - -.snarkCommentInfo textarea { /* remember to set 10pt @ > 1400px */ - font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "DejaVu Sans", Verdana, Helvetica, sans-serif; - font-weight: normal; - width: 100%; - min-height: 64px; - height: 64px; - resize: vertical; -} - -.snarkComments th { - text-align: left; -} - -.commentRating, .commentAuthor { - width: 1%; -} - -#nameRequired { - float: right; - margin-right: 5px; -} - -.commentRating { - padding-right: 10px !important; -} - -.commentRating img { - margin: 0; - padding: 0; -} - -.commentDate { - width: 100px; - background: url(images/clock.png) left center no-repeat; - padding-left: 20px !important; -} - -.snarkCommentInfo td:first-child, .snarkComments td:first-child { - width: 160px !important; - padding-right: 2px; -} - -.snarkCommentInfo td:last-child, .snarkComments td:last-child { - width: 1% !important; -} - -.snarkComments td { - white-space: nowrap; -} - -.commentAuthorName { - background: url(images/author.png) left center no-repeat; - padding-left: 20px; -} - -td.commentText { - white-space: normal; - text-align: justify; - width: 90%; -} - -.commentWrapper { - border: 1px solid #003; - margin: 2px 0; - padding: 8px 10px 8px 26px; - border-radius: 3px; - box-shadow: inset 0 0 0 1px #339, 0 0 1px 0 rgba(0,0,0,0.3); - background: url(images/comment.png) 6px center no-repeat #002; - background-blend-mode: luminosity; -} - -.commentText .optbox { - position: fixed; - right: 20px; - top: 10px; -} - -#commentsConfig .optbox { - vertical-align: middle !important; -} - -.snarkComments select { - margin-right: 0 !important; -} - -#commentDeleteAction { - border-top: 1px solid #443da0; - background: linear-gradient(to bottom, #000018, #00000d); -} - -#commentDeleteAction td { - padding-right: 6px; -} - -.commentAction, .commentDelete { - width: 1%; - white-space: nowrap; -/* min-width: 180px !important;*/ - padding-left: 0; -} - -.addCommentText, .commentText { - padding-right: 0; -} - -.commentAction input[type="submit"] { - margin-top: 10px; - margin-bottom: 10px; -} - -.commentDelete { - text-align: left; -} - -#newRating td { - padding-top: 10px !important; - padding-bottom: 10px !important; -} - -#myRating td:empty { - padding: 0 !important; - border-top: none !important; - border-bottom: none !important; -} - -#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ - min-height: 1px !important; -} - -.commentRating img { - margin: 0 0 4px; - padding: 0; - width: 16px; - height: 16px; - font-size: 14pt; - color: #FF7200; - text-shadow: 0 0 1px #900; - filter: none; -} - -/* end Comments section */ diff --git a/installer/resources/themes/snark/ubergine/snark.css b/installer/resources/themes/snark/ubergine/snark.css index 007490e38f..d7de74949b 100644 --- a/installer/resources/themes/snark/ubergine/snark.css +++ b/installer/resources/themes/snark/ubergine/snark.css @@ -434,6 +434,8 @@ tfoot tr:nth-child(n+1) { vertical-align: top; } +/* main torrents listing */ + .snarkTorrents { background: #212; margin: 0; @@ -451,6 +453,10 @@ tfoot tr:nth-child(n+1) { } } +.snarkTorrents tr, .snarkTorrents td { + border-top: 1px solid #202 !important; +} + .snarkTorrents thead th { border-top: 1px solid transparent !important; } @@ -464,15 +470,96 @@ tfoot tr:nth-child(n+1) { max-width: 45px; } -.snarkTorrents thead th:first-child { - text-align: center !important; - width: 16px !important; +.snarkGraphicStatus, .snarkTorrentStatus { + white-space: nowrap; + width: 1%; } -.snarkTorrents thead th:nth-child(2) { - text-align: left; - min-width: 50px; -} +.snarkGraphicStatus { + text-align: center !important; +} + +.snarkTorrentStatus { + font-weight: normal !important; + padding: 2px 2px 2px 0 !important; + line-height: 110%; + text-align: left !important; +} + +th.snarkTorrentStatus { + text-align: center !important; +} + +.snarkTrackerDetails, .SnarkTorrentDetails { + width: 16px; + padding: 2px 0; +} + +.snarkTrackerDetails { + text-align: right; +} + +.snarkTorrentName { + line-height: 110%; + padding: 2px 1px 2px 3px; +} + +.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded, .snarkFileSize, .snarkTorrentStatus, .snarkFileName { + font-size: 8pt; + font-weight: bold; + padding: 0 3px; + line-height: 100%; +} + +.snarkTorrentUploaded, .snarkTorrentRateUp { + color: #b9b !important; +} + +.snarkTorrentRateDown { + color: #76a !important; +} + +.snarkTorrentETA, .snarkTorrentUploaded, .snarkTorrentRateDown, .snarkTorrentRateUp { + width: 5%; + min-width: 40px; + white-space: nowrap; +} + +.snarkTorrentETA { + font-weight: bold; + font-style: italic; + color: #dd7 !important; + line-height: 120%; +} + +.snarkTorrentAction { + padding: 1px 2px 1px 1px !important; + text-align: center; + width: 1%; + white-space: nowrap; +} + +th.snarkTorrentAction input[type="image"] { + padding: 0; + max-width: 32px; + background: #40003f; + border-radius: 2px; + border: 1px solid #202; +} + +th.snarkTorrentAction input[type="image"]:hover { + border: 1px solid #f60; +} + +.snarkTorrentAction img { + margin: 0 2px !important; + opacity: 0.6; +} + +.snarkTorrentAction img:hover { + box-shadow: 0 0 1px 1px #f90; + opacity: 1; +} .snarkTorrents tfoot { background: #101; @@ -505,19 +592,10 @@ tfoot tr:nth-child(n+1) { text-align: right; } -.snarkTorrents td:nth-child(3), .SnarkTorrents td:nth-child(4) { - width: 16px; - padding: 2px 0; -} - -.snarkTorrents .peerinfo td:nth-child(3), .snarkTorrents .peerinfo td:nth-child(4) { +.peerinfo td:nth-child(3), .peerinfo td:nth-child(4) { padding: 2px 4px; } -.snarkTorrents td:nth-child(3) { - text-align: right; -} - .snarkTorrents tt { font-family: "Noto Mono", "Droid Sans Mono", "Lucida Console", "DejaVu Sans Mono", monospace; color: #cc0; @@ -525,6 +603,27 @@ tfoot tr:nth-child(n+1) { margin-right: 2px; } +#totals span, #ourDest { + white-space: nowrap; +} + +.snarkTorrentNoneLoaded { + padding: 10px; + background: #323; + font-size: 8.5pt; + font-weight: bold; + text-align: center !important; + color: #bbb !important; + border-radius: 0 0 2px 2px; +} + +.snarkTorrents th:empty + th:empty, .snarkTorrents td:empty + td:empty, .snarkTorrentETA:empty, .snarkTorrentAction:empty { + width: 0 !important; + min-width: 0 !important; +} + +/* end main torrents listing */ + td { padding: 2px 4px; color: #ddd !important; @@ -541,78 +640,6 @@ td:first-child { font-size: 8pt; } -.center { - text-align: center !important; -} - -.snarkTorrentName { - line-height: 110%; - padding: 2px 1px 2px 3px; -} - -.snarkTorrentName img { - padding: 1px; - text-align: left; - vertical-align: middle; -} - -.snarkTorrentAction { - padding: 1px !important; - text-align: center; - width: 1%; - white-space: nowrap; -} - -.snarkTorrents thead th:last-child { - white-space: nowrap !important; - text-align: center; - padding-right: 4px; - width: 1%; -} - -.snarkTorrents th:last-child input[type="image"] { - padding: 0; - max-width: 32px; - background: #40003f; - border-radius: 2px; - border: 1px solid #202; -} - -.snarkTorrents th:last-child input[type="image"]:hover { - border: 1px solid #f60; -} - -.snarkTorrentAction img { - margin: 0 2px !important; - opacity: 0.6; -} - -.snarkTorrentAction img:hover { - box-shadow: 0 0 1px 1px #f90; - opacity: 1; -} - -.snarkTorrentNoneLoaded { - padding: 10px; - background: #323; - font-size: 8.5pt; - font-weight: bold; - text-align: center !important; - color: #bbb !important; - border-radius: 0 0 2px 2px; -} - -.snarkTorrentStatus { - padding: 2px 2px 2px 0; - line-height: 110%; - text-align: left !important; -} - -.snarkTorrentStatus img { - margin-right: 10px !important; - margin-left: 6px; -} - img[src$="details.png"] { mix-blend-mode: luminosity; } @@ -621,33 +648,6 @@ a img[src$="details.png"]:hover, a:focus img[src$="details.png"] { mix-blend-mode: initial !important; } -.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded, .snarkFileSize, .snarkTorrentStatus, .snarkFileName { - font-size: 8pt; - font-weight: bold; - padding: 0 3px; - line-height: 100%; -} - -.snarkTorrentStatus { - font-weight: normal; -} - -.snarkTorrents td:nth-child(2) { - padding-left: 0; -} - -.snarkTorrentUploaded { - color: #b9b !important; -} - -.snarkTorrentRateUp { - color: #b9b !important; -} - -.snarkTorrentRateDown { - color: #76a !important; -} - .snarkTorrentOdd { background: #351933; font-size: 8pt; @@ -658,10 +658,6 @@ a img[src$="details.png"]:hover, a:focus img[src$="details.png"] { background: #270027; } -.snarkTorrents tr, .snarkTorrents td { - border-top: 1px solid #202 !important; -} - .snarkTorrentEven + .snarkTorrentEven:nth-child(even), .snarkTorrentOdd + .snarkTorrentOdd:nth-child(even) { background: #303; background: linear-gradient(to right, #404, #404 5px, #313 5px, #404); @@ -699,7 +695,7 @@ a img[src$="details.png"]:hover, a:focus img[src$="details.png"] { text-align: right !important; } -table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:hover { +.snarkTorrents tbody tr:hover, .snarkDirInfo tbody tr:hover { background: #58165e !important; background: linear-gradient(to bottom, #58165e 0%, #4a0d56 100%) !important; border-top: 1px solid #101 !important; @@ -711,12 +707,12 @@ tr:hover .percentBarText { } /* MS Edge fix */ -_:-ms-lang(x), table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:hover { +_:-ms-lang(x), .snarkTorrents tbody tr:hover, .snarkDirInfo tbody tr:hover { box-shadow: none !important; background: #58165e !important; } -table.snarkTorrents tbody tr:hover .snarkTorrentName, table.snarkDirInfo tbody tr:hover td .snarkFileName { +.snarkTorrents tbody tr:hover .snarkTorrentName, .snarkDirInfo tbody tr:hover td .snarkFileName { color: #fff !important; } @@ -765,13 +761,6 @@ table.snarkTorrents tbody tr:hover .snarkTorrentName, table.snarkDirInfo tbody t opacity: 0.7; } -.snarkTorrentETA { - font-weight: bold; - font-style: italic; - color: #dd7 !important; - line-height: 120%; -} - .snarkTorrentInfo img { max-height: 16px !important; margin: 1px 2px 2px 4px !important; @@ -810,6 +799,13 @@ table.snarkTorrents tbody tr:hover .snarkTorrentName, table.snarkDirInfo tbody t background: #351933; } +#infohash { + color: #cc0; + -moz-user-select: all; + -webkit-user-select: all; + user-select: all; +} + #torrentInfoControl td { text-align: right !important; border-top: 1px solid #101; @@ -824,14 +820,14 @@ table.snarkTorrents tbody tr:hover .snarkTorrentName, table.snarkDirInfo tbody t padding: 8px 5px !important; } -table.SnarkTorrentInfo, table.snarkDirInfo { +.SnarkTorrentInfo, .snarkDirInfo { margin: 0 !important; border: 1px solid #101; background: #270027; filter: drop-shadow(0 0 1px rgba(16, 8, 16, 0.7)) !important; } -table.snarkDirInfo { +.snarkDirInfo { margin-top: 10px !important; } @@ -1004,7 +1000,7 @@ _:-ms-lang(x), .snarkDirInfo img, .snarkTorrents img { transition: ease all 0.3s; } -div.snarkNewTorrent { +.snarkNewTorrent { font-size: 8pt; margin-top: -1px; } @@ -1054,7 +1050,7 @@ table#trackerselect { user-select: all; } -.toggleview, .snarkConfigTitle, .snarknavbar, img, input[type="image"] { +.toggleview, .snarkConfigTitle, .snarknavbar, img, input[type="image"], label { -moz-user-select: none; -webkit-user-select: none; user-select: none; @@ -1366,6 +1362,14 @@ textarea[name="i2cpOpts"] { overflow: hidden; } +input[name="nofilter_commentsName"] { + max-width: 249px; +} + +input[name="nofilter_commentsName"]:focus::placeholder { + opacity: 0; +} + input[type=text]:active, input[type=text]:focus, input.r:focus, input[name="nofilter_dataDir"]:focus, textarea:focus { background: #d60; background: linear-gradient(to bottom, #d60, #c50); @@ -1399,7 +1403,7 @@ input[type="radio"], input[type="checkbox"], select, input[type="submit"], label } input[type=text], input.r, select { - min-width: 110px; + min-width: 120px; } input[name="upBW"] + i { @@ -1676,7 +1680,7 @@ img[src$="magnet.png"] { background-size: 84px 82px, 100% 100%; } -.configsectionpanel, .configsectionpanel td, .snarkNewTorrent, .snarkNewTorrent td, .snarkAddInfo, +.configsectionpanel, .configsectionpanel td, .snarkNewTorrent, .snarkNewTorrent td, .snarkAddInfo, select, input, input.r, input[name="nofilter_dataDir"], textarea[name="i2cpOpts"], a.control { font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "DejaVu Sans", Verdana, sans-serif; font-size: 9pt !important; @@ -1735,17 +1739,17 @@ select, input, input.r, input[name="nofilter_dataDir"], textarea[name="i2cpOpts" margin-top: 1px; } -div.configsection table { +.configsection table { color: #ffb; opacity: 1; } -div.configsection a, label.toggleview { +.configsection a, label.toggleview { color: #f60; text-shadow: 0 0 1px #000; } -div.configsection a:hover, .snarkConfig .snarkConfigTitle:hover a, .snarkConfig .snarkConfigTitle a:focus { +.configsection a:hover, .snarkConfig .snarkConfigTitle:hover a, .snarkConfig .snarkConfigTitle a:focus { color: #d2baff; text-decoration: none; } @@ -2024,7 +2028,7 @@ hr.debug + hr { margin-bottom: -7px; } -tr.dhtDebug th { +.dhtDebug th { white-space: normal; word-break: break-all; border-top: 1px solid #313; @@ -2145,15 +2149,6 @@ input#toggle_debug:checked + label + #dhtDebugInner { font-weight: bold; } -.priority { - font-size: 8pt; - vertical-align: middle; - text-align: right !important; - padding-right: 15px; - white-space: nowrap; - width: 1%; -} - .priority::after { content: ""; display: inline-block; @@ -2272,6 +2267,221 @@ input#toggle_debug:checked + label + #dhtDebugInner { margin: 8px; } +/* Comments Section */ +/* TODO: merge with other rules where applicable */ + +#snarkCommentSection { + filter: drop-shadow(0px 0 1px rgba(16, 8, 16, 0.7)); +} + +.snarkCommentInfo, .snarkComments { + margin: 10px 0 0 !important; + background: #270027 none repeat scroll 0 0; + border: 1px solid #101; + filter: none;; +} + +.snarkComments { + margin-top: -1px !important; +} + +.snarkCommentInfo th { + background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #202, #101); + padding: 8px 5px 8px 30px !important; +} + +.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(odd) { + background: #351933; + border-bottom: 1px solid #101; +} + +.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(even) { + background: #270027; + border-bottom: 1px solid #101; +} + +.snarkCommentInfo th { + padding: 8px 5px; +} + +.snarkCommentInfo td, .snarkComments td { + padding: 8px 5px; +} + +.snarkCommentInfo td:first-child { + white-space: nowrap; +} + +.snarkCommentInfo td:first-child { + font-weight: bold; +} + +.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after { + content: ""; + display: inline-block; + min-height: 32px; + vertical-align: middle; +} + +.snarkCommentInfo input.accept { + float: right; + margin-right: 5px !important; +} + +.snarkCommentInfo textarea { + font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "DejaVu Sans", Verdana, sans-serif; + width: 100%; + min-height: 64px; + height: 64px; + resize: vertical; +} + +.commentRating, .commentAuthor { + width: 1%; +} + +#nameRequired { + float: right; + margin-right: 5px; +} + +.commentRating { + padding-right: 10px !important; +} + +.commentRating img { + margin: 0; + padding: 0; + height: 16px; + width: 16px; +} + +.commentDate { + width: 100px; + background: url(images/clock.png) left center no-repeat; + padding-left: 20px !important; +} + +.snarkCommentInfo td:first-child, .snarkComments td:first-child { + min-width: 160px !important; + width: 160px !important; + padding-right: 2px; +} + +.snarkCommentInfo td:last-child, .snarkComments td:last-child { + width: 1% !important; +} + +.snarkComments td { + white-space: nowrap; +} + +.commentAuthorName { + background: url(images/author.png) left center no-repeat; + padding-left: 20px; +} + +.commentText { + white-space: normal; + text-align: justify; + width: 90%; +} + +.commentWrapper { + border: 1px solid #101; + margin: 2px 0; + padding: 8px 10px 8px 26px; + border-radius: 3px; + background: #303; + box-shadow: inset 0 0 0 1px #515, 0 0 1px 0 rgba(0,0,0,0.3); + background: url(images/comment.png) 6px center no-repeat #303; + background-blend-mode: luminosity; +} + +.snarkComments select { + margin-right: 0 !important; +} + +#commentDeleteAction { + background: linear-gradient(to bottom, #202, #101); + box-shadow: inset 0 0 0 1px #303; +} + +#commentDeleteAction td { + padding-right: 6px; +} + +.commentAction, .commentDelete { + width: 1%; + white-space: nowrap; + padding-left: 0; +} + +.addCommentText, .commentText { + padding-right: 0; +} + +.commentAction input[type="submit"] { + margin-top: 8px; + margin-bottom: 8px; +} + +.commentDelete { + text-align: center; + padding: 5px 8px 5px 22px !important; + background: url(images/nuke.png) 2px center no-repeat; +} + +.commentDelete .optbox { + margin: 0; +} + +#newRating td { + padding-top: 10px !important; + padding-bottom: 10px !important; +} + +#newRating td:first-child { + text-align: center; +} + +#newRating select { + width: 90%; +} + +#myRating td:empty { + padding: 0 !important; + border-top: none !important; + border-bottom: none !important; +} + +#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ + min-height: 1px !important; +} + +.commentRating img { + margin: 0 0 2px; + padding: 0; + font-size: 14pt; + color: #FF7200; + text-shadow: 0 0 1px #900; + filter: drop-shadow(0 0 1px rgba(153, 51, 0, 0.6)); +} + +.commentsSection { + background: linear-gradient(to bottom, #545 0%, #434 100%); + margin: 0 0 10px 0; + padding: 0 10px 10px; + border: 1px solid #101; + color: #ddd; + border-radius: 4px; + box-shadow: inset 0 0 3px 0 #101; + word-wrap: break-word; + filter: drop-shadow(0 0 1px #515); +} + +/* end Comments section */ + /* MS Edge fix */ _:-ms-lang(x), * { @@ -2283,7 +2493,7 @@ _:-ms-lang(x), input[type="radio"], input[type="checkbox"] { } input[type="checkbox"]:hover, input[type="checkbox"]:focus { - filter: sepia(100%) invert(100%) hue-rotate(58deg) brightness(80%) drop-shadow(0 0 3px f60) !important; + filter: sepia(100%) invert(100%) hue-rotate(58deg) brightness(80%) drop-shadow(0 0 3px #f60) !important; } /* end Edge fix */ @@ -2329,7 +2539,7 @@ input[type="checkbox"]:hover, input[type="checkbox"]:focus { margin: 5px; } -table.snarkDirInfo { +.snarkDirInfo { margin-top: 6px !important; } @@ -2337,15 +2547,25 @@ table.snarkDirInfo { max-height: 20px; } -.snarkTorrents td:nth-child(2) { +.snarkTorrentStatus { white-space: nowrap; + font-weight: bold !important; } .snarkTorrents a, .snarkTorrentETA, .snarkTorrents tfoot th, .peerinfo td, .snarkTorrents td, .snarkTorrentInfo td, .snarkDirInfo td { font-size: 8pt; } -.snarkTorrents td:first-child img { +.snarkTorrents thead img { + max-height: 20px; +} + +.snarkGraphicStatus { + padding-left: 0; + padding-right: 0; +} + +td.snarkGraphicStatus img { max-height: 16px; } @@ -2411,6 +2631,10 @@ b.alwaysShow { white-space: nowrap; } +.knownTracker td:nth-child(3) a { + max-width: 200px; +} + #trackerselect td a { max-width: 350px; } @@ -2542,7 +2766,7 @@ th, td, .choked, .unchoked { letter-spacing: 0 !important; } -body, .snarkTorrents td, .snarkAddInfo, th, td, .snarkFileName, .snarkFileStatus { +body, .snarkTorrents td, .snarkAddInfo, th, td, .snarkFileName, .snarkFileStatus, .snarkCommentInfo textarea { font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "DejaVu Sans", Verdana, "Lucida Grande", Helvetica, sans-serif; font-size: 10pt !important; } @@ -2593,6 +2817,10 @@ input[type="submit"], input[type="reset"], select, select option, button, a.cont max-width: none; } +.snarkTorrentAction { + padding-right: 3px !important; +} + .snarkTorrents tt { font-size: 10pt; color: #cc0; @@ -2605,6 +2833,15 @@ input[type="submit"], input[type="reset"], select, select option, button, a.cont margin: 1px 3px !important; } +.priority { + font-size: 8pt; + vertical-align: middle; + text-align: right !important; + padding-right: 15px; + white-space: nowrap; + width: 1%; +} + tt, .snarkMessages, input, textarea { font-size: 9pt !important; } @@ -2672,187 +2909,3 @@ select { /* end responsive layout */ -/* Comments Section */ -/* TODO: merge with other rules where applicable */ - -.snarkCommentInfo, .snarkComments { - margin: 10px 0 0 !important; - background: #270027 none repeat scroll 0 0; - border: 1px solid #101; - filter: drop-shadow(0px 0 1px rgba(16, 8, 16, 0.7)); -} - -.snarkCommentInfo th { - background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #202, #101); - padding: 8px 5px 8px 30px !important; -} - -.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(even) { - background: #351933; - border-bottom: 1px solid #101; -} - -.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(odd) { - background: #270027; - border-bottom: 1px solid #101; -} - -.snarkCommentInfo th { - padding: 8px 5px; -} - -.snarkCommentInfo td, .snarkComments td { - padding: 8px 5px; -} - -.snarkCommentInfo td:first-child { - white-space: nowrap; -} - -.snarkCommentInfo td:first-child { - font-weight: bold; -} - -.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after { - content: ""; - display: inline-block; - min-height: 32px; - vertical-align: middle; -} - -.snarkCommentInfo input.accept { - float: right; - margin-right: 5px !important; -} - -.snarkCommentInfo textarea { /* remember to set 10pt @ > 1400px */ - width: 100%; - min-height: 64px; - height: 64px; - resize: vertical; -} - -.snarkComments th { - text-align: left; -} - -.commentRating, .commentAuthor { - width: 1%; -} - -#nameRequired { - float: right; - margin-right: 5px; -} - -.commentRating { - padding-right: 10px !important; -} - -.commentRating img { - margin: 0; - padding: 0; - height: 16px; - width: 16px; -} - -.commentDate { - width: 100px; - background: url(images/clock.png) left center no-repeat; - padding-left: 20px !important; -} - -.snarkCommentInfo td:first-child, .snarkComments td:first-child { - width: 160px !important; - padding-right: 2px; -} - -.snarkCommentInfo td:last-child, .snarkComments td:last-child { - width: 1% !important; -} - -.snarkComments td { - white-space: nowrap; -} - -.commentAuthorName { - background: url(images/author.png) left center no-repeat; - padding-left: 20px; -} - -td.commentText { - white-space: normal; - text-align: justify; - width: 90%; -} - -.commentWrapper { - border: 1px solid #101; - margin: 2px 0; - padding: 8px 10px 8px 26px; - border-radius: 3px; - background: #303; - box-shadow: inset 0 0 0 1px #515, 0 0 1px 0 rgba(0,0,0,0.3); - background: url(images/comment.png) 6px center no-repeat #303; - background-blend-mode: luminosity; -} - -.snarkComments select { - margin-right: 0 !important; -} - -#commentDeleteAction { - background: linear-gradient(to bottom, #202, #101); - box-shadow: inset 0 0 0 1px #303; -} - -#commentDeleteAction td { - padding-right: 6px; -} - -.commentAction, .commentDelete { - width: 1%; - white-space: nowrap; - min-width: 180px !important; - padding-left: 0; -} - -.addCommentText, .commentText { - padding-right: 0; -} - -.commentAction input[type="submit"] { - margin-top: 10px; - margin-bottom: 10px; -} - -.commentDelete { - text-align: left; -} - -#newRating td { - padding-top: 10px !important; - padding-bottom: 10px !important; -} - -#myRating td:empty { - padding: 0 !important; - border-top: none !important; - border-bottom: none !important; -} - -#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ - min-height: 1px !important; -} - -.commentRating img { - margin: 0 0 4px; - padding: 0; - font-size: 14pt; - color: #FF7200; - text-shadow: 0 0 1px #900; - filter: none; -} - -/* end Comments section */ - diff --git a/installer/resources/themes/snark/vanilla/snark.css b/installer/resources/themes/snark/vanilla/snark.css index bf7a790349..906e31bb11 100644 --- a/installer/resources/themes/snark/vanilla/snark.css +++ b/installer/resources/themes/snark/vanilla/snark.css @@ -88,7 +88,7 @@ a:link, a:visited { text-decoration: none; } -th a:link, td a:link { +.snarkCommentInfo th a:link, td a:link { color: #cf0f00; text-decoration: none; font-weight: bold; @@ -403,8 +403,18 @@ table { font-size: 8.5pt !important; } -tr { - opacity: 1; +th { + padding: 4px 2px; + font-size: 8pt; + border-top: 1px solid #6f533e; + border-bottom: 1px solid #6f533e; + color: #2f1500; +} + +td { + padding: 2px 4px; + color: #2f1500 !important; + vertical-align: middle; } thead, tfoot { @@ -426,14 +436,6 @@ thead a:hover img, thead a:focus img { filter: drop-shadow(0 0 1px #f60); } -th { - padding: 4px 2px; - font-size: 8pt; - border-top: 1px solid #6f533e; - border-bottom: 1px solid #6f533e; - color: #2f1500; -} - th br { display: none; } @@ -451,6 +453,7 @@ tfoot td:first-child { tfoot tr:first-child th { vertical-align: middle; font-weight: bold; + color: #2f1500 !important; } tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) img, tfoot:nth-child(4) img { @@ -478,6 +481,8 @@ tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) im padding: 4px 0 4px 4px; } +/* main torrents listing */ + .snarkTorrents { margin: 0; border: 1px solid #6f533e; @@ -507,10 +512,21 @@ tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) im font-weight: normal; } -.snarkTorrents tfoot th::first-line, .snarkTorrents tfoot th:nth-child(n+7) { +.snarkTorrents tfoot tr:first-child { + background: linear-gradient(to bottom, #efefef, #cfc7c2); +} + +.snarkTorrents tfoot tr:first-child th { font-weight: bold !important; } +.snarkTorrents tfoot tr:first-child th::after { + content: ""; + display: inline-block; + min-height: 24px; + vertical-align: middle; +} + .snarkTorrents tfoot th:nth-child(n+2) { white-space: nowrap; } @@ -519,74 +535,50 @@ tfoot img, tfoot:nth-child(2) img, tfoot:nth-child(1) img, tfoot:nth-child(3) im display: block !important; } -.snarkTorrents thead th:first-child { - text-align: center !important; -} - -.snarkTorrents thead th:nth-child(3) { - padding: 4px 4px 4px 0; - text-align: right; -} - -.snarkTorrents th:nth-child(n+5) { - text-align: right; -} - -.snarkTorrents th:nth-child(6), .snarkTorrents th:last-child { - text-align: center; -} - -.snarkTorrents th:first-child, .snarkTorrents td:first-child { - width: 1%; - white-space: nowrap; -} - -.snarkTorrents th:last-child, .snarkTorrents td:last-child { - width: 1%; - white-space: nowrap; -} - -.snarkTorrents tfoot { - vertical-align: top; -} - -.snarkTorrents td:first-child, .snarkTorrents td:nth-child(2) { - padding: 2px 0 !important; -} - -.snarkTorrents td:nth-child(3), .snarkTorrents td:nth-child(4) { - padding: 2px 0 !important; - width: 16px !important; -} - -.snarkTorrents td:nth-child(3) { - padding: 0 3px !important; -} - -.snarkTorrents td:nth-child(4) { - font-weight: bold; -} - -.snarkTorrents td:nth-child(7), .peerinfo .snarkTorrentStatus { - font-weight: bold !important; - white-space: nowrap !important; -} - -td { - padding: 2px 4px; - color: #2f1500 !important; - opacity: 1; - font-size: 8pt; +.snarkTorrents tfoot tr:first-child th { vertical-align: middle; } -td:first-child { +.snarkTorrents thead th:nth-child(3) { text-align: right; - font-size: 8pt; + padding-right: 0; } -.center { +.snarkTorrents td[colspan="4"], .snarkTorrents td[colspan="10"] { + text-align: left; +} + +.snarkTorrents td[colspan="10"] { + white-space: normal; +} + +.snarkGraphicStatus, .snarkTorrentStatus { + padding: 2px; + white-space: nowrap; + width: 1%; +} + +.snarkGraphicStatus { text-align: center !important; + width: 1%; + white-space: nowrap; +} + +.snarkGraphicStatus::after { + content: ""; + display: inline-block; + min-height: 20px !important; + vertical-align: middle; +} + +th.snarkTorrentStatus { + text-align: center !important; +} + +.snarkTorrentStatus { + padding-right: 5px !important; + text-align: left; + padding-left: 0; } .snarkTorrentName { @@ -594,31 +586,59 @@ td:first-child { line-height: 110%; } -.snarkTorrentName img { - padding-bottom: 2px; - text-align: left; +.snarkTrackerDetails, .snarkTorrentDetails { + padding: 2px 0 !important; + width: 16px !important; +} + +.snarkTrackerDetails { + padding: 0 3px !important; +} + +.snarkTorrentDetails { + font-weight: bold; +} + +.snarkTorrentETA, .snarkTorrentUploaded, .snarkTorrentRateDown, .snarkTorrentRateUp { + width: 5%; + min-width: 40px; + white-space: nowrap; +} + +.snarkTorrentETA { + font-weight: bold; + font-style: italic; + color: #505 !important; + line-height: 120%; +} + +.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded { + font-weight: bold; + padding: 0 5px; +} + +.snarkTorrentDownloaded, .peerinfo td:nth-child(4) { + text-align: right !important; + padding: 2px; vertical-align: middle; } +.snarkTorrentRateDown, .snarkTorrentDownloaded { + color: #439 !important; +} + +.snarkTorrentUploaded, .snarkTorrentRateUp { + color: #626 !important; +} + .snarkTorrentAction { - padding: 1px 1px 1px 1px !important; + padding: 1px 2px 1px 1px !important; margin: 0 !important; text-align: center; width: 1%; white-space: nowrap; } -@media screen and (-webkit-min-device-pixel-ratio:0) { -.snarkTorrentAction { - width: 48px !important; -} -} - -/* MS Edge fix */ -_:-ms-lang(x), .snarkTorrentAction { - width: 72px !important; -} - .snarkTorrentAction input[type="image"], .snarkTorrents th:last-child input[type="image"] { filter: drop-shadow(0 0 1px rgba(127, 108, 95, 0.6)); border: 1px solid #4d453e; @@ -632,7 +652,8 @@ _:-ms-lang(x), .snarkTorrentAction { max-height: 10px; } -.snarkTorrentAction input[type="image"]:hover, .snarkTorrents th:last-child input[type="image"]:hover, .snarkTorrentAction input[type="image"]:focus, .snarkTorrents th:last-child input[type="image"]:focus { +.snarkTorrentAction input[type="image"]:hover, .snarkTorrents th:last-child input[type="image"]:hover, +.snarkTorrentAction input[type="image"]:focus, .snarkTorrents th:last-child input[type="image"]:focus { background: linear-gradient(to bottom, #ffeadf 0%, #ffeadf 51%, #cfb6a8 52%, #cfb6a8 100%); border: 1px solid #930 !important; box-shadow: inset 0 0 0 1px #fff; @@ -645,66 +666,39 @@ _:-ms-lang(x), .snarkTorrentAction { filter: sepia(100%) hue-rotate(340deg); } -.snarkTorrentEven { - font-size: 8pt; - background: #dfd6d1; +.snarkTorrents th:empty + th:empty, .snarkTorrents td:empty + td:empty, .snarkTorrentAction:empty { + width: 0 !important; +} + +.snarkTorrents tt { + background: #313; + background: #7F654F; + color: #fff; + padding: 2px 3px; + border-radius: 2px; + opacity: 0.8; + letter-spacing: 0.1em; +} + +.peerinfo tt { + margin: 0 1px; } .snarkTorrentNoneLoaded { background: #5f4e41; - font-size: 8.5pt; font-weight: bold; text-align: center !important; color: #bbb !important; } -.snarkTorrentStatus { - padding: 2px 0; -} +/* end main torrents listing */ -.snarkTorrentStatus:first-child { - text-align: left !important; - padding-left: 0; - min-width: 48px; - font-weight: bold; - color: #402 !important; - font-size: 8pt; -} - -.snarkTorrentStatus:first-child img { - margin-right: 12px !important; - margin-left: 6px !important; -} - -.snarkTorrentRateUp, .snarkTorrentRateDown, .snarkTorrentDownloaded, .snarkTorrentUploaded, .peerinfo .snarkTorrentStatus { - font-size: 8pt; - font-weight: bold; - padding: 0 3px; -/* line-height: 120% !important;*/ -} - -.snarkTorrentDownloaded { - color: #439 !important; - text-align: center !important; - padding: 2px; - vertical-align: middle; -} - -.snarkTorrentUploaded { - color: #626 !important; -} - -.snarkTorrentRateUp { - color: #626 !important; -} - -.snarkTorrentRateDown { - color: #439 !important; +.snarkTorrentEven { + background: #dfd6d1; } .snarkTorrentOdd { background: #efe6e0; - font-size: 8pt; } .snarkTorrentOdd td, .snarkTorrentEven td, .snarkTorrentInfo td, .ParentDir { @@ -721,7 +715,7 @@ _:-ms-lang(x), .snarkTorrentOdd td, .snarkTorrentEven td, .snarkTorrentInfo td, border-bottom: none !important; } -table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:hover { +.snarkTorrents tbody tr:hover, .snarkDirInfo tbody tr:hover { background: #f9efcf !important; background: linear-gradient(to right, rgba(119, 0, 0, 0.7) 3px, #f9efcf 3px) !important; } @@ -731,12 +725,12 @@ tr:hover .percentBarText { } @media screen and (-webkit-min-device-pixel-ratio:0) { -table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:hover { +.snarkTorrents tbody tr:hover, .snarkDirInfo tbody tr:hover { background: #f9efcf !important; } } -_:-ms-lang(x), table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:hover { +_:-ms-lang(x), .snarkTorrents tbody tr:hover, .snarkDirInfo tbody tr:hover { background: #f9efcf !important; } @@ -762,31 +756,8 @@ _:-ms-lang(x), table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:h } } -.snarkTorrentEven + .snarkTorrentEven:nth-child(even) td, .snarkTorrentOdd + .snarkTorrentOdd:nth-child(even) td, .snarkTorrentEven + .snarkTorrentEven:nth-child(odd) td, .snarkTorrentOdd + .snarkTorrentOdd:nth-child(odd) td { - padding: 3px 3px 3px 0 !important; -} - -.snarkTorrents td[colspan="4"], .snarkTorrents td[colspan="10"] { - text-align: left; -} - -.snarkTorrents td[colspan="10"] { - font-size: 8pt; - white-space: normal; -} - -.snarkTorrents tt { - background: #313; - background: #7F654F; - color: #fff; - padding: 2px 3px; - border-radius: 2px; - opacity: 0.8; - letter-spacing: 0.1em; -} - -.peerinfo tt { - margin: 0 1px; +.peerinfo td[colspan="4"], .debuginfo td[colspan="10"] { + padding-left: 0; } .snarkFileIcon { @@ -802,7 +773,7 @@ _:-ms-lang(x), table.snarkTorrents tbody tr:hover, table.snarkDirInfo tbody tr:h opacity: 1; } -td.snarkFileIcon:first-child { +.snarkFileIcon:first-child { text-align: center; } @@ -831,13 +802,6 @@ td.snarkFileIcon:first-child { width: 140px; } -.snarkTorrentETA { - font-weight: bold; - font-style: italic; - color: #505 !important; - line-height: 120%; -} - .snarkTorrentInfo img { max-height: 16px !important; margin: 1px 2px 2px 2px !important; @@ -881,6 +845,13 @@ td.snarkFileIcon:first-child { border-top: none; } +#infohash { + color: #050; + -moz-user-select: all; + -webkit-user-select: all; + user-select: all; +} + #torrentInfoControl { border-top: 1px solid #6f533e; background: linear-gradient(to bottom, #efefef, #cfc7c2); @@ -924,6 +895,13 @@ thead img.disable, img.disable:hover { min-width: 0 !important; } +.snarkDirInfo td:first-child::before { + content: ""; + display: inline-block; + min-height: 22px; + vertical-align: middle !important; +} + .snarkDirInfo .ParentDir a, .snarkDirInfo .snarkFileName a, .snarkTorrents .snarkTorrentName a { display: inline-block; width: 100%; @@ -962,10 +940,6 @@ thead img.disable, img.disable:hover { /* download bars */ -.snarkTorrents th:nth-child(6) { - text-align: right; -} - .snarkTorrentDownloaded { width: 110px !important; text-align: right !important; @@ -976,6 +950,10 @@ thead img.disable, img.disable:hover { margin: 1px 10px 0 7px; } +.snarkDirInfo .snarkFileStatus img[src$="tick.png"] { + margin-top: 0; +} + .percentBarOuter, .percentBarText { width: 110px; } @@ -993,6 +971,7 @@ thead img.disable, img.disable:hover { box-shadow: none; opacity: 1; margin: 0; + display: inline-block; } .snarkTorrentDownloaded .percentBarOuter { @@ -1030,6 +1009,10 @@ thead img.disable, img.disable:hover { 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)); } +.peerinfo .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%) !important; +} + .percentBarText, .percentBarOuter { text-align: center; vertical-align: middle; @@ -1069,6 +1052,10 @@ thead img.disable, img.disable:hover { color: #008000 !important; } +.choked, .unchoked { + font-style: italic; +} + .thumb { transition: ease all 0.3s; max-width: 16px; @@ -1319,15 +1306,22 @@ input { background: #efe6e0; color: #2f1500; margin: 2px 4px; - font-family: "Bitstream Vera Sans", Verdana, Helvetica, sans-serif; + font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif; } input.r { text-align: right; - min-width: 100px; background: #efe6e0; } +input.r, input[type="text"], select { + min-width: 120px; +} + +input[name="nofilter_commentsName"] { + width: 250px; +} + input[type=submit] { color: #2f1500; border: 1px solid #4F3927; @@ -1500,13 +1494,12 @@ input[name^="action_"]:hover, input[name^="action_"]:focus { select { background: #efe6e0 url(images/dropdown.png) right center no-repeat !important; color: #2f1500; - font: 8pt "Bitstream Vera Sans", Verdana, Helvetica, sans-serif; + font: 8pt "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif; font-weight: bold; padding: 5px 14px 5px 5px; border-radius: 2px; border: 1px solid #2f1500; margin: 2px 0 2px 4px; - min-width: 100px; -moz-appearance: none; -webkit-appearance: none; box-shadow: inset 0 0 0 1px #f9f5f2, 0 0 0 1px rgba(186, 160, 143, 0.6); @@ -1552,7 +1545,7 @@ textarea, input[name="nofilter_dataDir"] { border: 1px solid #2f1500; font-size: 8pt; margin-left: 4px; - font-family: "Bitstream Vera Sans", Verdana, Helvetica, sans-serif; + font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "Bitstream Vera Sans", Verdana, sans-serif; width: 70%; } @@ -1676,6 +1669,7 @@ img[src$="details.png"] { .addtorrentsection td:first-child, .newtorrentsection td:first-child { width: 120px; font-weight: bold; + text-align: right; } .addtorrentsection tr:first-child td:last-child { @@ -2029,10 +2023,14 @@ input#toggle_debug:checked + label + #dhtDebugInner { #totals { display: inline-block; - margin: 2px 0 2px 6px; + margin: 3px 0 3px 6px; font-weight: bold; } +#totals span, #ourDest { + white-space: nowrap; +} + #totals tt { line-height: 170%; } @@ -2125,6 +2123,7 @@ input#toggle_debug:checked + label + #dhtDebugInner { #configs td:first-child { min-width: 240px !important; font-weight: bold; + text-align: right; } #configs tr:nth-last-child(2) td, .trackerconfig tr:nth-last-child(2) td { @@ -2192,6 +2191,234 @@ td#bwHelp a { margin-right: 3px; } +/* Comments Section */ + +#snarkCommentSection { + filter: drop-shadow(0 0 2px rgba(77, 69, 62, 0.5)) !important; +} + +.snarkCommentInfo, .snarkComments { + margin: 10px 0 0 !important; + border: 1px solid #6f533e; + border-top: none; + border-bottom: none; +/* box-shadow: 0 0 2px 1px rgba(77, 69, 62, 0.3);*/ + border-collapse: separate; +} + +.snarkComments { + margin-top: 0 !important; +} + +.snarkCommentInfo td:first-child, .snarkComments td:first-child { + text-align: right; +} + +.snarkCommentInfo tr:last-child td, .snarkComments tr:last-child td { + border-bottom: 1px solid #6f533e; +} + +.snarkCommentInfo tr:first-child th { + border-top: 1px solid #6f533e; +} + +.snarkComments tr:first-child td { + border-top: 1px solid #6f533e; + border-top: 1px outset #fff5ef; +} + +.snarkCommentInfo th, .snarkComments th { + background: linear-gradient(to bottom, #efefef, #cfc7c2); + padding: 8px 5px; +} + +.snarkCommentInfo th { + background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #efefef, #cfc7c2); + padding-left: 28px !important; +} + +.snarkCommentInfo th:last-child { + text-align: right; +} + +.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(odd) { + background: #dfd6d1; +} + +.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(even) { + background: #efe6e0; +} + +.snarkCommentInfo th { + padding: 8px 5px; +} + +.snarkCommentInfo td, .snarkComments td { + padding: 8px 5px; + border-bottom: 1px outset #efe8e0; + border-top: 1px outset #fff5ef; +} + +.snarkCommentInfo td:first-child { + white-space: nowrap; +} + +.snarkCommentInfo td:first-child { + font-weight: bold; +} + +.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after { + content: ""; + display: inline-block; + min-height: 32px; + vertical-align: middle; +} + +.snarkCommentInfo input.accept { + float: right; + margin-right: 5px !important; +} + +.snarkCommentInfo textarea { + width: 100%; + min-height: 64px; + height: 64px; + resize: vertical; + font-weight: normal; +} + +.snarkComments th { + text-align: left; +} + +.commentRating, .commentAuthor { + width: 1%; +} + +#nameRequired { + float: right; + margin-right: 5px; +} + +.commentRating { + padding-right: 10px !important; +} + +.commentRating img { + margin: 0 0 3px; + padding: 0; + font-size: 14pt; + color: #ff7200; + text-shadow: 0 0 1px #900; + filter: drop-shadow(0 0 1px rgba(153, 0, 0, 0.4)); + width: 16px; + height: 16px; +} + +.commentDate { + width: 100px; + background: url(images/clock.png) left center no-repeat; + padding-left: 20px !important; +} + +.snarkCommentInfo td:first-child, .snarkComments td:first-child { + width: 160px !important; + padding-right: 2px; +} + +.snarkCommentInfo td:last-child, .snarkComments td:last-child:not(.commentText:empty) { + width: 1% !important; +} + +.snarkComments td { + white-space: nowrap; +} + +.commentAuthorName { + background: url(images/author.png) left center no-repeat; + padding-left: 20px; +} + +.commentText { + white-space: normal; + text-align: justify; + padding-right: 0; +} + +.commentWrapper { + border: 1px solid #6f533e; + margin: 4px 2px; + padding: 8px 10px 8px 26px; + border-radius: 2px; + box-shadow: 0 0 0 1px #fff inset, 0 0 1px 0 rgba(77, 69, 62, 0.7); + background: url(images/comment.png) 6px center no-repeat #fff6df; + background-blend-mode: luminosity; +} + +#commentsConfig .optbox { + vertical-align: middle; + margin-left: 0; +} + +.snarkComments select { + margin-right: 0 !important; +} + +#commentDeleteAction { + background: linear-gradient(to bottom, #efefef, #cfc7c2); + box-shadow: inset 0 0 0 1px #efe8e0; + border: 1px solid #6f533e; +} + +#commentDeleteAction td { + box-shadow: 0 0 0 1px #efe8e0 inset; + padding-right: 6px; +} + +.commentdelete, .commentAction { + width: 1%; + white-space: nowrap; +} + +.commentAction input[type="submit"] { + margin-top: 5px; + margin-bottom: 5px; +} + +.commentDelete { + background: url(../ubergine/images/nuke.png) 6px center no-repeat; + text-align: left; + padding: 5px 6px 5px 24px !important; +} + +#newRating td { + padding-top: 10px !important; + padding-bottom: 10px !important; + text-align: center; +} + +#newRating select { + width: 90%; + width: calc(100% - 10px); +} + +#addCommentText { + padding-left: 0; +} + +#myRating td:empty { + padding: 0 !important; + border-top: none !important; + border-bottom: none !important; +} + +#myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ + min-height: 0 !important; + padding: 0 !important; +} + +/* end Comments section */ + /* MS Edge fix */ _:-ms-lang(x), * { filter: none !important; @@ -2206,15 +2433,19 @@ _:-ms-lang(x), input[type="radio"], input[type="checkbox"] { /* responsive layout */ @media screen and (max-width: 1000px) { -.snarkTorrents td:nth-child(2) { - white-space: nowrap; - font-weight: bold; -} - .snarkTorrents td[colspan="10"] { white-space: normal; } +th.snarkTorrentStatus { + text-align: right !important; +} + +td.snarkTorrentStatus { + white-space: nowrap; + font-weight: bold; +} + .snarkTorrentStatus b { display: none; } @@ -2232,7 +2463,7 @@ b.alwaysShow { font-size: 10.5pt !important; } -.snarkTorrents td:first-child img { +td.snarkGraphicStatus img { max-height: 16px; } @@ -2274,6 +2505,10 @@ b.alwaysShow { max-height: 18px; } +.snarkDirInfo td:first-child::before { + min-height: 18px; +} + .knownTracker a, #trackerselect td a { display: inline-block; overflow: hidden; @@ -2324,8 +2559,8 @@ _:-ms-lang(x), .snarkRefresh:link, .snarkRefresh:visited { } .peerinfo td, .debuginfo td { - padding-top: 0 !important; - padding-bottom: 0 !important; + padding-top: 2px !important; + padding-bottom: 2px !important; } .snarkTorrentETA { @@ -2349,6 +2584,10 @@ _:-ms-lang(x), .snarkRefresh:link, .snarkRefresh:visited { padding-bottom: 2px; line-height: 120%; } + +.snarkDirInfo td:first-child::before { + min-height: 20px; +} } @media screen and (max-width: 1400px) { @@ -2402,6 +2641,10 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, .snarkFileName, a.control, input .snarkTorrentStatus b { margin-right: 3px; } + +.snarkTorrentDownloaded .percentBarText { + line-height: 17px; +} } @media screen and (min-width: 1200px) { @@ -2414,7 +2657,16 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, .snarkFileName, a.control, input pointer-events: none; /* hide tooltip */ } -.snarkTorrentRateUp, .snarkTorrents th:nth-child(9), .snarkTorrents tfoot th:nth-last-child(2), .snarkTorrents .peerinfo td:nth-last-child(2) { +.snarkGraphicStatus::after { + min-height: 20px; + vertical-align: middle; +} + +.snarkTorrentStatus { + padding-right: 10px !important; +} + +.snarkTorrentRateUp { padding-right: 15px !important; } @@ -2440,7 +2692,7 @@ tt, .snarkTorrents tt, .snarkMessages, textarea { font-size: 9pt !important; } -.snarkAddInfo, .configsectionpanel td, .snarkNewTorrent td, .configsectionpanel th, +.snarkAddInfo, .configsectionpanel td, .snarkNewTorrent td, .configsectionpanel th, .configsectionpanel td, .snarkNewTorrent td, select, select option, input, textarea, input[name="nofilter_dataDir"] { font-size: 10pt !important; } @@ -2458,6 +2710,11 @@ select { padding-bottom: 4px; } +.snarkGraphicStatus::after { + min-height: 22px; +} + + .snarkTorrentDownloaded { white-space: nowrap; } @@ -2500,13 +2757,6 @@ tr#torrentInfoStats td { padding-bottom: 5px !important; } -.debuginfo td::after { - content: ""; - display: inline-block; - min-height: 18px; - vertical-align: middle; -} - .debugConnection { margin: 0 4px; padding: 2px 3px; @@ -2530,205 +2780,3 @@ tr#torrentInfoStats td { /* end responsive layout */ -/* Comments Section */ -/* TODO: merge with other rules where applicable */ - -.snarkCommentInfo, .snarkComments { - margin: 10px 0 0 !important; - border: 1px solid #6f533e; - box-shadow: 0 0 2px 1px rgba(77, 69, 62, 0.3); - border-collapse: separate; -} - -.snarkCommentInfo, .snarkComments { - border-top: none; - border-bottom: none; -} - -.snarkCommentInfo tr:last-child td, .snarkComments tr:last-child td { - border-bottom: 1px solid #6f533e; -} - -.snarkCommentInfo tr:first-child th, .snarkComments tr:first-child td { - border-top: 1px solid #6f533e; -} - -.snarkCommentInfo th, .snarkComments th { - background: linear-gradient(to bottom, #efefef, #cfc7c2); - padding: 8px 5px; -} - -.snarkCommentInfo th { - background: url(images/comment.png) 8px center no-repeat, linear-gradient(to bottom, #efefef, #cfc7c2); - padding-left: 28px !important; -} - -.snarkCommentInfo th:last-child { - text-align: right; -} - -.snarkCommentInfo tr:nth-child(even), .snarkComments tr:nth-child(even) { - background: #dfd6d1; -} - -.snarkCommentInfo tr:nth-child(odd), .snarkComments tr:nth-child(odd) { - background: #efe6e0; -} - -.snarkCommentInfo th { - padding: 8px 5px; -} - -.snarkCommentInfo td, .snarkComments td { - padding: 8px 5px; - border-bottom: 1px outset #efe8e0; - border-top: 1px outset #fff5ef; -} - -.snarkCommentInfo td:first-child { - white-space: nowrap; -} - -.snarkCommentInfo td:first-child { - font-weight: bold; -} - -.snarkCommentInfo td:first-child::after, .snarkComments td:first-child::after { - content: ""; - display: inline-block; - min-height: 32px; - vertical-align: middle; -} - -.snarkCommentInfo input.accept { - float: right; - margin-right: 5px !important; -} - -.snarkCommentInfo textarea { /* remember to set 10pt @ > 1400px */ - width: 100%; - min-height: 64px; - height: 64px; - resize: vertical; - font-weight: normal; -} - -.snarkComments th { - text-align: left; -} - -.commentRating, .commentAuthor { - width: 1%; -} - -#nameRequired { - float: right; - margin-right: 5px; -} - -.commentRating { - padding-right: 10px !important; -} - -.commentRating img { - margin: 0 0 3px; - padding: 0; - font-size: 14pt; - color: #FF7200; - text-shadow: 0 0 1px #900; - filter: none; - width: 16px; - height: 16px; -} - -.commentDate { - width: 100px; - background: url(images/clock.png) left center no-repeat; - padding-left: 20px !important; -} - -.snarkCommentInfo td:first-child, .snarkComments td:first-child { - width: 160px !important; - padding-right: 2px; -} - -.snarkCommentInfo td:last-child, .snarkComments td:last-child:not(.commentText:empty) { - width: 1% !important; -} - -.snarkComments td { - white-space: nowrap; -} - -.commentAuthorName { - background: url(images/author.png) left center no-repeat; - padding-left: 20px; -} - -td.commentText { - white-space: normal; - text-align: justify; - padding-right: 0; -} - -.commentWrapper { - border: 1px solid #6f533e; - margin: 4px 2px; - padding: 8px 10px 8px 26px; - border-radius: 2px; - box-shadow: 0 0 0 1px #fff inset, 0 0 1px 0 rgba(77, 69, 62, 0.7); - background: url(images/comment.png) 6px center no-repeat #fff6df; - background-blend-mode: luminosity; -} - -#commentsConfig .optbox { - vertical-align: middle; - margin-left: 0; -} - -.snarkComments select { - margin-right: 0 !important; -} - -#commentDeleteAction { - background: linear-gradient(to bottom, #efefef, #cfc7c2); - box-shadow: inset 0 0 0 1px #efe8e0; - border: 1px solid #6f533e; -} - -#commentDeleteAction td { - box-shadow: 0 0 0 1px #efe8e0 inset; - padding-right: 6px; -} - -.commentdelete, .commentAction { - width: 1%; - white-space: nowrap; - min-width: 180px; -} - -.commentAction input[type="submit"] { - margin-top: 10px; - margin-bottom: 10px; -} - -.commentDelete { - text-align: left; -} - -#newRating td { - padding-top: 10px !important; - padding-bottom: 10px !important; -} - -#myRating td:empty { - padding: 0 !important; - border-top: none !important; - border-bottom: none !important; -} - -.snarkComments #myRating td:empty::after { /* hides My Ratings row when Ratings disabled */ - min-height: 0 !important; -} - -/* end Comments section */
"); - // buf.append(_t("Author")); - // buf.append(""); - // buf.append(_t("Rating")); - // buf.append(""); - // buf.append(_t("Date")); - // buf.append(""); - // buf.append(_t("Comment")); - // buf.append("
"); @@ -3599,7 +3595,7 @@ public class I2PSnarkServlet extends BasicServlet { ccount++; } } else { - buf.append(""); // insert empty named columns to maintain table layout + buf.append(""); // insert empty named columns to maintain table layout .. fails to catch uncommented row when comments also shown } buf.append("