From e3f9030463cf1964ce22a32d41d3374e3b2a322c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Louis=20V=C3=A9zina?=
 <5130500+morpheus65535@users.noreply.github.com>
Date: Fri, 19 Jun 2020 11:43:36 -0400
Subject: [PATCH] Fix for slider tooltip overlapping other content.

---
 views/_main.html             | 13 ++++++++++---
 views/settingsradarr.html    |  1 +
 views/settingssonarr.html    |  1 +
 views/settingssubtitles.html |  9 +++++++--
 4 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/views/_main.html b/views/_main.html
index c043b5532..9b92b5aff 100644
--- a/views/_main.html
+++ b/views/_main.html
@@ -72,6 +72,10 @@
             .restart {
                 color: orange;
             }
+
+            .slider_span {
+                margin-left: 1em;
+            }
         </style>
     {% endblock head %}
 
@@ -346,9 +350,12 @@
                 $('[data-toggle="tooltip"]').tooltip({html: true});
             });
 
-            $(".slider").slider({
-                tooltip: 'always',
-                tooltip_position: 'bottom'
+            $(".slider").slider();
+            $(".slider").on("slide", function(slideEvt) {
+                $(this).next("span").text(slideEvt.value);
+            });
+            $(".slider").each(function() {
+                $(this).next("span").text($(this).val());
             });
 
             events = io.connect({
diff --git a/views/settingsradarr.html b/views/settingsradarr.html
index c518cf6c3..fc64adc08 100644
--- a/views/settingsradarr.html
+++ b/views/settingsradarr.html
@@ -114,6 +114,7 @@
                     </div>
                     <div class="col-sm-8">
                         <input class="slider" id="settings-general-minimum_score_movie" name="settings-general-minimum_score_movie" data-slider-id='settings-general-minimum_score_movie' type="text" data-slider-min="1" data-slider-max="100" data-slider-step="1" data-slider-value="{{settings.general.minimum_score_movie}}"/>
+                        <span class="slider_span"></span>
                     </div>
                 </div>
                 <div class="row">
diff --git a/views/settingssonarr.html b/views/settingssonarr.html
index bfb0fd7ad..72ddc94e3 100644
--- a/views/settingssonarr.html
+++ b/views/settingssonarr.html
@@ -114,6 +114,7 @@
                     </div>
                     <div class="col-sm-8">
                         <input class="slider" id="settings-general-minimum_score" name="settings-general-minimum_score" data-slider-id='settings-general-minimum_score' type="text" data-slider-min="1" data-slider-max="100" data-slider-step="1" data-slider-value="{{settings.general.minimum_score}}"/>
+                        <span class="slider_span"></span>
                     </div>
                 </div>
                 <div class="row">
diff --git a/views/settingssubtitles.html b/views/settingssubtitles.html
index 311cc6928..7ab3b805b 100644
--- a/views/settingssubtitles.html
+++ b/views/settingssubtitles.html
@@ -79,6 +79,7 @@
                     </div>
                     <div class="col-sm-4">
                         <input class="slider" id="settings-general-days_to_upgrade_subs" name="settings-general-days_to_upgrade_subs" data-slider-id='settings-general-days_to_upgrade_subs' type="text" data-slider-min="0" data-slider-max="30" data-slider-step="1" data-slider-value="{{settings.general.days_to_upgrade_subs}}"/>
+                        <span class="slider_span"></span>
                     </div>
                 </div>
                 <br>
@@ -313,8 +314,9 @@
                     <div class="col-sm-5 text-right">
                         <b>Only for score below</b>
                     </div>
-                    <div class="col-sm-1">
+                    <div class="col-sm-4">
                         <input class="slider" id="settings-subsync-subsync_threshold" name="settings-subsync-subsync_threshold" data-slider-id='settings-subsync-subsync_threshold' type="text" data-slider-min="1" data-slider-max="100" data-slider-step="1" data-slider-value="{{settings.subsync.subsync_threshold}}"/>
+                        <span class="slider_span"></span>
                     </div>
                 </div>
                 <br>
@@ -334,8 +336,9 @@
                     <div class="col-sm-5 text-right">
                         <b>Only for score below</b>
                     </div>
-                    <div class="col-sm-1">
+                    <div class="col-sm-4">
                         <input class="slider" id="settings-subsync-subsync_movie_threshold" name="settings-subsync-subsync_movie_threshold" data-slider-id='settings-subsync-subsync_movie_threshold' type="text" data-slider-min="1" data-slider-max="100" data-slider-step="1" data-slider-value="{{settings.subsync.subsync_movie_threshold}}"/>
+                        <span class="slider_span"></span>
                     </div>
                 </div>
                 <br>
@@ -375,6 +378,7 @@
                     </div>
                     <div class="col-sm-4">
                         <input class="slider" id="settings-general-postprocessing_threshold" name="settings-general-postprocessing_threshold" data-slider-id='settings-general-postprocessing_threshold' type="text" data-slider-min="1" data-slider-max="100" data-slider-step="1" data-slider-value="{{settings.general.postprocessing_threshold}}"/>
+                        <span class="slider_span"></span>
                     </div>
                 </div>
                 <br>
@@ -399,6 +403,7 @@
                     </div>
                     <div class="col-sm-4">
                         <input class="slider" id="settings-general-postprocessing_threshold_movie" name="settings-general-postprocessing_threshold_movie" data-slider-id='settings-general-postprocessing_threshold_movie' type="text" data-slider-min="1" data-slider-max="100" data-slider-step="1" data-slider-value="{{settings.general.postprocessing_threshold_movie}}"/>
+                        <span class="slider_span"></span>
                     </div>
                 </div>
                 <br>