I2PSnark:

- Mitigate truncation of ratings dropdown in comments section (translations)
- light: Reduce contrast of display text
- light/classic: Increase contrast of download bars
- Create Torrent trackers table: Replace "Tracker URL" with "Tracker Type"
  (ticket #1996)
- Add a persistent warning to the messagelog when JavaScript is disabled to
  indicate potential loss of form data upon refresh (ticket #1996)
- Migrate "view or change bandwidth" to [Configure] tooltip to standardize
  configuration links, allow for more space for option labels and lessen
  chance of option labels wrapping in translations
This commit is contained in:
str4d
2017-07-26 22:03:08 +00:00
parent 0feb16d57b
commit a39fb3d7c2
8 changed files with 769 additions and 310 deletions

View File

@ -395,7 +395,7 @@ public class I2PSnarkServlet extends BasicServlet {
List<String> msgs = _manager.getMessages();
if (!msgs.isEmpty()) {
out.write("\n<div class=\"snarkMessages\" tabindex=\"0\">");
out.write("<a href=\"" + _contextPath + '/');
out.write("<a id=\"closeLog\" href=\"" + _contextPath + '/');
if (isConfigure)
out.write("configure");
if (peerString.length() > 0)
@ -407,6 +407,8 @@ public class I2PSnarkServlet extends BasicServlet {
out.write(toThemeImg("delete", tx, tx));
out.write("</a>" +
"\n<ul>\n");
out.write("<noscript><li class=\"noscriptWarning\">Warning! Javascript is disabled in your browser. If <a href=\"configure\">page refresh</a> is enabled, ");
out.write("you will lose any input in the add/create torrent sections when a refresh occurs.</li></noscript>");
for (int i = msgs.size()-1; i >= 0; i--) {
String msg = msgs.get(i);
out.write("<li>" + msg + "</li>\n");
@ -2202,34 +2204,43 @@ public class I2PSnarkServlet extends BasicServlet {
out.write("\" name=\"foo\" >");
out.write("<tr><td>\n");
out.write(_t("Trackers"));
out.write(":<td><table id=\"trackerselect\" style=\"width: 30%;\"><tr><td></td><td align=\"center\">");
out.write(":<td><table id=\"trackerselect\"><tr><td>Name</td><td align=\"center\">");
out.write(_t("Primary"));
out.write("</td><td align=\"center\">");
out.write(_t("Alternates"));
out.write("</td><td>");
out.write(_t("Tracker URL"));
out.write(_t("Tracker Type"));
out.write("</td></tr>\n");
for (Tracker t : sortedTrackers) {
List<String> openTrackers = _manager.util().getOpenTrackers();
List<String> privateTrackers = _manager.getPrivateTrackers();
boolean isPrivate = privateTrackers.contains(t.announceURL);
boolean isKnownOpen = _manager.util().isKnownOpenTracker(t.announceURL);
boolean isOpen = isKnownOpen || openTrackers.contains(t.announceURL);
String name = t.name;
String announceURL = t.announceURL.replace("&#61;", "=");
String homeURL = t.baseURL;
out.write("<tr><td>");
out.write("<tr><td><span class=\"trackerName\">");
out.write(name);
out.write("</td><td align=\"center\"><input type=\"radio\" name=\"announceURL\" value=\"");
out.write("</span></td><td align=\"center\"><input type=\"radio\" name=\"announceURL\" value=\"");
out.write(announceURL);
out.write("\"");
if (announceURL.equals(_lastAnnounceURL))
out.write(" checked");
out.write("></td><td align=\"center\"><input type=\"checkbox\" name=\"backup_");
out.write(announceURL);
out.write("\" value=\"foo\"></td><td><a href=\"");
out.write(homeURL);
out.write("\">");
out.write(homeURL);
out.write("</a></td></tr>\n");
out.write("\" value=\"foo\"></td><td>");
if (!(isOpen || isPrivate))
out.write(_t("Standard"));
if (isOpen)
out.write(_t("Open"));
if (isPrivate) {
out.write(_t("Private"));
}
out.write("<tr><td><i>");
}
out.write("</td></tr><tr><td><i>");
out.write(_t("none"));
out.write("</i></td><td align=\"center\"><input type=\"radio\" name=\"announceURL\" value=\"none\"");
if (_lastAnnounceURL == null)
@ -2419,8 +2430,10 @@ public class I2PSnarkServlet extends BasicServlet {
out.write("\"> KBps <td id=\"bwHelp\"><i>");
out.write(_t("Half available bandwidth recommended."));
if (_context.isRouterContext()) {
out.write("</i> <a href=\"/config.jsp\" target=\"blank\">[");
out.write("</i> <a href=\"/config.jsp\" target=\"blank\" title=\"");
out.write(_t("View or change router bandwidth"));
out.write("\">[");
out.write(_t("Configure"));
out.write("]</a>");
}
out.write("\n<tr><td><label for=\"useOpenTrackers\">");

View File

@ -1,3 +1,16 @@
2017-07-26 str4d
* I2PSnark:
- Mitigate truncation of ratings dropdown in comments section (translations)
- light: Reduce contrast of display text
- light/classic: Increase contrast of download bars
- Create Torrent trackers table: Replace "Tracker URL" with "Tracker Type"
(ticket #1996)
- Add a persistent warning to the messagelog when JavaScript is disabled to
indicate potential loss of form data upon refresh (ticket #1996)
- Migrate "view or change bandwidth" to [Configure] tooltip to standardize
configuration links, allow for more space for option labels and lessen
chance of option labels wrapping in translations
2017-07-25 str4d
* Console: Move JRobin default color and font changes into SummaryRenderer
@ -20,7 +33,7 @@
- Reduce size of screenlog font at 1400-1600px viewport width to lessen
chance of text-wrapping (ticket #1996)
- classic: Fix a linespacing issue in the config section (options:) that only
triggers in foreign languages that force the options td to wrap
triggers in foreign languages that force the options labels to wrap
* Fix HTML tags across non-default conditional branches
2017-07-08 zzz

View File

@ -175,7 +175,7 @@ body.iframed {
.snarkMessages {
overflow: hidden;
width: auto;
height: 53px;
height: 56px;
margin: 0;
padding: 3px 5px;
text-align: left;
@ -202,16 +202,20 @@ body.iframed {
.snarkMessages li {
margin-left: -15px;
font: normal 8pt "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", monospace;
font: bold 8pt "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", monospace;
color: #2c354f;
opacity: 0.95;
}
.snarkMessages li::before {
content: "";
display: inline-block;
background: url(images/bullet.png) left bottom no-repeat;
background: url(images/bullet.png) 1px bottom no-repeat;
width: 13px;
height: 11px;
margin: 1px 2px 0 1px;
background-size: 9px 9px;
opacity: 0.7;
}
.snarkMessages a:link,
@ -317,6 +321,11 @@ body.iframed {
display: none;
}
.snarkTorrents img {
margin: 0 !important;
padding: 0 !important;
}
#totals {
margin-left: 3px;
}
@ -352,6 +361,11 @@ body.iframed {
width: 24px !important;
}
.snarkGraphicStatus img {
margin-top: 2px !important;
margin-bottom: 2px !important;
}
.snarkTorrentETA, .snarkTorrentUploaded, .snarkTorrentRateDown, .snarkTorrentRateUp {
width: 5%;
min-width: 40px;
@ -524,11 +538,6 @@ td.snarkTrackerDetails {
padding: 4px 2px !important;
}
.snarkTorrents img {
margin: 0 !important;
padding: 0 !important;
}
tt {
font-family: "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", monospace;
}
@ -793,7 +802,7 @@ td:first-child {
}
.snarkTorrentName {
line-height: 90%;
line-height: 110%;
padding: 0;
}
@ -928,7 +937,7 @@ td:first-child {
}
tr:hover .percentBarText {
opacity: 0.75;
opacity: 0.85;
}
.snarkTorrentEven {
@ -1039,7 +1048,7 @@ tr:hover .percentBarText {
border: none;
height: 14px;
background: #bbf;
background: linear-gradient(to bottom, #fff 0%, #eef 50%, #ddf 50%, #bbf 100%);
background: linear-gradient(to bottom, #fff 0%, #eef 50%, #bbf 50%, #99f 100%);
box-shadow: inset 0 0 0 1px #ddf;
opacity: 0.8;
}
@ -1103,8 +1112,8 @@ tr:hover .percentBarText {
margin-left: -5px;
font-weight: normal;
background: url(images/infocircle.png) left 10px center no-repeat;
background-size: 14px auto;
padding-left: 30px;
background-size: 13px auto;
padding-left: 26px;
}
.snarkConfigTitle:hover, label.toggleview:hover, input.toggle_input:focus + .toggleview {
@ -1121,7 +1130,7 @@ input.toggle_input:focus + .toggleview img {
}
.snarkConfigTitle, label.toggleview, .configsectionpanel .snarkConfigTitle:hover {
font-size: 13pt;
font-size: 12pt;
font-weight: bold;
font-variant: small-caps !important;
display: inline-block;
@ -1141,6 +1150,7 @@ input.toggle_input:focus + .toggleview img {
.snarkConfigTitle a {
display: inline-block;
width: 100%;
margin-bottom: -1px;
}
@media screen and (-webkit-min-device-pixel-ratio: 0) {
@ -1158,7 +1168,7 @@ _:-ms-lang(x), .snarkConfigTitle, label.toggleview, .configsectionpanel .snarkCo
}
.snarkConfigTitle img, label.toggleview img {
margin-right: -2px;
margin-right: -1px;
margin-top: -2px;
}
@ -1645,21 +1655,18 @@ img:hover {
#trackerselect tr:first-child td {
padding: 5px 10px;
border-bottom: 1px solid #89f;
font-weight: bold !important;
}
#trackerselect td {
padding: 3px 10px;
}
#trackerselect td:first-child {
width: 20%;
#trackerselect td:first-child, #trackerselect td:last-child {
width: 40%;
font-weight: normal;
}
#trackerselect td:nth-child(4) {
width: 70%;
}
#trackerselect input {
margin: 3px !important;
}
@ -1897,7 +1904,7 @@ img:hover {
}
code {
font: bold 9pt "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", monospace;
font: bold 8pt "Droid Sans Mono", "Andale Mono", "DejaVu Sans Mono", "Lucida Console", monospace;
padding: 0 2px;
color: #050;
}
@ -2224,6 +2231,7 @@ hr.debug:last-child {
#configs td:first-child {
min-width: 180px !important;
width: 25%;
padding-left: 15px !important;
}
@ -2626,7 +2634,7 @@ body {
}
@media screen and (min-width: 1100px) {
body, th, td, table a, input, input[type="text"], input.r, input[name="nofilter_dataDir"], select, textarea, textarea[name="i2cpOpts"], .snarkAddInfo, code, .snarkMessages li {
body, th, td, table a, input, input[type="text"], input.r, input[name="nofilter_dataDir"], select, textarea, textarea[name="i2cpOpts"], .snarkAddInfo {
font-size: 9pt !important;
}
@ -2648,12 +2656,12 @@ 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, .snarkCommentInfo textarea {
body, th, td, table a, input, input[type="text"], input.r, input[name="nofilter_dataDir"], select, textarea, textarea[name="i2cpOpts"], .snarkAddInfo, .snarkCommentInfo textarea {
font-size: 10pt !important;
}
.snarkMessages li, .snarkTorrents tt {
font-size: 8pt !important;
code, .snarkTorrents tt, #ourDest tt {
font-size: 9pt;
}
.snarkTorrentAction input[type="image"], .snarkTorrents th:last-child input[type="image"] {

View File

@ -2,7 +2,7 @@
/* Author: dr|z3d */
html {
height: 100%;
min-height: 100%;
}
body {
@ -17,7 +17,7 @@ body {
body {
background: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0.7)),
url(/themes/console/dark/images/camotile2.png) top left,
url(/themes/console/dark/images/camotile2.png) top left fixed,
url(images/button_snark_hover.png) no-repeat,
url(images/button_snark_active.png) no-repeat,
url(images/button_tracker_hover.png) no-repeat,
@ -113,7 +113,7 @@ body.iframed {
text-decoration: none !important;
text-transform: uppercase !important;
letter-spacing: 0.1em;
margin: 0 -1px !important;
margin: 0 -2px !important;
padding: 5px 7px 5px 22px !important;
color: #3f3;
text-shadow: 0 0 1px #000;
@ -122,6 +122,7 @@ body.iframed {
box-shadow: inset 0 0 0 1px #000;
filter: drop-shadow(0 0 1px #000);
opacity: 0.7;
position: relative;
}
.snarkNav:link, .snarkNav:hover, .snarkNav:focus {
@ -130,6 +131,10 @@ body.iframed {
background-repeat: no-repeat, repeat !important;
}
.snarkNav:hover, .snarkNav:focus {
z-index: 10;
}
.snarkNav:link:last-child {
margin-left: 3px;
}
@ -224,7 +229,7 @@ body.iframed {
overflow: hidden;
resize: none;
color: #69f;
height: 54px;
height: 56px;
width: auto;
background: #000 url(images/hat.png) no-repeat scroll right bottom;
background: url(images/hat.png) no-repeat scroll right bottom, linear-gradient(to bottom, #010, #000);
@ -261,6 +266,11 @@ _:-ms-lang(x), .snarkMessages {
list-style: none;
}
.snarkMessages li, .snarkMessages li a, .snarkTorrents tt, #ourDest tt {
font-size: 8pt !important;
font-weight: bold;
}
.snarkMessages li {
margin-left: -15px;
}
@ -268,8 +278,8 @@ _:-ms-lang(x), .snarkMessages {
.snarkMessages li::before {
content: "";
display: inline-block;
background: url(images/bullet.png) left bottom no-repeat;
width: 14px;
background: url(images/bullet.png) 2px bottom no-repeat;
width: 16px;
height: 11px;
background-size: 9px 9px;
filter: drop-shadow(0 0 1px #000);
@ -483,6 +493,7 @@ th.snarkTorrentStatus {
font-weight: bold;
display: inline-block;
line-height: 120%;
letter-spacing: 0.1em;
}
.snarkTorrentInfo img {
@ -764,7 +775,7 @@ td {
padding: 1px !important;
}
.snarkTorrents tr:hover, .snarkDirInfo tr:hover {
.snarkTorrents tr:hover, .snarkDirInfo tr:hover, #trackerselect tr:nth-child(n+2):hover {
background: #030 !important;
}
@ -993,10 +1004,14 @@ _:-ms-lang(x), .snarkTorrentOdd, .SnarkTorrentEven {
font-variant: small-caps !important;
display: inline-block;
margin: 0 0 -3px !important;
min-width: 260px;
min-width: 300px;
box-shadow: inset 0 0 0 1px #000, 0 1px 1px #000;
}
.toggleview {
padding-bottom: 4px !important;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.snarkConfigTitle, .toggleview {
font-size: 13pt !important;
@ -1014,6 +1029,7 @@ _:-ms-lang(x), .snarkTorrentOdd, .SnarkTorrentEven {
.snarkConfigTitle a {
display: inline-block;
width: 100%;
padding-bottom: 1px !important;
}
.snarkConfigTitle:hover, .toggleview:hover, input.toggle_input:focus + .toggleview {
@ -1500,6 +1516,8 @@ img[src$="magnet.png"] {
width: 120px;
}
/* newtorrent tracker selection */
#trackerselect {
border: 1px solid #131;
width: 100% !important;
@ -1531,22 +1549,25 @@ _:-ms-lang(x), #trackerselect tr:last-child {
}
#trackerselect tr:first-child td {
padding: 3px 5px 3px 20px;
font-weight: bold;
color: #ee9 !important;
}
#trackerselect td {
padding: 5px 5px 5px 20px;
padding: 5px;
text-align: center;
color: #bb7 !important;
}
#trackerselect td:first-child {
width: 20%;
#trackerselect tr:nth-child(n+2):hover td {
color: #ee9 !important;
}
#trackerselect td:first-child, #trackerselect td:last-child {
width: 40%;
font-weight: normal;
}
#trackerselect td:nth-child(4) {
width: 70%;
}
#trackerselect input {
margin: 3px !important;
}
@ -1558,6 +1579,8 @@ _:-ms-lang(x), #trackerselect tr:last-child {
text-overflow: ellipsis;
}
/* end newtorrent tracker selection */
.configsectionpanel td:first-child {
padding-right: 10px !important;
padding-left: 5px !important;
@ -1568,7 +1591,7 @@ _:-ms-lang(x), #trackerselect tr:last-child {
min-width: 50px;
}
.trackerconfig th, .trackerselect th {
.trackerconfig th, #trackerselect tr:first-child td {
padding-top: 7px;
padding-bottom: 7px;
}
@ -1666,6 +1689,7 @@ _:-ms-lang(x), #trackerselect tr:last-child {
#configs td:first-child {
padding-left: 15px !important;
line-height: 80%;
width: 25%;
}
#configs td:first-child, .trackerconfig td:first-child {
@ -2668,7 +2692,7 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, code, textarea, input, input[ty
}
.snarkConfigTitle, .toggleview {
min-width: 300px !important;
min-width: 340px !important;
padding-top: 4px;
}
@ -2677,11 +2701,7 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, code, textarea, input, input[ty
}
.snarkConfigTitle a {
margin-bottom: 1px !important;
}
tt, .snarkTorrents tt, .snarkMessages, .snarkMessages a {
font-size: 9pt !important;
padding-bottom: 2px !important;
}
textarea[name="i2cpOpts"] {
@ -2747,6 +2767,16 @@ textarea[name="i2cpOpts"] {
}
}
@media screen and (min-width: 1600px) {
.snarkMessages li, .snarkMessages li a, .snarkTorrents tt, #ourDest tt, tt {
font-size: 9pt !important
}
tt, .snarkTorrents tt, .snarkMessages, .snarkMessages a {
font-size: 9pt !important;
}
}
/* mini-mode */
@media screen and (max-width: 800px) {

File diff suppressed because it is too large Load Diff

View File

@ -260,6 +260,11 @@ body.iframed {
filter: drop-shadow(0 0 1px #000);
}
.snarkMessages li, .snarkMessages a {
font-weight: bold;
font-size: 8pt !important;
}
.snarkMessages img {
float: right;
margin: -3px -4px 4px 4px;
@ -276,7 +281,7 @@ body.iframed {
z-index: 1;
}
.snarkMessages img:hover, .snarkMessages img:focus {
.snarkMessages img:hover, .snarkMessages img:focus, .closeLog img:hover, .closeLog img:focus {
mix-blend-mode: normal !important;
border: 1px solid #443da0 !important;
border-top: 0 none !important;
@ -432,8 +437,9 @@ tfoot tr:nth-child(n+1) {
border-top: 1px solid #443da0 !important;
}
.snarkTorrents tfoot th::first-line {
font-weight: bold;
.snarkTorrents tfoot tr:first-child th {
font-weight: bold !important;
color: #c9ceff !important;
}
.snarkTorrents tfoot th:nth-child(n+2) {
@ -1115,9 +1121,9 @@ _:-ms-lang(x), .snarkTorrentOdd, .snarkTorrentOdd td, .SnarkTorrentEven, .SnarkT
font-weight: bold;
font-variant: small-caps !important;
display: inline-block;
min-width: 260px;
min-width: 300px;
margin: -1px 0 -5px 0;
padding: 3px 1px 3px 1px;
padding: 4px 1px 4px 1px;
text-align: center !important;
letter-spacing: .15em;
border: 1px solid #443da0;
@ -1127,6 +1133,15 @@ _:-ms-lang(x), .snarkTorrentOdd, .snarkTorrentOdd td, .SnarkTorrentEven, .SnarkT
text-shadow: 0 0 1px #000;
}
.toggleview {
padding: 3px 1px 5px 1px;
}
.snarkConfigTitle a {
display: inline-block;
margin-top: -1px;
}
.snarkConfigTitle:hover, .toggleview:hover, input.toggle_input:focus + .toggleview {
background: #002 !important;
background: linear-gradient(to bottom, #004 50%, #002 50%) !important;
@ -1604,7 +1619,7 @@ img.thumb {
#trackerselect {
width: 100% !important;
width: calc(100% - 150px) !important;
margin: 2px 5px 0 5px;
margin: 8px 5px 4px 5px;
border: 1px solid #120f35;
}
@ -1625,14 +1640,14 @@ _:-ms-lang(x), #trackerselect tr:last-child {
border-bottom: 1px solid #120f35;
}
#trackerselect tr:first-child {
#trackerselect tr:first-child td {
font-weight: bold;
border-bottom: 1px solid #120f35;
background: linear-gradient(to bottom, #010011, #000);
}
#trackerselect tr:first-child td {
padding: 3px 5px 3px 20px;
padding: 7px 5px 7px 20px;
}
#trackerselect td {
@ -1640,15 +1655,11 @@ _:-ms-lang(x), #trackerselect tr:last-child {
font-size: 9pt;
}
#trackerselect td:first-child {
width: 20%;
#trackerselect td:first-child, #trackerselect td:last-child {
width: 40%;
font-weight: normal;
}
#trackerselect td:nth-child(4) {
width: 70%;
}
#trackerselect input {
margin: 3px !important;
}
@ -1789,6 +1800,7 @@ input[name="nofilter_commentsName"] {
#configs td:first-child {
min-width: 200px;
width: 25%;
padding-left: 10px !important;
}
@ -2746,15 +2758,11 @@ a, th, thead th, tfoot th, td, select, select option, .snarkAddInfo, .snarkFileN
}
@media screen and (min-width: 1400px) {
code, textarea, input, tt {
a, th, thead th, tfoot th, td, select, select option, .snarkAddInfo, .snarkFileName, textarea, input[name="nofilter_dataDir"], input {
font-size: 10pt !important;
}
a, th, thead th, tfoot th, td, select, select option, .snarkAddInfo, .snarkFileName, code, textarea, input[name="nofilter_dataDir"], input, code {
font-size: 10pt !important;
}
.snarkMessages li, .snarkMessages a {
code, tt {
font-size: 9pt !important;
}
@ -2776,7 +2784,11 @@ a, th, thead th, tfoot th, td, select, select option, .snarkAddInfo, .snarkFileN
}
.snarkConfigTitle, .toggleview {
min-width: 300px !important;
min-width: 340px !important;
}
.snarkConfigTitle a {
margin-bottom: 0 !important;
}
.snarkMessages {
@ -2843,5 +2855,11 @@ a, th, thead th, tfoot th, td, select, select option, .snarkAddInfo, .snarkFileN
}
}
@media screen and (min-width: 1600px) {
.snarkMessages li, .snarkMessages a {
font-size: 9pt !important;
}
}
/* end responsive layout */

View File

@ -275,7 +275,8 @@ _:-ms-lang(x), .snarkNav:last-child[href="/i2psnark/"] {
}
.snarkMessages li {
margin-left: -15px;
margin-left: -18px;
padding-left: 10px;
}
.snarkMessages li::before {
@ -285,7 +286,7 @@ _:-ms-lang(x), .snarkNav:last-child[href="/i2psnark/"] {
width: 12px;
height: 11px;
background-size: 9px 9px;
margin-left: 2px;
margin-left: -6px;
margin-right: 2px;
}
@ -422,7 +423,7 @@ tfoot td:first-child {
}
.snarkTorrents thead th {
border-top: 1px solid transparent !important;
border-top: none !important;
border-bottom: 1px solid #313 !important;
padding-top: 3px;
padding-bottom: 6px;
@ -550,9 +551,11 @@ th.snarkTorrentAction input[type="image"]:hover, .snarkTorrentAction input[type=
.snarkTorrents tt {
font-family: "Droid Sans Mono", "Noto Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
color: #cc0;
font-weight: bold;
font-size: 8pt !important;
color: #cc0;
margin-right: 2px;
letter-spacing: 0.1em;
}
#totals span, #ourDest {
@ -839,7 +842,7 @@ _:-ms-lang(x), .snarkDirInfo img, .snarkTorrents img {
}
.priorityIndicator img[src*="clock"] {
margin-top: 3px;
margin-bottom: 1px;
}
.percentBarOuter {
@ -905,6 +908,10 @@ _:-ms-lang(x), .snarkDirInfo img, .snarkTorrents img {
transition: ease opacity 0.2s;
}
.snarkDirInfo .percentBarText {
padding: 0;
}
.iframed .percentBarText, .iframed .percentBarText:hover, .iframed .percentBarText:focus {
transition: none;
}
@ -951,7 +958,6 @@ _:-ms-lang(x), .snarkDirInfo img, .snarkTorrents img {
}
.snarkAddInfo {
font-size: 8pt;
line-height: 100% !important;
white-space: normal;
background: url(images/infocircle.png) left center no-repeat;
@ -965,7 +971,8 @@ _:-ms-lang(x), .snarkDirInfo img, .snarkTorrents img {
background: #101;
background: rgba(17, 0, 17, 0.7);
border-radius: 2px;
color: #fbf;
font-size: 8pt !important;
color: #ff7;
padding: 2px 4px;
box-shadow: inset 0 0 0 1px #212;
-moz-user-select: all;
@ -1072,11 +1079,15 @@ th.headerpriority br, .snarkTorrents thead th br {
}
.snarkConfigTitle img, label.toggleview img {
margin: 1px -3px 2px 0;
margin: 1px -1px 2px 0;
vertical-align: middle;
filter: drop-shadow(0 0 1px #000);
}
.snarkConfigTitle img {
margin-right: -2px !important;
}
.configsectionpanel .snarkConfigTitle:hover {
color: #f7e3fc !important;
}
@ -1474,21 +1485,6 @@ input.stoptorrent:hover, input.stoptorrent:focus {
background: url(images/btn_stop.png), linear-gradient(to bottom, #767 0%, #989 100%);
}
/*
a.control:active, input[type="submit"]:active, input[type="reset"]:active {
color: #ce1641 !important;
border: 1px solid #fff !important;
box-shadow: inset 3px 3px 3px #fff;
}
input[type=submit]:active, a.control:active {
background-blend-mode: soft-light;
color: #2e134c !important;
filter: drop-shadow(0 0 1px #f60) sepia(100%) invert(100%) !important;
mix-blend-mode: hard-light;
}
*/
a.control:active, input[type="submit"]:active, input[type="reset"]:active {
background-color: #322c5c !important;
color: #c6bfff;
@ -1510,6 +1506,7 @@ select {
-webkit-appearance: none;
-moz-appearance: none;
box-shadow: inset 1px 1px 2px 1px #101;
text-overflow: ellipsis;
}
select:hover, select:focus, select:active {
@ -2173,6 +2170,7 @@ input#toggle_debug:checked + label + #dhtDebugInner {
#configs td:first-child {
min-width: 220px !important;
width: 25%;
font-weight: bold;
}
@ -2405,7 +2403,7 @@ input#toggle_debug:checked + label + #dhtDebugInner {
}
#newRating select {
width: 90%;
width: 99%;
}
#myRating td:empty {
@ -2646,6 +2644,10 @@ td.snarkTorrentStatus, td.snarkTorrentStatus a {
#commentDeleteAction td {
padding-top: 4px;
}
#trackerselect td {
font-size: 8pt !important;
}
}
@media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 1200px) {
@ -2778,14 +2780,14 @@ code {
.snarkNav:link:first-child, .snarkNav:last-child[href="/i2psnark/"] {
background-position: 11px 45%, center center !important;
}
.snarkNav:link {
font-size: 11pt;
}
.snarkConfigTitle, label.toggleview {
font-size: 13pt !important;
font-size: 12pt !important;
min-width: 320px !important;
}
@ -2901,12 +2903,22 @@ select {
}
}
@media screen and (min-width: 1400px) and (-webkit-min-device-pixel-ratio:0) {
.snarkConfigTitle, label.toggleview {
font-size: 12.5pt !important;
}
select {
padding: 6px 18px 6px 8px !important;
}
}
@media screen and (min-width: 1600px) {
.snarkTorrentUploaded {
padding-left: 6px;
}
.snarkMessages {
.snarkMessages, .snarkTorrents tt, .snarkAddInfo code {
font-size: 9pt !important;
}
}
@ -3107,3 +3119,151 @@ th a img {
/* end responsive layout */
.noscriptWarning {
margin-right: 7px !important;
font-family: "Droid Sans", "Noto Sans", Ubuntu, "Segoe UI", "Lucida Grande", "DejaVu Sans", Verdana, sans-serif;
font-size: 9pt;
mix-blend-mode: luminosity;
position: relative;
z-index: 1;
}
.noscriptWarning::before {
mix-blend-mode: luminosity;
}
#closeLog {
z-index: 1000;
}
/* create torrent -> trackers table */
#trackerselect td:first-child, #trackerselect td:nth-child(2), #trackerselect td:nth-child(3) {
width: 20%;
min-width: 100px;
white-space: nowrap;
}
#trackerselect {
border: 1px solid #101;
border-collapse: separate;
border-spacing: 0;
width: 80% !important;
margin: 8px 0 4px 4px;
box-shadow: 0 0 1px 1px rgba(16, 8, 16, 0.3);
}
#trackerselect td {
padding: 5px !important;
}
#trackerselect td:first-child {
/* padding-right: 15px !important;*/
width: 30%;
text-align: center;
}
#trackerselect tr:first-child td {
background: #000;
background: linear-gradient(to bottom, #313, #000);
padding-top: 8px !important;
padding-bottom: 8px !important;
border-bottom: 1px solid #313;
font-weight: bold !important;
}
#trackerselect tr:nth-child(n+2) td {
border-right: 1px solid #101;
border-right: 1px solid rgba(16,0,16,0.5);
}
#trackerselect tr:nth-child(n+3) td {
border-top: 1px solid #101;
}
#trackerselect tr:nth-child(even) {
background: rgba(8,0,8,0.8);
}
#trackerselect tr:nth-child(odd) {
background: rgba(16,0,16,0.5);
}
#trackerselect td:nth-child(even) {
background: rgba(48,0,48,0.2);
}
#trackerselect td:nth-child(odd) {
background: rgba(64,0,64,0.2);
}
#trackerselect td:last-child {
text-align: center;
width: 30%;
border-right: none !important;
}
#trackerselect tr:nth-child(n+2):hover td {
background: #58165e !important;
background: linear-gradient(to bottom, #58165e, #4a0d56) !important;
}
#trackerselect tr:first-child td:first-child {
border-radius: 3px 0 0 0;
}
#trackerselect tr:first-child td:last-child {
border-radius: 0 3px 0 0;
}
#trackerselect tr:last-child td:first-child {
border-radius: 0 0 0 3px;
}
#trackerselect tr:last-child td:last-child {
border-radius: 0 0 3px 0;
}
#trackerselect input[type="radio"], #trackerselect input[type="checkbox"] {
margin: 2px !important;
}
.trackerName {
display: inline-block;
white-space: nowrap;
text-align: left;
border: 1px solid #101;
background: #202;
background: rgba(32,0,32,0.5);
border-radius: 3px;
padding: 1px 10px 1px 5px;
vertical-align: middle;
}
.trackerName::before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
background: url(images/button_tracker_hover.png) left center no-repeat;
background-size: 16px auto;
vertical-align: middle;
opacity: 0.3;
}
@media screen and (max-width: 1050px) {
#trackerselect {
width: 75% !important;
}
#trackerselect td {
min-width: 0;
}
#trackerselect td:first-child, #trackerselect td:last-child {
width: 15%;
}
}
/* end create torrent -> trackers table */

View File

@ -1129,7 +1129,15 @@ thead img.disable, img.disable:hover {
}
#trackerselect {
margin: 10px 0 5px 0;
width: 100% !important;
width: calc(100% - 202px) !important;
border: 1px solid #6f533e;
margin-left: 5px;
border-collapse: separate;
border-spacing: 0;
border-radius: 2px;
box-shadow: 0 0 2px 1px rgba(77, 69, 62, 0.3);
}
#trackerselect tr:first-child td {
@ -1140,10 +1148,21 @@ thead img.disable, img.disable:hover {
#trackerselect td {
white-space: nowrap !important;
text-align: center;
}
#trackerselect tr:nth-child(n+2) td {
border-right: 1px solid #6f533e;
border-right: 1px solid rgba(111, 83, 62, 0.5);
}
#trackerselect tr:nth-child(n+2) td:last-child {
border-right: none;
}
#trackerselect td:nth-child(2), #trackerselect td:nth-child(3) {
min-width: 60px !important;
max-width: 200px !important;
}
.trackerconfig tr:first-child {
@ -1151,11 +1170,25 @@ thead img.disable, img.disable:hover {
filter: drop-shadow(0 0 1px #aaa);
}
#trackerselect td:first-child {
font-weight: normal;
#trackerselect tr:first-child td {
background: linear-gradient(to bottom, #efefef, #cfc7c2);
border-bottom: 1px solid #6f533e;
}
#configs input[type="submit"], .trackerconfig input[type="submit"], input[name="savepri"] {
#trackerselect tr:nth-child(n+2):hover td {
background: #f9efcf !important;
}
#trackerselect td:first-child, #trackerselect td:last-child {
font-weight: normal;
width: 20%;
}
#trackerselect input[type="radio"], #trackerselect input[type="checkbox"] {
margin: 4px !important;
}
#configs, input[type="submit"], .trackerconfig input[type="submit"], input[name="savepri"] {
text-transform: capitalize;
}
@ -2097,11 +2130,11 @@ input#toggle_debug:checked + label + #dhtDebugInner {
font-size: 10pt !important;
}
.resourceError tr:nth-child(odd) {
.resourceError tr:nth-child(odd), #trackerselect tr:nth-child(odd) {
background: #dfd6d1;
}
.resourceError tr:nth-child(even) {
.resourceError tr:nth-child(even), #trackerselect tr:nth-child(even) {
background: #efe6e0;
}
@ -2166,6 +2199,7 @@ input#toggle_debug:checked + label + #dhtDebugInner {
#configs td:first-child {
min-width: 240px !important;
width: 25%;
font-weight: bold;
text-align: right;
}
@ -2457,6 +2491,7 @@ td#bwHelp a {
width: 90%;
width: calc(100% - 10px);
margin-left: 8px;
text-overflow: ellipsis;
}
#addCommentText {
@ -2817,11 +2852,11 @@ body, .snarkTorrents td, .snarkAddInfo, th, td, .snarkFileName, a.control, input
font-size: 10pt !important;
}
tt, .snarkTorrents tt, textarea {
textarea {
font-size: 9pt !important;
}
.snarkMessages {
tt, .snarkTorrents tt, .snarkMessages {
font-size: 8pt !important;
}
@ -2831,8 +2866,8 @@ tt, .snarkTorrents tt, textarea {
}
.snarkNav:link {
font-size: 12pt;
background-size: 18px auto, 100% 100%, 100% 100% !important;
font-size: 11.5pt;
background-size: 17px auto, 100% 100%, 100% 100% !important;
}
.nav_main:link, .nav_forum:link {
@ -2939,9 +2974,15 @@ tr#torrentInfoStats td {
}
@media screen and (min-width: 1600px) {
.snarkMessages {
tt, .snarkTorrents tt, .snarkMessages {
font-size: 9pt !important;
}
.snarkNav:link {
font-size: 12pt;
background-size: 18px auto, 100% 100%, 100% 100% !important;
}
}
/* mini-mode */
@ -2951,8 +2992,8 @@ tr#torrentInfoStats td {
min-width: 650px !important;
}
.snarkNav:link, .snarkNav:visited {
font-size: 9pt !important;
.snarkNav:link, .snarkNav:visited, #configs td, #configs input, #configs select {
font-size: 8pt !important;
}
th.snarkTorrentStatus a img, .snarkTorrentETA a img, .snarkTrackerDetails a img {
@ -2972,6 +3013,17 @@ th.snarkTorrentStatus a img, .snarkTorrentETA a img, .snarkTrackerDetails a img
max-height: 18px;
}
.snarkTorrents th:nth-child(2) img {
display: none !important;
}
.snarkTorrentName a {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis !important;
max-width: 360px;
}
.snarkTorrentUploaded, .snarkTorrentRateUp, .peerinfo, .debuginfo {
display: none;
}