diff --git a/UI/Content/base.less b/UI/Content/base.less index 87c3d8914..ade0bb39f 100644 --- a/UI/Content/base.less +++ b/UI/Content/base.less @@ -93,3 +93,8 @@ font-size : 56px; color : white; } + +.label-large { + padding: 4px 6px; + font-size: 16px; +} \ No newline at end of file diff --git a/UI/JsLibraries/jquery.knob.js b/UI/JsLibraries/jquery.knob.js index 51b8629c5..a657773d4 100644 --- a/UI/JsLibraries/jquery.knob.js +++ b/UI/JsLibraries/jquery.knob.js @@ -475,6 +475,7 @@ ) return; s.val(v); + s.$.trigger('change', v); } , kval, to, m = 1, kv = {37:-s.o.step, 38:s.o.step, 39:s.o.step, 40:-s.o.step}; diff --git a/UI/Settings/Misc/MiscTemplate.html b/UI/Settings/Misc/MiscTemplate.html index 7f071b3f3..91bd1cfba 100644 --- a/UI/Settings/Misc/MiscTemplate.html +++ b/UI/Settings/Misc/MiscTemplate.html @@ -1,5 +1,5 @@ 
- General + Misc
@@ -49,9 +49,9 @@
- + - Newline-delimited set of rules in the form of +|-: + Newline-delimited set of rules
diff --git a/UI/Settings/Quality/Size/QualitySizeTemplate.html b/UI/Settings/Quality/Size/QualitySizeTemplate.html index f96c240a4..f84c7cb13 100644 --- a/UI/Settings/Quality/Size/QualitySizeTemplate.html +++ b/UI/Settings/Quality/Size/QualitySizeTemplate.html @@ -1,8 +1,20 @@ 

{{name}}

+
+
+ + +
+
+ + +
+
-
30 minute limit: MB
-
60 minute limit: MB
\ No newline at end of file diff --git a/UI/Settings/Quality/Size/QualitySizeView.js b/UI/Settings/Quality/Size/QualitySizeView.js index 7c2de6267..1b557ff3c 100644 --- a/UI/Settings/Quality/Size/QualitySizeView.js +++ b/UI/Settings/Quality/Size/QualitySizeView.js @@ -8,33 +8,33 @@ define(['marionette', 'Mixins/AsModelBoundView', 'jquery.knob'], function (Mario ui: { knob : '.x-knob', - thirtyMinuteSize: '.thirty-minute-size', - sixtyMinuteSize : '.sixty-minute-size' + thirtyMinuteSize: '.x-size-thirty', + sixtyMinuteSize : '.x-size-sixty' }, events: { - 'change .x-knob': '_changeMaxSize' +// 'change .x-knob': '_changeMaxSize' }, initialize: function (options) { this.qualityProfileCollection = options.qualityProfiles; + this.model.on('change:maxSize', this._changeMaxSize, this) }, onRender: function () { this.ui.knob.knob({ - min : 0, - max : 200, - step : 10, - cursor : 25, - width : 100, - stopper : true + min : 0, + max : 200, + step : 10, + cursor : 25, + width : 150, + stopper : true, + displayInput : false }); }, - _changeMaxSize: function (e, value) { - this.model.set({ - maxSize: value - }); + _changeMaxSize: function (e) { + var value = this.model.get('maxSize'); this.ui.thirtyMinuteSize.html(value * 30); this.ui.sixtyMinuteSize.html(value * 60); diff --git a/UI/Settings/Quality/quality.less b/UI/Settings/Quality/quality.less index c80a17c88..82083df23 100644 --- a/UI/Settings/Quality/quality.less +++ b/UI/Settings/Quality/quality.less @@ -32,17 +32,18 @@ .quality-size-item { .card; + text-align: center; width: 200px; - height: 200px; + height: 220px; padding: 10px 15px; h3 { margin-top: 0px; - text-align: center; } .size { + position: relative; height: 100px; margin: 10px; text-align: center; @@ -52,8 +53,14 @@ box-shadow: none; } - .size-value { - text-align: center; + .size-value-wrapper { + position: absolute; + top: 50px; + width: 100%; + + div { + margin-top: 2px; + } } }