From 430eddbc4e406d69d14b59671c13f32cfc933ef5 Mon Sep 17 00:00:00 2001 From: Jordan Lee Date: Thu, 27 Oct 2011 03:49:10 +0000 Subject: [PATCH] (trunk web) tweak the filter bar and footer bar's gradient again --- web/style/transmission/common.css | 4 ++-- web/style/transmission/common.scss | 7 +++++-- web/style/transmission/mobile.css | 4 ++-- web/style/transmission/mobile.scss | 7 +++++-- 4 files changed, 14 insertions(+), 8 deletions(-) diff --git a/web/style/transmission/common.css b/web/style/transmission/common.css index 9b7490c80..725ca047d 100644 --- a/web/style/transmission/common.css +++ b/web/style/transmission/common.css @@ -44,7 +44,7 @@ div#toolbar > *.disabled { opacity: 0.25; } **** STATUSBAR **** ***/ -#statusbar { height: 24px; width: 100%; border-bottom: 1px solid #AAA; overflow: hidden; position: relative; background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(#dddddd)); background-image: -webkit-linear-gradient(top, white, #dddddd); background-image: -moz-linear-gradient(top, white, #dddddd); background-image: -ms-linear-gradient(top, white, #dddddd); background-image: -o-linear-gradient(top, white, #dddddd); background-image: linear-gradient(top, white, #dddddd); } +#statusbar { height: 24px; width: 100%; border-bottom: 1px solid #AAA; overflow: hidden; position: relative; background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, from(#dddddd), to(white)); background-image: -webkit-linear-gradient(top, #dddddd, white); background-image: -moz-linear-gradient(top, #dddddd, white); background-image: -ms-linear-gradient(top, #dddddd, white); background-image: -o-linear-gradient(top, #dddddd, white); background-image: linear-gradient(top, #dddddd, white); } #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; } @@ -228,7 +228,7 @@ div.file-priority-radiobox > div.high:active, div.file-priority-radiobox > div.h ***** MAIN WINDOW FOOTER ***** ****/ -div.torrent_footer { height: 22px; border-top: 1px solid #555; bottom: 0; position: fixed; width: 100%; z-index: 3; background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(#dddddd)); background-image: -webkit-linear-gradient(top, white, #dddddd); background-image: -moz-linear-gradient(top, white, #dddddd); background-image: -ms-linear-gradient(top, white, #dddddd); background-image: -o-linear-gradient(top, white, #dddddd); background-image: linear-gradient(top, white, #dddddd); } +div.torrent_footer { height: 22px; border-top: 1px solid #555; bottom: 0; position: fixed; width: 100%; z-index: 3; background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, from(#dddddd), to(white)); background-image: -webkit-linear-gradient(top, #dddddd, white); background-image: -moz-linear-gradient(top, #dddddd, white); background-image: -ms-linear-gradient(top, #dddddd, white); background-image: -o-linear-gradient(top, #dddddd, white); background-image: linear-gradient(top, #dddddd, white); } 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: 5px; border-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, 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; } diff --git a/web/style/transmission/common.scss b/web/style/transmission/common.scss index a37053e8a..f04c6f570 100644 --- a/web/style/transmission/common.scss +++ b/web/style/transmission/common.scss @@ -199,6 +199,9 @@ div#toolbar **** ***/ +$statusbar-gradient-top: #ddd; +$statusbar-gradient-bottom: #fff; + #statusbar { height: 24px; @@ -206,7 +209,7 @@ div#toolbar border-bottom: 1px solid #AAA; overflow: hidden; position: relative; - @include verticalGradient($nonselected-gradient-color-top, mix($nonselected-gradient-color-top,$nonselected-gradient-color-bottom)); + @include verticalGradient($statusbar-gradient-top, $statusbar-gradient-bottom); #speed-info { @@ -909,7 +912,7 @@ div.torrent_footer width: 100%; z-index: 3; - @include verticalGradient($nonselected-gradient-color-top, mix($nonselected-gradient-color-top,$nonselected-gradient-color-bottom)); + @include verticalGradient($statusbar-gradient-top, $statusbar-gradient-bottom); > * { float: left; diff --git a/web/style/transmission/mobile.css b/web/style/transmission/mobile.css index cd319b25e..58aa17e71 100644 --- a/web/style/transmission/mobile.css +++ b/web/style/transmission/mobile.css @@ -38,7 +38,7 @@ div#toolbar > *.disabled { opacity: 0.25; } **** STATUSBAR **** ***/ -#statusbar { height: 24px; width: 100%; border-bottom: 1px solid #AAA; overflow: hidden; position: relative; background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(#dddddd)); background-image: -webkit-linear-gradient(top, white, #dddddd); background-image: -moz-linear-gradient(top, white, #dddddd); background-image: -ms-linear-gradient(top, white, #dddddd); background-image: -o-linear-gradient(top, white, #dddddd); background-image: linear-gradient(top, white, #dddddd); } +#statusbar { height: 24px; width: 100%; border-bottom: 1px solid #AAA; overflow: hidden; position: relative; background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, from(#dddddd), to(white)); background-image: -webkit-linear-gradient(top, #dddddd, white); background-image: -moz-linear-gradient(top, #dddddd, white); background-image: -ms-linear-gradient(top, #dddddd, white); background-image: -o-linear-gradient(top, #dddddd, white); background-image: linear-gradient(top, #dddddd, white); } #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; } @@ -204,7 +204,7 @@ div.file-priority-radiobox > div.high:active, div.file-priority-radiobox > div.h ***** MAIN WINDOW FOOTER ***** ****/ -div.torrent_footer { height: 22px; border-top: 1px solid #555; position: relative; width: 100%; z-index: 3; background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(#dddddd)); background-image: -webkit-linear-gradient(top, white, #dddddd); background-image: -moz-linear-gradient(top, white, #dddddd); background-image: -ms-linear-gradient(top, white, #dddddd); background-image: -o-linear-gradient(top, white, #dddddd); background-image: linear-gradient(top, white, #dddddd); } +div.torrent_footer { height: 22px; border-top: 1px solid #555; position: relative; width: 100%; z-index: 3; background-color: #eeeeee; background-image: -webkit-gradient(linear, left top, left bottom, from(#dddddd), to(white)); background-image: -webkit-linear-gradient(top, #dddddd, white); background-image: -moz-linear-gradient(top, #dddddd, white); background-image: -ms-linear-gradient(top, #dddddd, white); background-image: -o-linear-gradient(top, #dddddd, white); background-image: linear-gradient(top, #dddddd, white); } 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 #prefs-button { -moz-border-radius: 5px; border-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; float: right; } diff --git a/web/style/transmission/mobile.scss b/web/style/transmission/mobile.scss index e9414c2f8..ca6a89551 100644 --- a/web/style/transmission/mobile.scss +++ b/web/style/transmission/mobile.scss @@ -182,6 +182,9 @@ div#toolbar **** ***/ +$statusbar-gradient-top: #ddd; +$statusbar-gradient-bottom: #fff; + #statusbar { height: 24px; @@ -189,7 +192,7 @@ div#toolbar border-bottom: 1px solid #AAA; overflow: hidden; position: relative; - @include verticalGradient($nonselected-gradient-color-top, mix($nonselected-gradient-color-top,$nonselected-gradient-color-bottom)); + @include verticalGradient($statusbar-gradient-top, $statusbar-gradient-bottom); #speed-info { @@ -823,7 +826,7 @@ div.torrent_footer width: 100%; z-index: 3; - @include verticalGradient($nonselected-gradient-color-top, mix($nonselected-gradient-color-top,$nonselected-gradient-color-bottom)); + @include verticalGradient($statusbar-gradient-top, $statusbar-gradient-bottom); > * { @include button; -- 2.40.0