From 28efb7c4ec4b3dd71b472938fe6b9cd4598545a9 Mon Sep 17 00:00:00 2001
From: Mark McDowall <markus.mcd5@gmail.com>
Date: Thu, 7 Mar 2013 00:22:16 -0800
Subject: [PATCH] Quality size styling

---
 NzbDrone.Backbone/Content/bootstrap.slider.css | 16 ++++++++--------
 NzbDrone.Backbone/Content/form.css             | 18 +-----------------
 NzbDrone.Backbone/Content/settings.quality.css |  3 +++
 NzbDrone.Backbone/Index.html                   |  1 +
 .../Settings/Quality/QualitySizeTemplate.html  |  3 +--
 .../Settings/Quality/QualitySizeView.js        |  1 +
 6 files changed, 15 insertions(+), 27 deletions(-)
 create mode 100644 NzbDrone.Backbone/Content/settings.quality.css

diff --git a/NzbDrone.Backbone/Content/bootstrap.slider.css b/NzbDrone.Backbone/Content/bootstrap.slider.css
index b527aa868..caa9de030 100644
--- a/NzbDrone.Backbone/Content/bootstrap.slider.css
+++ b/NzbDrone.Backbone/Content/bootstrap.slider.css
@@ -92,12 +92,12 @@
 }
 .slider-selection {
   position: absolute;
-  background-color: #f7f7f7;
-  background-image: -moz-linear-gradient(top, #f9f9f9, #f5f5f5);
-  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f9f9f9), to(#f5f5f5));
-  background-image: -webkit-linear-gradient(top, #f9f9f9, #f5f5f5);
-  background-image: -o-linear-gradient(top, #f9f9f9, #f5f5f5);
-  background-image: linear-gradient(to bottom, #f9f9f9, #f5f5f5);
+  background-color: #bababa;
+  background-image: -moz-linear-gradient(top, #f9f9f9, #bababa);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f9f9f9), to(#bababa));
+  background-image: -webkit-linear-gradient(top, #f9f9f9, #bababa);
+  background-image: -o-linear-gradient(top, #f9f9f9, #bababa);
+  background-image: linear-gradient(to bottom, #f9f9f9, #bababa);
   background-repeat: repeat-x;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff9f9f9', endColorstr='#fff5f5f5', GradientType=0);
   -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
@@ -114,7 +114,7 @@
   position: absolute;
   width: 20px;
   height: 20px;
-  background-color: #0e90d2;
+  background-color: #3a87ad;
   background-image: -moz-linear-gradient(top, #149bdf, #0480be);
   background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#149bdf), to(#0480be));
   background-image: -webkit-linear-gradient(top, #149bdf, #0480be);
@@ -125,7 +125,7 @@
   -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
   -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
   box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
-  opacity: 0.8;
+  /*opacity: 0.8;*/
   border: 0px solid transparent;
 }
 .slider-handle.round {
diff --git a/NzbDrone.Backbone/Content/form.css b/NzbDrone.Backbone/Content/form.css
index 064a0368c..7c2750c51 100644
--- a/NzbDrone.Backbone/Content/form.css
+++ b/NzbDrone.Backbone/Content/form.css
@@ -12,20 +12,4 @@
 
 .switch {
     float: left;
-}
-
-/*.control-group {*/
-    /*border: 1px solid red;*/
-/*}*/
-
-/*.control-label {*/
-    /*border: 1px solid yellow;*/
-/*}*/
-
-/*.switch {*/
-    /*border: 1px solid purple;*/
-/*}*/
-
-/*.help-inline, .help-checkbox {*/
-    /*border: 1px solid #2e8b57;*/
-/*}*/
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/NzbDrone.Backbone/Content/settings.quality.css b/NzbDrone.Backbone/Content/settings.quality.css
new file mode 100644
index 000000000..98a764cfb
--- /dev/null
+++ b/NzbDrone.Backbone/Content/settings.quality.css
@@ -0,0 +1,3 @@
+.quality-size-item {
+    padding-left: 10px;
+}
\ No newline at end of file
diff --git a/NzbDrone.Backbone/Index.html b/NzbDrone.Backbone/Index.html
index 13a28fb7f..fa06da107 100644
--- a/NzbDrone.Backbone/Index.html
+++ b/NzbDrone.Backbone/Index.html
@@ -20,6 +20,7 @@
     <link href="/static/AddSeries/addseries.css" rel='stylesheet' type='text/css' />
     <link href="/static/content/menu.css" rel='stylesheet' type='text/css' />
     <link href="/static/content/form.css" rel='stylesheet' type='text/css' />
+    <link href="/static/content/settings.quality.css" rel='stylesheet' type='text/css' />
 </head>
 <script type="text/html" id="notification-template">
     <div class="alert alert-{{level}}">
diff --git a/NzbDrone.Backbone/Settings/Quality/QualitySizeTemplate.html b/NzbDrone.Backbone/Settings/Quality/QualitySizeTemplate.html
index f396bc742..e2c0424e5 100644
--- a/NzbDrone.Backbone/Settings/Quality/QualitySizeTemplate.html
+++ b/NzbDrone.Backbone/Settings/Quality/QualitySizeTemplate.html
@@ -1,6 +1,5 @@
 <b>{{name}}</b>
-<div>
+<div class="quality-slider-container">
     <input type="text" class="span4 slider" />
-    <input type="hidden" class="slider-value" name="maxSize" />
 </div>
 30 minute size: <span name="thirtyMinuteSize" class="thirty-minute-size"></span>MB | 60 minute size: <span name="sixtyMinuteSize" class="sixty-minute-size"></span>MB
\ No newline at end of file
diff --git a/NzbDrone.Backbone/Settings/Quality/QualitySizeView.js b/NzbDrone.Backbone/Settings/Quality/QualitySizeView.js
index d6d922305..7639b74a6 100644
--- a/NzbDrone.Backbone/Settings/Quality/QualitySizeView.js
+++ b/NzbDrone.Backbone/Settings/Quality/QualitySizeView.js
@@ -8,6 +8,7 @@ define([
 
     NzbDrone.Settings.Quality.QualitySizeView = Backbone.Marionette.ItemView.extend({
         template: 'Settings/Quality/QualitySizeTemplate',
+        className: 'quality-size-item',
 
         ui: {
             slider: '.slider',