mirror
/
transmission
mirror of https://github.com/transmission/transmission
1
0
Fork 0
Code Issues Releases Wiki Activity

(trunk web) use the website's red texture for the toolbar's background

This commit is contained in:
Jordan Lee 2011-10-27 01:44:49 +00:00
parent 54cb963ae0
commit 686c115bde
6 changed files with 358 additions and 436 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/style/transmission/common.css
View File

@ -23,7 +23,7 @@ a { outline: 0; }
**** TOOLBAR
****
***/
div#toolbar { width: 100%; height: 25px; margin: 0px; padding: 2px; border-bottom: 1px solid #AAA; background: #A00; }
div#toolbar { width: 100%; height: 25px; margin: 0px; padding: 2px; border-bottom: 1px solid #AAA; background: url("images/red-texture.png") repeat-x; }
div#toolbar > * { cursor: pointer; -moz-user-select: none; -webkit-user-select: none; display: inline-block; border-style: solid; border-color: #aaa; border-width: 1px; padding: 3px; width: 18px; height: 18px; padding: 2px 8px; float: left; border: 1px solid #888; }
div#toolbar div#toolbar-open { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background-color: #dddddd; background-image: url("images/toolbar-folder.png"); /* fallback */ background-image: url("images/toolbar-folder.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-folder.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-folder.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-folder.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-folder.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-folder.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; margin-left: 4px; }
div#toolbar div#toolbar-open:active, div#toolbar div#toolbar-open:hover, div#toolbar div#toolbar-open.selected { background-color: #7dc9f2; background-image: url("images/toolbar-folder.png"); /* fallback */ background-image: url("images/toolbar-folder.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-folder.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-folder.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-folder.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-folder.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-folder.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
@ -57,7 +57,7 @@ div#toolbar > *.disabled { opacity: 0.25; }
#statusbar #speed-info #speed-dn-container.active { display: inline; }
#statusbar #filter-button { float: left; text-shadow: 0 1px 0 #ccc; margin: 5px 8px; -moz-user-select: none; -webkit-user-select: none; }
#statusbar #filter-button:hover { cursor: pointer; }
#statusbar #filter-button .filter-selection { text-decoration: underline; }
#statusbar #filter-button #filter-button .filter-selection { text-decoration: underline; }
#statusbar input#torrent_search { float: right; height: 15px; width: 100px; border: solid 0 #fff; padding: 2px; margin: 4px 5px 0 0; border-radius: 10px; }
#statusbar input#torrent_search.blur { color: #999; }

72
web/style/transmission/common.scss
View File

@ -1,33 +1,3 @@
/*--------------------------------------
*
* G L O B A L
*
*--------------------------------------*/
html {
margin: 0;
/* setting border: 0 hoses ie6 win window inner well border */
padding: 0;
height: 100%;
}
body {
font: 62.5% "lucida grande", Tahoma, Verdana, Arial, Helvetica, sans-serif; /* Resets 1em to 10px */
color: #222;/* !important; */
background: #FFF;
text-align: center;
margin: 0 0 30px;
overflow: hidden;
}
img {
border: none;
}
a {
outline: 0;
}
@mixin verticalGradient($topColor, $bottomColor) {
background-color: mix($topColor, $bottomColor);
background-image: -webkit-gradient(linear, left top, left bottom, from($topColor), to($bottomColor));
@ -98,6 +68,36 @@ $selected-gradient-color-bottom: #93e8ff;
border-bottom-right-radius: $radius;
}
/*--------------------------------------
*
* G L O B A L
*
*--------------------------------------*/
html {
margin: 0;
/* setting border: 0 hoses ie6 win window inner well border */
padding: 0;
height: 100%;
}
body {
font: 62.5% "lucida grande", Tahoma, Verdana, Arial, Helvetica, sans-serif; /* Resets 1em to 10px */
color: #222;/* !important; */
background: #FFF;
text-align: center;
margin: 0 0 30px;
overflow: hidden;
}
img {
border: none;
}
a {
outline: 0;
}
#statusbar,
.torrent_footer {
background: #CCC;
@ -141,7 +141,7 @@ div#toolbar
margin: 0px;
padding: 2px;
border-bottom: 1px solid #AAA;
background: #A00;
background: url('images/red-texture.png') repeat-x;
$idle-color-top: $nonselected-gradient-color-top;
$idle-color-bottom: $nonselected-gradient-color-bottom;
@ -256,14 +256,8 @@ div#toolbar
margin: 5px 8px;
-moz-user-select: none;
-webkit-user-select: none;
&:hover {
cursor: pointer;
}
.filter-selection {
text-decoration: underline;
}
&:hover { cursor: pointer };
#filter-button .filter-selection { text-decoration: underline; }
}
input#torrent_search

1
web/style/transmission/images/Makefile.am
View File

@ -13,6 +13,7 @@ dist_data_DATA = \
inspector-info.png \
inspector-peers.png \
inspector-trackers.png \
red-texture.png \
lock_icon.png \
logo.png \
progress.png \

BIN
web/style/transmission/images/red-texture.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 646 B

158
web/style/transmission/mobile.css
View File

