diff --git a/web/style/transmission/common.css b/web/style/transmission/common.css index 853e458a4..06c049ee4 100644 --- a/web/style/transmission/common.css +++ b/web/style/transmission/common.css @@ -7,7 +7,7 @@ img { border: none; } a { outline: 0; } -#toolbar, #statusbar, .torrent_footer { background: #CCC; } +#statusbar, .torrent_footer { background: #CCC; } /*** **** @@ -23,20 +23,20 @@ a { outline: 0; } **** TOOLBAR **** ***/ -div#toolbar { width: 100%; height: 25px; margin: 0px; padding: 2px; border-bottom: 1px solid #AAA; } +div#toolbar { width: 100%; height: 25px; margin: 0px; padding: 2px; border-bottom: 1px solid #AAA; background: #CCC; } 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 { 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-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 { 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-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 { 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-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 { 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-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 { 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-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-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: #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 { 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 > 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; } /*** @@ -153,17 +153,17 @@ div#torrent_inspector { padding: 15px; position: fixed; top: 55px; bottom: 22px; div#torrent_inspector #inspector-close { display: none; } 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; } -div#torrent_inspector #inspector-tabs-wrapper #inspector-tabs > #inspector-tab-info { cursor: pointer; -moz-user-select: none; -webkit-user-select: none; display: inline-block; border-style: solid; border-color: #aaa; border-width: 1px; padding: 3px; 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; -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; -moz-user-select: none; -webkit-user-select: none; display: inline-block; border-style: solid; border-color: #aaa; border-width: 1px; padding: 3px; 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.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; -moz-user-select: none; -webkit-user-select: none; display: inline-block; border-style: solid; border-color: #aaa; border-width: 1px; padding: 3px; 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.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; -moz-user-select: none; -webkit-user-select: none; display: inline-block; border-style: solid; border-color: #aaa; border-width: 1px; padding: 3px; 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.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; -moz-user-select: none; -webkit-user-select: none; display: inline-block; border-style: solid; border-color: #aaa; border-width: 1px; padding: 3px; 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; -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-right-width: 1px; } -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-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 */ } @@ -218,11 +218,11 @@ tr.inspector_peer_entry.odd { background-color: #EEEEEE; } div.file-priority-radiobox { display: inline; float: right; margin: 4px; margin-top: 2px; } 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; } 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: #dddddd; 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(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/file-priority-low.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-low.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/file-priority-low.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/file-priority-low.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/file-priority-low.png"), linear-gradient(top, white, #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.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(#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: #dddddd; 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(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/file-priority-normal.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-normal.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/file-priority-normal.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/file-priority-normal.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/file-priority-normal.png"), linear-gradient(top, white, #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.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(#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: #dddddd; 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(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/file-priority-high.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/file-priority-high.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/file-priority-high.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/file-priority-high.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/file-priority-high.png"), linear-gradient(top, white, #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 > 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(#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; } /**** ***** @@ -232,11 +232,11 @@ div.file-priority-radiobox > div.high.selected { background-color: #7dc9f2; back div.torrent_footer { height: 22px; border-top: 1px solid #555; bottom: 0; position: fixed; width: 100%; z-index: 3; } div.torrent_footer > * { float: left; margin: 2px 4px; width: 18px; height: 12px; padding: 2px 8px; float: left; border: 1px solid #888; } div.torrent_footer div.main_container { -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/settings.png"); /* fallback */ background-image: url("images/settings.png"), -webkit-gradient(linear, left top, left bottom, from(white), to(#bbbbbb)); /* Saf4+, Chrome */ background-image: url("images/settings.png"), -webkit-linear-gradient(top, white, #bbbbbb); /* Chrome 10+, Saf5.1+ */ background-image: url("images/settings.png"), -moz-linear-gradient(top, white, #bbbbbb); /* FF3.6+ */ background-image: url("images/settings.png"), -ms-linear-gradient(top, white, #bbbbbb); /* IE10 */ background-image: url("images/settings.png"), -o-linear-gradient(top, white, #bbbbbb); /* Opera 11.10+ */ background-image: url("images/settings.png"), linear-gradient(top, white, #bbbbbb); /* W3C */ background-position: center; background-repeat: no-repeat; } -div.torrent_footer div.main_container:active { background-color: #7dc9f2; background-image: url("images/settings.png"); /* fallback */ background-image: url("images/settings.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/settings.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/settings.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/settings.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/settings.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/settings.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; } -div.torrent_footer #turtle-button { 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.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: #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.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 div.main_container:active, div.torrent_footer div.main_container:hover, div.torrent_footer div.main_container.selected { background-color: #7dc9f2; background-image: url("images/settings.png"); /* fallback */ background-image: url("images/settings.png"), -webkit-gradient(linear, left top, left bottom, from(#68abe6), to(#93e8ff)); /* Saf4+, Chrome */ background-image: url("images/settings.png"), -webkit-linear-gradient(top, #68abe6, #93e8ff); /* Chrome 10+, Saf5.1+ */ background-image: url("images/settings.png"), -moz-linear-gradient(top, #68abe6, #93e8ff); /* FF3.6+ */ background-image: url("images/settings.png"), -ms-linear-gradient(top, #68abe6, #93e8ff); /* IE10 */ background-image: url("images/settings.png"), -o-linear-gradient(top, #68abe6, #93e8ff); /* Opera 11.10+ */ background-image: url("images/settings.png"), linear-gradient(top, #68abe6, #93e8ff); /* W3C */ background-position: center; background-repeat: no-repeat; } +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; } div.torrent_footer #prefs-button { display: none; } /**** @@ -249,7 +249,6 @@ div.dialog_container { position: absolute; top: 0; left: 0px; margin: 0px; width div.dialog_container div.dialog_window { background-color: #eee; margin: 0 auto; opacity: .95; border-top: none; text-align: left; width: 420px; z-index: 10; overflow: hidden; position: relative; -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.7); top: 80px; } @media screen and (-webkit-min-device-pixel-ratio:0) { div.dialog_container div.dialog_window { top: 0; margin-top: 71px; } } - 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 div.dialog_window h2.dialog_heading { display: block; float: left; width: 305px; font-size: 1.2em; color: black; margin-top: 20px; } diff --git a/web/style/transmission/common.scss b/web/style/transmission/common.scss index 9634010a0..783ecf797 100644 --- a/web/style/transmission/common.scss +++ b/web/style/transmission/common.scss @@ -51,6 +51,13 @@ a { background-repeat: no-repeat; } +@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; @@ -91,8 +98,6 @@ $selected-gradient-color-bottom: #93e8ff; border-bottom-right-radius: $radius; } - -#toolbar, #statusbar, .torrent_footer { background: #CCC; @@ -136,6 +141,12 @@ div#toolbar margin: 0px; padding: 2px; border-bottom: 1px solid #AAA; + background: #CCC; + + $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; @@ -148,56 +159,32 @@ 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 { @include leftRoundedBox(5px); @include rightRoundedBox(5px); - $image-url: 'images/toolbar-info.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-info.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom); float: right; margin-right: 8px; } @@ -620,61 +607,40 @@ div#torrent_inspector #inspector-tabs { $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; } > #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($border-radius); + @include buttonImage('images/inspector-info.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom); border-left-width: 1px; - &.selected { - @include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom); - } } > #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($border-radius); - border-right-width: 1px; - &.selected { - @include imageOnVerticalGradient($image-url, $selected-gradient-color-top, $selected-gradient-color-bottom); - } + @include buttonImage('images/inspector-files.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom); } } } @@ -953,31 +919,24 @@ div.file-priority-radiobox height: 12px; } + $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.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; } } @@ -1008,30 +967,27 @@ div.torrent_footer 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 { - $image-url: 'images/settings.png'; @include leftRoundedBox(5px); @include rightRoundedBox(5px); - @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/settings.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom); } #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); - } + @include leftRoundedBox(5px); + @include rightRoundedBox(5px); + @include buttonImage('images/compact.png', $idle-color-top, $idle-color-bottom, $active-color-top, $active-color-bottom); } #prefs-button {