@ -22,20 +22,22 @@ body.inspector_showing #torrent_filter_bar, body.inspector_showing #torrent_cont
**** TOOLBAR
****
***/
div#toolbar { background: #CCC; width: 100%; height: 25px; margin: 0px; padding: 2px; border-bottom: 1px solid #AAA; }
div#toolbar > * { cursor: pointer; display: inline-block; padding: 3px; width: 18px; height: 18px; padding: 2px 8px; float: left; border: 1px solid #888; }
div#toolbar div#toolbar-open { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background-color: #d4d4d4; background-image: url("images/toolbar-folder.png"); /* fallback */ background-image: url("images/toolbar-folder.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-folder.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-folder.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-folder.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-folder.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-folder.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; margin-left: 4px; }
div#toolbar div#toolbar-open:active { background-color: #7dc9f2; background-image: url("images/toolbar-folder.png"); /* fallback */ background-image: url("images/toolbar-folder.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-folder.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-folder.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-folder.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-folder.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-folder.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-remove { -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #d4d4d4; background-image: url("images/toolbar-close.png"); /* fallback */ background-image: url("images/toolbar-close.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-close.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-close.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-close.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-close.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-close.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-remove:active { background-color: #7dc9f2; background-image: url("images/toolbar-close.png"); /* fallback */ background-image: url("images/toolbar-close.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-close.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-close.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-close.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-close.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-close.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-start { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background-color: #d4d4d4; background-image: url("images/toolbar-start.png"); /* fallback */ background-image: url("images/toolbar-start.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-start.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-start.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-start.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-start.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-start.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; margin-left: 20px; }
div#toolbar > div#toolbar-start:active { background-color: #7dc9f2; background-image: url("images/toolbar-start.png"); /* fallback */ background-image: url("images/toolbar-start.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-start.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-start.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-start.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-start.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-start.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-pause { -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #d4d4d4; background-image: url("images/toolbar-pause.png"); /* fallback */ background-image: url("images/toolbar-pause.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-pause.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-pause.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-pause.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-pause.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-pause.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-pause:active { background-color: #7dc9f2; background-image: url("images/toolbar-pause.png"); /* fallback */ background-image: url("images/toolbar-pause.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-pause.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-pause.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-pause.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-pause.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-pause.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-select { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #d4d4d4; background-image: url("images/toolbar-pointer.png"); /* fallback */ background-image: url("images/toolbar-pointer.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-pointer.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-pointer.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-pointer.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-pointer.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-pointer.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; margin-left: 20px; }
div#toolbar > div#toolbar-select:active { background-color: #7dc9f2; background-image: url("images/toolbar-pointer.png"); /* fallback */ background-image: url("images/toolbar-pointer.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-pointer.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-pointer.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-pointer.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-pointer.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-pointer.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-inspector { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #d4d4d4; background-image: url("images/toolbar-info.png"); /* fallback */ background-image: url("images/toolbar-info.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-info.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-info.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-info.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-info.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-info.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; float: right; margin-right: 8px; }
div#toolbar > div#toolbar-inspector:active, div#toolbar > div#toolbar-inspector.selected { background-color: #7dc9f2; background-image: url("images/toolbar-info.png"); /* fallback */ background-image: url("images/toolbar-info.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-info.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-info.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-info.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-info.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-info.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar { width: 100%; height: 25px; margin: 0px; padding: 2px; border-bottom: 1px solid #AAA; background: url("images/red-texture.png") repeat-x; }
div#toolbar > * { cursor: pointer; -moz-user-select: none; -webkit-user-select: none; display: inline-block; border-style: solid; border-color: #aaa; border-width: 1px; padding: 3px; width: 18px; height: 18px; padding: 2px 8px; float: left; border: 1px solid #888; }
div#toolbar div#toolbar-open { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background-color: #dddddd; background-image: url("images/toolbar-folder.png"); /* fallback */ background-image: url("images/toolbar-folder.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-folder.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-folder.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-folder.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-folder.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-folder.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; margin-left: 4px; }
div#toolbar div#toolbar-open:active, div#toolbar div#toolbar-open:hover, div#toolbar div#toolbar-open.selected { background-color: #7dc9f2; background-image: url("images/toolbar-folder.png"); /* fallback */ background-image: url("images/toolbar-folder.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-folder.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-folder.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-folder.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-folder.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-folder.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-remove { -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #dddddd; background-image: url("images/toolbar-close.png"); /* fallback */ background-image: url("images/toolbar-close.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-close.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-close.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-close.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-close.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-close.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-remove:active, div#toolbar > div#toolbar-remove:hover, div#toolbar > div#toolbar-remove.selected { background-color: #7dc9f2; background-image: url("images/toolbar-close.png"); /* fallback */ background-image: url("images/toolbar-close.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-close.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-close.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-close.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-close.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-close.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-start { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background-color: #dddddd; background-image: url("images/toolbar-start.png"); /* fallback */ background-image: url("images/toolbar-start.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-start.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-start.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-start.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-start.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-start.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; margin-left: 20px; }
div#toolbar > div#toolbar-start:active, div#toolbar > div#toolbar-start:hover, div#toolbar > div#toolbar-start.selected { background-color: #7dc9f2; background-image: url("images/toolbar-start.png"); /* fallback */ background-image: url("images/toolbar-start.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-start.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-start.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-start.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-start.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-start.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-pause { -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #dddddd; background-image: url("images/toolbar-pause.png"); /* fallback */ background-image: url("images/toolbar-pause.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-pause.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-pause.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-pause.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-pause.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-pause.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-pause:active, div#toolbar > div#toolbar-pause:hover, div#toolbar > div#toolbar-pause.selected { background-color: #7dc9f2; background-image: url("images/toolbar-pause.png"); /* fallback */ background-image: url("images/toolbar-pause.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-pause.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-pause.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-pause.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-pause.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-pause.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-select { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #dddddd; background-image: url("images/toolbar-pointer.png"); /* fallback */ background-image: url("images/toolbar-pointer.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-pointer.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-pointer.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-pointer.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-pointer.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-pointer.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; margin-left: 20px; }
div#toolbar > div#toolbar-select:active, div#toolbar > div#toolbar-select:hover, div#toolbar > div#toolbar-select.selected { background-color: #7dc9f2; background-image: url("images/toolbar-pointer.png"); /* fallback */ background-image: url("images/toolbar-pointer.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-pointer.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-pointer.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-pointer.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-pointer.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-pointer.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-prefs { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background-color: #dddddd; background-image: url("images/toolbar-wrench.png"); /* fallback */ background-image: url("images/toolbar-wrench.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-wrench.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-wrench.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-wrench.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-wrench.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-wrench.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; border-right-width: 0px; float: right; }
div#toolbar > div#toolbar-prefs:active, div#toolbar > div#toolbar-prefs:hover, div#toolbar > div#toolbar-prefs.selected { background-color: #7dc9f2; background-image: url("images/toolbar-wrench.png"); /* fallback */ background-image: url("images/toolbar-wrench.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-wrench.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-wrench.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-wrench.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-wrench.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-wrench.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > div#toolbar-inspector { -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #dddddd; background-image: url("images/toolbar-info.png"); /* fallback */ background-image: url("images/toolbar-info.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/toolbar-info.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-info.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/toolbar-info.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/toolbar-info.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/toolbar-info.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; float: right; margin-right: 8px; }
div#toolbar > div#toolbar-inspector:active, div#toolbar > div#toolbar-inspector:hover, div#toolbar > div#toolbar-inspector.selected { background-color: #7dc9f2; background-image: url("images/toolbar-info.png"); /* fallback */ background-image: url("images/toolbar-info.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/toolbar-info.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/toolbar-info.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/toolbar-info.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/toolbar-info.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/toolbar-info.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#toolbar > *.disabled { opacity: 0.25; }
/***
@ -43,9 +45,16 @@ div#toolbar > *.disabled { opacity: 0.25; }
**** STATUSBAR
****
***/
#statusbar { background: #CCC; margin: 0; color: black; border-bottom: 1px solid #AAA; width: 100%; overflow: hidden; position: relative; text-align: left; }
#statusbar #speed-info { margin-top: 3px; float: right; margin-right: 6px; }
#statusbar #filter-button { float: left; border: none; font-size: 1.2em; padding: 1px 6px; margin-top: 1px; overflow: hidden; text-overflow: ellipsis; -moz-user-select: none; -webkit-user-select: none; }
#statusbar { height: 24px; width: 100%; border-bottom: 1px solid #AAA; overflow: hidden; position: relative; background-color: #CCC; }
#statusbar #speed-info { margin-top: 5px; margin-left: 45%; text-align: left; }
#statusbar #speed-info * { display: inline-block; }
#statusbar #speed-info #speed-up-icon { margin-left: 8px; width: 8px; height: 8px; background: url("images/arrow-up.png") bottom no-repeat; }
#statusbar #speed-info #speed-dn-icon { width: 8px; height: 8px; background: url("images/arrow-down.png") bottom no-repeat; }
#statusbar #speed-info #speed-up-container { display: none; }
#statusbar #speed-info #speed-up-container.active { display: inline; }
#statusbar #speed-info #speed-dn-container { display: none; }
#statusbar #speed-info #speed-dn-container.active { display: inline; }
#statusbar #filter-button { float: left; text-shadow: 0 1px 0 #ccc; margin: 5px 8px; -moz-user-select: none; -webkit-user-select: none; }
#statusbar #filter-button:hover { cursor: pointer; }
#statusbar #filter-button #filter-button .filter-selection { text-decoration: underline; }
#statusbar #torrent_search { display: none; }
@ -55,28 +64,16 @@ div#toolbar > *.disabled { opacity: 0.25; }
**** FILTER POPUP
****
***/
#filter-popup .count { padding-left: 3px; }
#filter-popup { color: #222; /* !important; */ background: #FFF; z-index: 100; }
#filter-popup #filter-by-state .row .filter-img { display: none; }
div#filter-popup #filter-by-state .row .filter-name { left: 0px; }
#filter-popup #filter-by-state .row .filter-name { left: 0px; }
#filter-popup .row { text-align: left; cursor: pointer; margin: 15px 2px; position: relative; height: 18px; -moz-user-select: none; -webkit-user-select: none; }
div#filter-popup .row .filter-img { border: none; width: 16px; height: 16px; position: absolute; left: 0px; }
#filter-popup .row .filter-img { border: none; width: 16px; height: 16px; position: absolute; left: 0px; }
#filter-popup .row .filter-name { position: absolute; left: 20px; }
#filter-popup .row .count { float: right; color: #aaa; }
#filter-popup li { text-align: left; }
#filter-popup .row:hover, #filter-popup .row.selected { font-weight: bold; }
#filter-popup #filter-by-state { float: left; width: 120px; overflow: hidden; text-overflow: ellipsis; }
#filter-popup #filter-by-tracker { float: right; width: 130px; overflow: hidden; text-overflow: ellipsis; }
/***
@ -117,48 +114,28 @@ ul.torrent_list li.torrent div.torrent_peer_details.error { color: #FF0000; }
ul.torrent_list li.torrent.selected div.torrent_peer_details.error { color: #FFF; }
/** Progressbar Each progressbar has three elemens: a parent container and two children, complete and incomplete. The only thing needed to set the progressbar percentage is to set the complete child's width as a percentage. This is because incomplete is pinned to the full width and height of the parent, and complete is pinned to the left side of the parent and has a higher z-index. The progressbar has different colors depending on its state, so there are five 'decorator' classNames: paused, queued, magnet, leeching, seeding. */
ul.torrent_list div.torrent_progress_bar_container { height: 10px; position: relative; margin-top: 2px; }
ul.torrent_list div.torrent_progress_bar_container { height: 10px; position: relative; }
ul.torrent_list div.torrent_progress_bar_container.compact { width: 50px; position: absolute; right: 10px; margin-top: 2px; /*float: right;*/ }
ul.torrent_list div.torrent_peer_details.compact { margin-top: 2px; margin-left: 10px; margin-right: 65px; /* leave room on the right for the progressbar */ float: right; /* pins it next to progressbar & forces torrent_name to ellipsize when it bumps up against this div */ }
ul.torrent_list div.torrent_progress_bar_container.full { margin-bottom: 5px; }
ul.torrent_list div.torrent_progress_bar_container.full { margin-top: 2px; margin-bottom: 5px; }
ul.torrent_list div.torrent_peer_details.compact { margin-top: 2px; margin-right: 65px; /* leave room on the right for the progressbar */ float: right; /* pins it next to progressbar & forces torrent_name to ellipsize when it bumps up against this div */ }
ul.torrent_list div.torrent_progress_bar { height: 100%; position: absolute; top: 0px; left: 0px; background-image: url("images/progress.png"); background-repeat: repeat-x; border: 1px solid #888; }
ul.torrent_list div.torrent_progress_bar.complete { z-index: 2; }
ul.torrent_list div.torrent_progress_bar.incomplete { z-index: 1; width: 100%; }
ul.torrent_list div.torrent_progress_bar.complete.paused { background-position: left -30px; border-color: #989898; }
ul.torrent_list div.torrent_progress_bar.incomplete.paused { background-position: left -20px; border-color: #CFCFCF; }
ul.torrent_list div.torrent_progress_bar.complete.magnet { background-position: left -20px; border-color: #CFCFCF; }
ul.torrent_list div.torrent_progress_bar.incomplete.magnet { background-position: left -50px; border-color: #D47778; }
ul.torrent_list div.torrent_progress_bar.complete.leeching { background-position: left 0px; border-color: #3D9DEA; }
ul.torrent_list div.torrent_progress_bar.complete.leeching { background-position: left 0px; border-color: #3D9DEA; }
ul.torrent_list div.torrent_progress_bar.complete.leeching.queued { background-position: left -70px; border-color: #889CA5; }
ul.torrent_list div.torrent_progress_bar.incomplete.leeching { background-position: left -20px; border-color: #CFCFCF; }
ul.torrent_list div.torrent_progress_bar.incomplete.leeching.queued { background-position: left -80px; border-color: #C4C4C4; }
ul.torrent_list div.torrent_progress_bar.complete.seeding { background-position: left -40px; border-color: #269E30; }
ul.torrent_list div.torrent_progress_bar.complete.seeding.queued { background-position: left -60px; border-color: #8A998D; }
ul.torrent_list div.torrent_progress_bar.incomplete { z-index: 1; width: 100%; }
ul.torrent_list div.torrent_progress_bar.incomplete.paused { background-position: left -20px; border-color: #CFCFCF; }
ul.torrent_list div.torrent_progress_bar.incomplete.magnet { background-position: left -50px; border-color: #D47778; }
ul.torrent_list div.torrent_progress_bar.incomplete.leeching { background-position: left -20px; border-color: #CFCFCF; }
ul.torrent_list div.torrent_progress_bar.incomplete.leeching.queued { background-position: left -80px; border-color: #C4C4C4; }
ul.torrent_list div.torrent_progress_bar.incomplete.seeding { background-position: left -10px; border-color: #29AD35; }
div.dialog_container { background: rgba(0, 0, 0, 0.85); color: white; padding: 15px 10px; }
div.dialog_container #dialog_logo { width: 64px; height: 64px; margin: 20px 20px 0 20px; float: left; background: transparent url("images/logo.png") top left no-repeat; }
div.dialog_container .dialog_window { height: auto; font-size: 13px; text-shadow: black 1px 1px 1px !important; }
/****
***** START / STOP BUTTON
****/
div#dialog_message.dialog_message { width: 280px; margin: 10px auto 25px; font-size: 13px; line-height: 14px; word-wrap: break-word; overflow: hidden; padding-bottom: 0; }
#torrent_upload_file, label[for="torrent_upload_file"] { display: none; }
@ -201,18 +178,19 @@ div.dialog_container a { color: white; padding: 7px 0; background: #222; text-de
div#torrent_inspector { top: 0 !important; position: relative; right: 0px; width: 100%; background-color: #ddd; z-index: 2; text-align: left; overflow: auto; /* Files Inspector Tab */ }
div#torrent_inspector #inspector-tabs-wrapper { width: 100%; overflow: hidden; text-align: center; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs { display: inline-block; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > * { width: 30px; height: 20px; border: 1px solid #aaa; border-left-width: 0px; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-info { cursor: pointer; display: inline-block; padding: 3px; background-color: #d4d4d4; background-image: url("images/inspector-info.png"); /* fallback */ background-image: url("images/inspector-info.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/inspector-info.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-info.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/inspector-info.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/inspector-info.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/inspector-info.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-left-width: 1px; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-info.selected { background-color: #7dc9f2; background-image: url("images/inspector-info.png"); /* fallback */ background-image: url("images/inspector-info.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/inspector-info.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-info.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/inspector-info.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/inspector-info.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/inspector-info.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-activity { cursor: pointer; display: inline-block; padding: 3px; background-color: #d4d4d4; background-image: url("images/inspector-activity.png"); /* fallback */ background-image: url("images/inspector-activity.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/inspector-activity.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-activity.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/inspector-activity.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/inspector-activity.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/inspector-activity.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-activity.selected { background-color: #7dc9f2; background-image: url("images/inspector-activity.png"); /* fallback */ background-image: url("images/inspector-activity.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/inspector-activity.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-activity.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/inspector-activity.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/inspector-activity.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/inspector-activity.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-peers { cursor: pointer; display: inline-block; padding: 3px; background-color: #d4d4d4; background-image: url("images/inspector-peers.png"); /* fallback */ background-image: url("images/inspector-peers.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/inspector-peers.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-peers.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/inspector-peers.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/inspector-peers.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/inspector-peers.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-peers.selected { background-color: #7dc9f2; background-image: url("images/inspector-peers.png"); /* fallback */ background-image: url("images/inspector-peers.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/inspector-peers.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-peers.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/inspector-peers.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/inspector-peers.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/inspector-peers.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-trackers { cursor: pointer; display: inline-block; padding: 3px; background-color: #d4d4d4; background-image: url("images/inspector-trackers.png"); /* fallback */ background-image: url("images/inspector-trackers.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/inspector-trackers.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-trackers.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/inspector-trackers.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/inspector-trackers.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/inspector-trackers.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-trackers.selected { background-color: #7dc9f2; background-image: url("images/inspector-trackers.png"); /* fallback */ background-image: url("images/inspector-trackers.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/inspector-trackers.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-trackers.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/inspector-trackers.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/inspector-trackers.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/inspector-trackers.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-files { cursor: pointer; display: inline-block; padding: 3px; background-color: #d4d4d4; background-image: url("images/inspector-files.png"); /* fallback */ background-image: url("images/inspector-files.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/inspector-files.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-files.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/inspector-files.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/inspector-files.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/inspector-files.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-files.selected { background-color: #7dc9f2; background-image: url("images/inspector-files.png"); /* fallback */ background-image: url("images/inspector-files.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/inspector-files.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-files.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/inspector-files.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/inspector-files.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/inspector-files.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector_header #torrent_inspector_name { padding-top: 10px; font-weight: bold; font-size: large; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > * { cursor: pointer; -moz-user-select: none; -webkit-user-select: none; display: inline-block; border-style: solid; border-color: #aaa; border-width: 1px; padding: 3px; width: 30px; height: 20px; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-info { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background-color: #dddddd; background-image: url("images/inspector-info.png"); /* fallback */ background-image: url("images/inspector-info.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/inspector-info.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-info.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/inspector-info.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/inspector-info.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/inspector-info.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; border-left-width: 1px; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-info:active, div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-info:hover, div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-info.selected { background-color: #7dc9f2; background-image: url("images/inspector-info.png"); /* fallback */ background-image: url("images/inspector-info.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/inspector-info.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-info.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/inspector-info.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/inspector-info.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/inspector-info.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-activity { background-color: #dddddd; background-image: url("images/inspector-activity.png"); /* fallback */ background-image: url("images/inspector-activity.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/inspector-activity.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-activity.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/inspector-activity.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/inspector-activity.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/inspector-activity.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-activity:active, div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-activity:hover, div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-activity.selected { background-color: #7dc9f2; background-image: url("images/inspector-activity.png"); /* fallback */ background-image: url("images/inspector-activity.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/inspector-activity.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-activity.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/inspector-activity.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/inspector-activity.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/inspector-activity.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-peers { background-color: #dddddd; background-image: url("images/inspector-peers.png"); /* fallback */ background-image: url("images/inspector-peers.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/inspector-peers.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-peers.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/inspector-peers.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/inspector-peers.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/inspector-peers.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-peers:active, div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-peers:hover, div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-peers.selected { background-color: #7dc9f2; background-image: url("images/inspector-peers.png"); /* fallback */ background-image: url("images/inspector-peers.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/inspector-peers.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-peers.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/inspector-peers.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/inspector-peers.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/inspector-peers.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-trackers { background-color: #dddddd; background-image: url("images/inspector-trackers.png"); /* fallback */ background-image: url("images/inspector-trackers.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/inspector-trackers.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-trackers.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/inspector-trackers.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/inspector-trackers.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/inspector-trackers.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-trackers:active, div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-trackers:hover, div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-trackers.selected { background-color: #7dc9f2; background-image: url("images/inspector-trackers.png"); /* fallback */ background-image: url("images/inspector-trackers.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/inspector-trackers.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-trackers.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/inspector-trackers.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/inspector-trackers.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/inspector-trackers.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-files { -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #dddddd; background-image: url("images/inspector-files.png"); /* fallback */ background-image: url("images/inspector-files.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/inspector-files.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-files.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/inspector-files.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/inspector-files.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/inspector-files.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-files:active, div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-files:hover, div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-files.selected { background-color: #7dc9f2; background-image: url("images/inspector-files.png"); /* fallback */ background-image: url("images/inspector-files.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/inspector-files.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/inspector-files.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/inspector-files.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/inspector-files.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/inspector-files.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div#torrent_inspector #inspector_header { margin-top: 8px; }
div#torrent_inspector #inspector_header #torrent_inspector_name { font-weight: bold; font-size: large; }
div#torrent_inspector .inspector_group { display: table; width: 100%; border-top: 1px solid #888; margin: 10px 0px; padding: 10px 0px; /* Trackers Inspector Tab */ }
div#torrent_inspector .inspector_group .inspector_group_label { display: table-header-group; font-weight: bold; }
div#torrent_inspector .inspector_group .inspector_row { display: table-row; }
@ -246,28 +224,26 @@ div#torrent_inspector ul.single_file li.inspector_torrent_file_list_entry > .fil
**** File Priority Buttons
***/
div.file-priority-radiobox { display: inline; float: right; margin: 4px; margin-top: 2px; }
div.file-priority-radiobox > * { cursor: pointer; display: inline-block; padding: 3px; width: 30px; height: 12px; border: 1px solid #888; }
div.file-priority-radiobox > div.low { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background-color: #d4d4d4; background-image: url("images/file-priority-low.png"); /* fallback */ background-image: url("images/file-priority-low.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/file-priority-low.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-low.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/file-priority-low.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/file-priority-low.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/file-priority-low.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; border-right-width: 0px; }
div.file-priority-radiobox > div.low.selected { background-color: #7dc9f2; background-image: url("images/file-priority-low.png"); /* fallback */ background-image: url("images/file-priority-low.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/file-priority-low.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-low.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/file-priority-low.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/file-priority-low.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/file-priority-low.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.file-priority-radiobox > div.normal { background-color: #d4d4d4; background-image: url("images/file-priority-normal.png"); /* fallback */ background-image: url("images/file-priority-normal.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/file-priority-normal.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-normal.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/file-priority-normal.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/file-priority-normal.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/file-priority-normal.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.file-priority-radiobox > div.normal.selected { background-color: #7dc9f2; background-image: url("images/file-priority-normal.png"); /* fallback */ background-image: url("images/file-priority-normal.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/file-priority-normal.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-normal.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/file-priority-normal.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/file-priority-normal.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/file-priority-normal.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.file-priority-radiobox > div.high { -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #d4d4d4; background-image: url("images/file-priority-high.png"); /* fallback */ background-image: url("images/file-priority-high.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/file-priority-high.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-high.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/file-priority-high.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/file-priority-high.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/file-priority-high.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; border-left-width: 0px; }
div.file-priority-radiobox > div.high.selected { background-color: #7dc9f2; background-image: url("images/file-priority-high.png"); /* fallback */ background-image: url("images/file-priority-high.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/file-priority-high.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-high.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/file-priority-high.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/file-priority-high.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/file-priority-high.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.file-priority-radiobox > * { cursor: pointer; -moz-user-select: none; -webkit-user-select: none; display: inline-block; border-style: solid; border-color: #aaa; border-width: 1px; padding: 3px; width: 30px; height: 12px; border: 1px solid #888; }
div.file-priority-radiobox > div.low { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; background-color: #dcdcdc; background-image: url("images/file-priority-low.png"); /* fallback */ background-image: url("images/file-priority-low.png"), -webkit-gradient(linear, left top, left bottom, from(#e3e3e3), to(#d6d6d6)); /* Saf4+, Chrome */ background-image: url("images/file-priority-low.png"), -webkit-linear-gradient(top, #e3e3e3, #d6d6d6); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-low.png"), -moz-linear-gradient(top, #e3e3e3, #d6d6d6); /* FF3.6+ */ background-image: url("images/file-priority-low.png"), -ms-linear-gradient(top, #e3e3e3, #d6d6d6); /* IE10 */ background-image: url("images/file-priority-low.png"), -o-linear-gradient(top, #e3e3e3, #d6d6d6); /* Opera 11.10+ */ background-image: url("images/file-priority-low.png"), linear-gradient(top, #e3e3e3, #d6d6d6); /* W3C */ background-position: center; background-repeat: no-repeat; border-right-width: 0px; }
div.file-priority-radiobox > div.low:active, div.file-priority-radiobox > div.low:hover, div.file-priority-radiobox > div.low.selected { background-color: #7dc9f2; background-image: url("images/file-priority-low.png"); /* fallback */ background-image: url("images/file-priority-low.png"), -webkit-gradient(linear, left top, left bottom, from(#79c3f0), to(#81cff5)); /* Saf4+, Chrome */ background-image: url("images/file-priority-low.png"), -webkit-linear-gradient(top, #79c3f0, #81cff5); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-low.png"), -moz-linear-gradient(top, #79c3f0, #81cff5); /* FF3.6+ */ background-image: url("images/file-priority-low.png"), -ms-linear-gradient(top, #79c3f0, #81cff5); /* IE10 */ background-image: url("images/file-priority-low.png"), -o-linear-gradient(top, #79c3f0, #81cff5); /* Opera 11.10+ */ background-image: url("images/file-priority-low.png"), linear-gradient(top, #79c3f0, #81cff5); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.file-priority-radiobox > div.normal { background-color: #dcdcdc; background-image: url("images/file-priority-normal.png"); /* fallback */ background-image: url("images/file-priority-normal.png"), -webkit-gradient(linear, left top, left bottom, from(#e3e3e3), to(#d6d6d6)); /* Saf4+, Chrome */ background-image: url("images/file-priority-normal.png"), -webkit-linear-gradient(top, #e3e3e3, #d6d6d6); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-normal.png"), -moz-linear-gradient(top, #e3e3e3, #d6d6d6); /* FF3.6+ */ background-image: url("images/file-priority-normal.png"), -ms-linear-gradient(top, #e3e3e3, #d6d6d6); /* IE10 */ background-image: url("images/file-priority-normal.png"), -o-linear-gradient(top, #e3e3e3, #d6d6d6); /* Opera 11.10+ */ background-image: url("images/file-priority-normal.png"), linear-gradient(top, #e3e3e3, #d6d6d6); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.file-priority-radiobox > div.normal:active, div.file-priority-radiobox > div.normal:hover, div.file-priority-radiobox > div.normal.selected { background-color: #7dc9f2; background-image: url("images/file-priority-normal.png"); /* fallback */ background-image: url("images/file-priority-normal.png"), -webkit-gradient(linear, left top, left bottom, from(#79c3f0), to(#81cff5)); /* Saf4+, Chrome */ background-image: url("images/file-priority-normal.png"), -webkit-linear-gradient(top, #79c3f0, #81cff5); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-normal.png"), -moz-linear-gradient(top, #79c3f0, #81cff5); /* FF3.6+ */ background-image: url("images/file-priority-normal.png"), -ms-linear-gradient(top, #79c3f0, #81cff5); /* IE10 */ background-image: url("images/file-priority-normal.png"), -o-linear-gradient(top, #79c3f0, #81cff5); /* Opera 11.10+ */ background-image: url("images/file-priority-normal.png"), linear-gradient(top, #79c3f0, #81cff5); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.file-priority-radiobox > div.high { -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #dcdcdc; background-image: url("images/file-priority-high.png"); /* fallback */ background-image: url("images/file-priority-high.png"), -webkit-gradient(linear, left top, left bottom, from(#e3e3e3), to(#d6d6d6)); /* Saf4+, Chrome */ background-image: url("images/file-priority-high.png"), -webkit-linear-gradient(top, #e3e3e3, #d6d6d6); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-high.png"), -moz-linear-gradient(top, #e3e3e3, #d6d6d6); /* FF3.6+ */ background-image: url("images/file-priority-high.png"), -ms-linear-gradient(top, #e3e3e3, #d6d6d6); /* IE10 */ background-image: url("images/file-priority-high.png"), -o-linear-gradient(top, #e3e3e3, #d6d6d6); /* Opera 11.10+ */ background-image: url("images/file-priority-high.png"), linear-gradient(top, #e3e3e3, #d6d6d6); /* W3C */ background-position: center; background-repeat: no-repeat; border-left-width: 0px; }
div.file-priority-radiobox > div.high:active, div.file-priority-radiobox > div.high:hover, div.file-priority-radiobox > div.high.selected { background-color: #7dc9f2; background-image: url("images/file-priority-high.png"); /* fallback */ background-image: url("images/file-priority-high.png"), -webkit-gradient(linear, left top, left bottom, from(#79c3f0), to(#81cff5)); /* Saf4+, Chrome */ background-image: url("images/file-priority-high.png"), -webkit-linear-gradient(top, #79c3f0, #81cff5); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-high.png"), -moz-linear-gradient(top, #79c3f0, #81cff5); /* FF3.6+ */ background-image: url("images/file-priority-high.png"), -ms-linear-gradient(top, #79c3f0, #81cff5); /* IE10 */ background-image: url("images/file-priority-high.png"), -o-linear-gradient(top, #79c3f0, #81cff5); /* Opera 11.10+ */ background-image: url("images/file-priority-high.png"), linear-gradient(top, #79c3f0, #81cff5); /* W3C */ background-position: center; background-repeat: no-repeat; }
/****
*****
***** MAIN WINDOW FOOTER
*****
****/
div.torrent_footer { height: 20px; padding-top: 1px; border-top: 1px solid #555; position: relative; width: 100%; z-index: 3; background-color: #d4d4d4; background-image: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ }
div.torrent_footer > * { cursor: pointer; display: inline-block; padding: 3px; -moz-border-radius: 3px; border-radius: 3px; position: relative; float: left; height: 10px; width: 24px; border: 1px solid #666; }
div.torrent_footer #turtle-button { background-color: #d4d4d4; background-image: url("images/turtle.png"); /* fallback */ background-image: url("images/turtle.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/turtle.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/turtle.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/turtle.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/turtle.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/turtle.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.torrent_footer #turtle-button.selected { background-color: #7dc9f2; background-image: url("images/turtle.png"); /* fallback */ background-image: url("images/turtle.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/turtle.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/turtle.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/turtle.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/turtle.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/turtle.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.torrent_footer #compact-button { background-color: #d4d4d4; background-image: url("images/compact.png"); /* fallback */ background-image: url("images/compact.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/compact.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/compact.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/compact.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/compact.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/compact.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; margin-left: 10px; }
div.torrent_footer #compact-button.selected { background-color: #7dc9f2; background-image: url("images/compact.png"); /* fallback */ background-image: url("images/compact.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/compact.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/compact.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/compact.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/compact.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/compact.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.torrent_footer #prefs-button { background-color: #d4d4d4; background-image: url("images/wrench.png"); /* fallback */ background-image: url("images/wrench.png"), -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/wrench.png"), -webkit-linear-gradient(top, #eeeeee, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/wrench.png"), -moz-linear-gradient(top, #eeeeee, #bbbbbb); /* FF3.6+ */ background-image: url("images/wrench.png"), -ms-linear-gradient(top, #eeeeee, #bbbbbb); /* IE10 */ background-image: url("images/wrench.png"), -o-linear-gradient(top, #eeeeee, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/wrench.png"), linear-gradient(top, #eeeeee, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; float: right; }
div.torrent_footer #prefs-button:active { background-color: #7dc9f2; background-image: url("images/wrench.png"); /* fallback */ background-image: url("images/wrench.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/wrench.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/wrench.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/wrench.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/wrench.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/wrench.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.torrent_footer ul#settings_menu, div.torrent_footer div.main_container { display: none; }
div.torrent_footer { height: 22px; border-top: 1px solid #555; position: relative; width: 100%; z-index: 3; background-color: #dddddd; background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); background-image: -webkit-linear-gradient(top, white, #bbbbbb); background-image: -moz-linear-gradient(top, white, #bbbbbb); background-image: -ms-linear-gradient(top, white, #bbbbbb); background-image: -o-linear-gradient(top, white, #bbbbbb); background-image: linear-gradient(top, white, #bbbbbb); }
div.torrent_footer > * { cursor: pointer; -moz-user-select: none; -webkit-user-select: none; display: inline-block; border-style: solid; border-color: #aaa; border-width: 1px; padding: 3px; position: relative; float: left; margin: 2px 4px; width: 18px; height: 12px; padding: 2px 8px; float: left; border: 1px solid #888; }
div.torrent_footer div.main_container, div.torrent_footer ul#settings_menu { display: none; }
div.torrent_footer #turtle-button { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #dddddd; background-image: url("images/turtle.png"); /* fallback */ background-image: url("images/turtle.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/turtle.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/turtle.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/turtle.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/turtle.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/turtle.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.torrent_footer #turtle-button:active, div.torrent_footer #turtle-button:hover, div.torrent_footer #turtle-button.selected { background-color: #7dc9f2; background-image: url("images/turtle.png"); /* fallback */ background-image: url("images/turtle.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/turtle.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/turtle.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/turtle.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/turtle.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/turtle.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.torrent_footer #compact-button { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; background-color: #dddddd; background-image: url("images/compact.png"); /* fallback */ background-image: url("images/compact.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/compact.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/compact.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/compact.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/compact.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/compact.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; }
div.torrent_footer #compact-button:active, div.torrent_footer #compact-button:hover, div.torrent_footer #compact-button.selected { background-color: #7dc9f2; background-image: url("images/compact.png"); /* fallback */ background-image: url("images/compact.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/compact.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/compact.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/compact.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/compact.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/compact.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; }
/****
*****

559
web/style/transmission/mobile.scss
View File

@ -1,37 +1,60 @@
@mixin verticalGradient($topColor, $bottomColor) {
background-color: mix($topColor, $bottomColor);
background-image: -webkit-gradient(linear, left top, left bottom, from($topColor), to($bottomColor)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, $topColor, $bottomColor); /* Chrome 10+, Saf5.1+ */
background-image: -moz-linear-gradient(top, $topColor, $bottomColor); /* FF3.6+ */
background-image: -ms-linear-gradient(top, $topColor, $bottomColor); /* IE10 */
background-image: -o-linear-gradient(top, $topColor, $bottomColor); /* Opera 11.10+ */
background-image: linear-gradient(top, $topColor, $bottomColor); /* W3C */
background-color: mix($topColor, $bottomColor);
background-image: -webkit-gradient(linear, left top, left bottom, from($topColor), to($bottomColor));
background-image: -webkit-linear-gradient(top, $topColor, $bottomColor);
background-image: -moz-linear-gradient(top, $topColor, $bottomColor);
background-image: -ms-linear-gradient(top, $topColor, $bottomColor);
background-image: -o-linear-gradient(top, $topColor, $bottomColor);
background-image: linear-gradient(top, $topColor, $bottomColor);
}
@mixin imageOnVerticalGradient($src, $topColor, $bottomColor) {
background-color: mix($topColor, $bottomColor);
background-image: url($src); /* fallback */
background-image: url($src), -webkit-gradient(linear, left top, left bottom, from($topColor), to($bottomColor)); /* Saf4+, Chrome */
background-image: url($src), -webkit-linear-gradient(top, $topColor, $bottomColor); /* Chrome 10+, Saf5.1+ */
background-image: url($src), -moz-linear-gradient(top, $topColor, $bottomColor); /* FF3.6+ */
background-image: url($src), -ms-linear-gradient(top, $topColor, $bottomColor); /* IE10 */
background-image: url($src), -o-linear-gradient(top, $topColor, $bottomColor); /* Opera 11.10+ */
background-image: url($src), linear-gradient(top, $topColor, $bottomColor); /* W3C */
background-position: center;
background-repeat: no-repeat;
background-color: mix($topColor, $bottomColor);
background-image: url($src); /* fallback */
background-image: url($src), -webkit-gradient(linear, left top, left bottom, from($topColor), to($bottomColor)); /* Saf4+, Chrome */
background-image: url($src), -webkit-linear-gradient(top, $topColor, $bottomColor); /* Chrome 10+, Saf5.1+ */
background-image: url($src), -moz-linear-gradient(top, $topColor, $bottomColor); /* FF3.6+ */
background-image: url($src), -ms-linear-gradient(top, $topColor, $bottomColor); /* IE10 */
background-image: url($src), -o-linear-gradient(top, $topColor, $bottomColor); /* Opera 11.10+ */
background-image: url($src), linear-gradient(top, $topColor, $bottomColor); /* W3C */
background-position: center;
background-repeat: no-repeat;
}
$nonselected-gradient-color-top: #EEE;
@mixin buttonImage($image-url, $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom) {
@include imageOnVerticalGradient($image-url, $idle-color-top, $idle-color-bottom);
&:active, &:hover, &.selected {
@include imageOnVerticalGradient($image-url, $active-color-top, $active-color-bottom);
}
}
$nonselected-gradient-color-top: white;
$nonselected-gradient-color-bottom: #BBB;
$selected-gradient-color-top: #68abe6;
$selected-gradient-color-bottom: #93e8ff;
@mixin button {
cursor: pointer;
display: inline-block;
padding: 3px;
cursor: pointer;
-moz-user-select: none;
-webkit-user-select: none;
display: inline-block;
border-style: solid;
border-color: #aaa;
border-width: 1px;
padding: 3px;
}
@mixin roundedButton($radius) {
@include button;
border-top-left-radius: $radius;
border-top-right-radius: $radius;
border-bottom-left-radius: $radius;
border-bottom-right-radius: $radius;
-moz-border-radius-topleft: $radius;
-moz-border-radius-bottomleft: $radius;
-moz-border-radius-topright: $radius;
-moz-border-radius-bottomright: $radius;
}
@mixin leftRoundedBox($radius) {
-moz-border-radius-topleft: $radius;
-moz-border-radius-bottomleft: $radius;
@ -118,12 +141,17 @@ div#toolbar
{
$separator-spacing: 20px;
background: #CCC;
width: 100%;
height: 25px;
margin: 0px;
padding: 2px;
border-bottom: 1px solid #AAA;
background: url('images/red-texture.png') repeat-x;
$idle-color-top: $nonselected-gradient-color-top;
$idle-color-bottom: $nonselected-gradient-color-bottom;
$active-color-top: $selected-gradient-color-top;
$active-color-bottom: $selected-gradient-color-bottom;
> * {
@include button;
@ -136,56 +164,38 @@ div#toolbar
div#toolbar-open {
@include leftRoundedBox(5px);
$image-url: 'images/toolbar-folder.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&:active {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/toolbar-folder.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
margin-left: 4px;
}
> div#toolbar-remove {
@include rightRoundedBox(5px);
$image-url: 'images/toolbar-close.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&:active {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/toolbar-close.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
}
> div#toolbar-start {
@include leftRoundedBox(5px);
$image-url: 'images/toolbar-start.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&:active {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/toolbar-start.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
margin-left: $separator-spacing;
}
> div#toolbar-pause {
@include rightRoundedBox(5px);
$image-url: 'images/toolbar-pause.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&:active {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/toolbar-pause.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
}
> div#toolbar-select {
@include leftRoundedBox(5px);
@include rightRoundedBox(5px);
$image-url: 'images/toolbar-pointer.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&:active {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/toolbar-pointer.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
margin-left: $separator-spacing;
}
> div#toolbar-inspector {
> div#toolbar-prefs {
@include leftRoundedBox(5px);
@include buttonImage('images/toolbar-wrench.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
border-right-width: 0px;
float: right;
}
> div#toolbar-inspector {
@include rightRoundedBox(5px);
$image-url: 'images/toolbar-info.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&:active, &.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/toolbar-info.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
float: right;
margin-right: 8px;
}
@ -203,29 +213,52 @@ div#toolbar
#statusbar
{
background: #CCC;
margin: 0;
color: black;
border-bottom: 1px solid #AAA;
height: 24px;
width: 100%;
border-bottom: 1px solid #AAA;
overflow: hidden;
position: relative;
text-align: left;
background-color: #CCC;
#speed-info
{
margin-top: 5px;
margin-left: 45%;
text-align: left;
* {
display: inline-block;
}
#speed-up-icon {
margin-left: 8px;
width: 8px;
height: 8px;
background: url('images/arrow-up.png') bottom no-repeat;
}
#speed-dn-icon {
width: 8px;
height: 8px;
background: url('images/arrow-down.png') bottom no-repeat;
}
#speed-up-container {
display: none;
&.active { display: inline; }
}
#speed-dn-container {
display: none;
&.active { display: inline; }
}
#speed-info {
margin-top: 3px;
float: right;
margin-right: 6px;
}
#filter-button {
float: left;
border: none;
font-size: 1.2em;
padding: 1px 6px;
margin-top: 1px;
overflow: hidden;
text-overflow: ellipsis;
text-shadow: 0 1px 0 #ccc;
margin: 5px 8px;
-moz-user-select: none;
-webkit-user-select: none;
&:hover { cursor: pointer };
@ -237,70 +270,68 @@ div#toolbar
}
}
/***
****
**** FILTER POPUP
****
***/
#filter-popup .count {
padding-left: 3px;
}
#filter-popup {
#filter-popup
{
color: #222;/* !important; */
background: #FFF;
z-index: 100;
}
#filter-popup #filter-by-state .row .filter-img {
display: none;
}
div#filter-popup #filter-by-state .row .filter-name {
left: 0px;
}
#filter-popup .row {
text-align: left;
cursor: pointer;
margin: 15px 2px;
position: relative;
height: 18px;
-moz-user-select: none;
-webkit-user-select: none;
}
div#filter-popup .row .filter-img {
border: none;
width: 16px;
height: 16px;
position: absolute;
left: 0px;
}
#filter-popup .row .filter-name {
position: absolute;
left: 20px;
}
#filter-popup .row .count {
float: right;
color: #aaa;
}
#filter-popup li {
text-align: left
}
#filter-popup .row:hover,
#filter-popup .row.selected {
font-weight: bold;
}
#filter-popup #filter-by-state {
float: left;
width: 120px;
overflow: hidden;
text-overflow: ellipsis;
}
#filter-popup #filter-by-tracker {
float: right;
width: 130px;
overflow: hidden;
text-overflow: ellipsis;
#filter-by-state .row .filter-img {
display: none;
}
#filter-by-state .row .filter-name {
left: 0px;
}
.row {
text-align: left;
cursor: pointer;
margin: 15px 2px;
position: relative;
height: 18px;
-moz-user-select: none;
-webkit-user-select: none;
.filter-img {
border: none;
width: 16px;
height: 16px;
position: absolute;
left: 0px;
}
.filter-name {
position: absolute;
left: 20px;
}
.count {
float: right;
color: #aaa;
}
}
li {
text-align: left
}
.row:hover,
.row.selected {
font-weight: bold;
}
#filter-by-state {
float: left;
width: 120px;
overflow: hidden;
text-overflow: ellipsis;
}
#filter-by-tracker {
float: right;
width: 130px;
overflow: hidden;
text-overflow: ellipsis;
}
}
/***
@ -416,107 +447,60 @@ ul.torrent_list li.torrent.selected div.torrent_peer_details.error {
* are five 'decorator' classNames: paused, queued, magnet, leeching, seeding.
*/
ul.torrent_list div.torrent_progress_bar_container {
height: 10px;
position: relative;
margin-top: 2px;
}
ul.torrent_list div.torrent_progress_bar_container.compact {
width: 50px;
position: absolute;
right: 10px;
margin-top: 2px;
/*float: right;*/
}
ul.torrent_list div.torrent_peer_details.compact {
margin-top: 2px;
margin-left: 10px;
margin-right: 65px; /* leave room on the right for the progressbar */
float: right; /* pins it next to progressbar & forces torrent_name to ellipsize when it bumps up against this div */
}
ul.torrent_list div.torrent_progress_bar_container.full {
margin-bottom: 5px;
}
ul.torrent_list div.torrent_progress_bar {
height: 100%;
position: absolute;
top: 0px;
left: 0px;
background-image: url('images/progress.png');
background-repeat: repeat-x;
border: 1px solid #888;
}
ul.torrent_list div.torrent_progress_bar.complete {
z-index: 2;
}
ul.torrent_list div.torrent_progress_bar.incomplete {
z-index: 1;
width: 100%;
}
ul.torrent_list div.torrent_progress_bar.complete.paused {
background-position: left -30px;
border-color: #989898;
}
ul.torrent_list div.torrent_progress_bar.incomplete.paused {
background-position: left -20px;
border-color: #CFCFCF;
}
ul.torrent_list div.torrent_progress_bar.complete.magnet {
background-position: left -20px;
border-color: #CFCFCF;
}
ul.torrent_list div.torrent_progress_bar.incomplete.magnet {
background-position: left -50px;
border-color: #D47778;
}
ul.torrent_list div.torrent_progress_bar.complete.leeching {
background-position: left 0px;
border-color: #3D9DEA;
}
ul.torrent_list div.torrent_progress_bar.complete.leeching.queued {
background-position: left -70px;
border-color: #889CA5;
}
ul.torrent_list div.torrent_progress_bar.incomplete.leeching {
background-position: left -20px;
border-color: #CFCFCF;
}
ul.torrent_list div.torrent_progress_bar.incomplete.leeching.queued {
background-position: left -80px;
border-color: #C4C4C4;
}
ul.torrent_list div.torrent_progress_bar.complete.seeding {
background-position: left -40px;
border-color: #269E30;
}
ul.torrent_list div.torrent_progress_bar.complete.seeding.queued {
background-position: left -60px;
border-color: #8A998D;
}
ul.torrent_list div.torrent_progress_bar.incomplete.seeding {
background-position: left -10px;
border-color: #29AD35;
ul.torrent_list
{
div.torrent_progress_bar_container
{
height: 10px;
position: relative;
&.compact {
width: 50px;
position: absolute;
right: 10px;
margin-top: 2px;
/*float: right;*/
}
&.full {
margin-top: 2px;
margin-bottom: 5px;
}
}
div.torrent_peer_details.compact
{
margin-top: 2px;
margin-right: 65px; /* leave room on the right for the progressbar */
float: right; /* pins it next to progressbar & forces torrent_name to ellipsize when it bumps up against this div */
}
div.torrent_progress_bar
{
height: 100%;
position: absolute;
top: 0px;
left: 0px;
background-image: url('images/progress.png');
background-repeat: repeat-x;
border: 1px solid #888;
&.complete { z-index: 2; }
&.complete.paused { background-position: left -30px; border-color: #989898; }
&.complete.magnet { background-position: left -20px; border-color: #CFCFCF; }
&.complete.leeching { background-position: left 0px; border-color: #3D9DEA; }
&.complete.leeching.queued { background-position: left -70px; border-color: #889CA5; }
&.complete.seeding { background-position: left -40px; border-color: #269E30; }
&.complete.seeding.queued { background-position: left -60px; border-color: #8A998D; }
&.incomplete { z-index: 1; width: 100%; }
&.incomplete.paused { background-position: left -20px; border-color: #CFCFCF; }
&.incomplete.magnet { background-position: left -50px; border-color: #D47778; }
&.incomplete.leeching { background-position: left -20px; border-color: #CFCFCF; }
&.incomplete.leeching.queued { background-position: left -80px; border-color: #C4C4C4; }
&.incomplete.seeding { background-position: left -10px; border-color: #29AD35; }
}
}
div.dialog_container {
background: rgba(0,0,0,0.85);
color: white;
padding: 15px 10px;
}
div.dialog_container #dialog_logo {
width: 64px;
height: 64px;
margin: 20px 20px 0 20px;
float: left;
background: transparent url('images/logo.png') top left no-repeat;
}
div.dialog_container .dialog_window {
height: auto;
font-size: 13px;
text-shadow: black 1px 1px 1px !important;
}
/****
***** START / STOP BUTTON
****/
div#dialog_message.dialog_message {
width: 280px;
@ -661,72 +645,51 @@ div#torrent_inspector
#inspector-tabs
{
$tab-button-radius: 5px;
$border-radius: 5px;
$idle-color-top: $nonselected-gradient-color-top;
$idle-color-bottom: $nonselected-gradient-color-bottom;
$active-color-top: $selected-gradient-color-top;
$active-color-bottom: $selected-gradient-color-bottom;
display: inline-block;
> * {
@include button;
width: 30px;
height: 20px;
border: 1px solid #aaa;
border-left-width: 0px;
}
> #inspector-tab-info {
$image-url: 'images/inspector-info.png';
@include button;
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
@include leftRoundedBox($tab-button-radius);
border-left-width: 1px;
&.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include leftRoundedBox($border-radius);
@include buttonImage('images/inspector-info.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
border-left-width: 1px;
}
> #inspector-tab-activity {
$image-url: 'images/inspector-activity.png';
@include button;
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/inspector-activity.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
}
> #inspector-tab-peers {
$image-url: 'images/inspector-peers.png';
@include button;
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/inspector-peers.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
}
> #inspector-tab-trackers {
$image-url: 'images/inspector-trackers.png';
@include button;
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/inspector-trackers.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
}
> #inspector-tab-files {
$image-url: 'images/inspector-files.png';
@include button;
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
@include rightRoundedBox($tab-button-radius);
&.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include rightRoundedBox($border-radius);
@include buttonImage('images/inspector-files.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
}
}
}
#inspector_header
{
margin-top: 8px;
#torrent_inspector_name
{
padding-top: 10px;
font-weight: bold;
font-size: large;
}
@ -921,31 +884,26 @@ div.file-priority-radiobox
border: 1px solid #888;
}
// We have row after row of these buttons, so the flashy colors used in the inspector tabs look harsh here.
// Keep the same basic color theme, but look less harsh, by cutting the gradient's color range.
$idle-color-top: mix( $nonselected-gradient-color-top, $nonselected-gradient-color-bottom, 60% );
$idle-color-bottom: mix( $nonselected-gradient-color-top, $nonselected-gradient-color-bottom, 40% );
$active-color-top: mix( $selected-gradient-color-top, $selected-gradient-color-bottom, 60% );
$active-color-bottom: mix( $selected-gradient-color-top, $selected-gradient-color-bottom, 40% );
> div.low {
$image-url: 'images/file-priority-low.png';
@include leftRoundedBox($border-radius);
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/file-priority-low.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
border-right-width: 0px;
}
> div.normal {
$image-url: 'images/file-priority-normal.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/file-priority-normal.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
}
> div.high {
$image-url: 'images/file-priority-high.png';
@include rightRoundedBox($border-radius);
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include buttonImage('images/file-priority-high.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
border-left-width: 0px;
}
}
@ -959,8 +917,7 @@ div.file-priority-radiobox
div.torrent_footer
{
height: 20px;
padding-top: 1px;
height: 22px;
border-top: 1px solid #555;
position: relative;
width: 100%;
@ -970,42 +927,36 @@ div.torrent_footer
> * {
@include button;
@include roundedBox(3px);
position: relative;
float: left;
height: 10px;
width: 24px;
border: 1px solid #666;
margin: 2px 4px;
width: 18px;
height: 12px;
padding: 2px 8px;
float: left;
border: 1px solid #888;
}
$idle-color-top: $nonselected-gradient-color-top;
$idle-color-bottom: $nonselected-gradient-color-bottom;
$active-color-top: $selected-gradient-color-top;
$active-color-bottom: $selected-gradient-color-bottom;
div.main_container,
ul#settings_menu {
display: none;
}
#turtle-button {
$image-url: 'images/turtle.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
@include leftRoundedBox(5px);
@include rightRoundedBox(5px);
@include buttonImage('images/turtle.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
}
#compact-button {
$image-url: 'images/compact.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&.selected {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
margin-left: 10px;
}
#prefs-button {
$image-url: 'images/wrench.png';
@include imageOnVerticalGradient($image-url, $nonselected-gradient-color-top, $nonselected-gradient-color-bottom);
&:active {
@include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom);
}
float: right;
}
ul#settings_menu, div.main_container {
display: none;
@include leftRoundedBox(5px);
@include rightRoundedBox(5px);
@include buttonImage('images/compact.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom);
}
}