From 98baca79271576c473c179e0126c801e39b7f7ec Mon Sep 17 00:00:00 2001
From: Mister Rajoy <danielarezdiaz@gmail.com>
Date: Tue, 1 Dec 2020 11:55:29 +0100
Subject: [PATCH 1/3] Fix JSON syntax

---
 skins-3.0.json | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/skins-3.0.json b/skins-3.0.json
index d836199..794928b 100644
--- a/skins-3.0.json
+++ b/skins-3.0.json
@@ -97,25 +97,25 @@
         "type": "checkBox",
         "name": "Sea Gradient",
         "description": "changes the Jellyfin themed Hover gradient",
-        "css": "@import url('https://prayag17.github.io/JellySkin/seaGradient.css');",
+        "css": "@import url('https://prayag17.github.io/JellySkin/seaGradient.css');"
       },
       {
         "type": "checkBox",
         "name": "Sunset Gradient",
         "description": "changes the Jellyfin themed Hover gradient",
-        "css": "@import url('https://prayag17.github.io/JellySkin/sunsetGradient.css');",
+        "css": "@import url('https://prayag17.github.io/JellySkin/sunsetGradient.css');"
       },
       {
         "type": "checkBox",
         "name": "Night Sky Gradient",
         "description": "changes the Jellyfin themed Hover gradient",
-        "css": "@import url('https://prayag17.github.io/JellySkin/nightSkyGradient.css');",
+        "css": "@import url('https://prayag17.github.io/JellySkin/nightSkyGradient.css');"
       },
       {
         "type": "checkBox",
         "name": "Morning Gradient",
         "description": "changes the Jellyfin themed Hover gradient",
-        "css": "@import url('https://prayag17.github.io/JellySkin/morningGradient.css');",
+        "css": "@import url('https://prayag17.github.io/JellySkin/morningGradient.css');"
       }
     ]
   },
@@ -251,4 +251,3 @@
     ]
   }
 ]
-]

From 3002c1defbe6bc9acd56fd0da89418d09d18df97 Mon Sep 17 00:00:00 2001
From: Mister Rajoy <danielarezdiaz@gmail.com>
Date: Tue, 1 Dec 2020 16:08:16 +0100
Subject: [PATCH 2/3] Fix compile errors

---
 .../Configuration/configurationpage.html      | 22 +++----------------
 1 file changed, 3 insertions(+), 19 deletions(-)

diff --git a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html
index 32d3c81..0060fbf 100644
--- a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html
+++ b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html
@@ -127,6 +127,7 @@
           html+= '<option data-css= "'+css + '"value='+name+'>'+ name +'</option>'
         })
         return html;
+      }
         function getSlider(option){
           var html = "";
           var id = "slider" ;
@@ -255,24 +256,7 @@
       return false;
     });
     </script>
-    <style>
-    .color2{
-      display: block;
-      margin: 0;
-      margin-bottom: 0 !important;
-      font-family: inherit;
-      font-weight: inherit;
-      padding: 0.4em 0.25em;
-      /* must the 16px or larger to prevent iOS page zoom on focus */
-      font-size: 110%;
-      /* prevent padding from causing width overflow */
-      -webkit-box-sizing: border-box;
-      box-sizing: border-box;
-      outline: none !important;
-      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-      width: 100%;
-    }
-    </style>
+    
     </div>
 </body>
-</html>
+</html>
\ No newline at end of file

From c35e9621c9fa77c66affbbe5c4df37d1db8e2098 Mon Sep 17 00:00:00 2001
From: Mister Rajoy <danielarezdiaz@gmail.com>
Date: Wed, 2 Dec 2020 14:17:34 +0100
Subject: [PATCH 3/3] Fix selected option recognition

---
 .../Configuration/configurationpage.html      | 22 ++++++++-----------
 1 file changed, 9 insertions(+), 13 deletions(-)

diff --git a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html
index 0060fbf..3cc9429 100644
--- a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html
+++ b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html
@@ -54,6 +54,7 @@
         cssOptions.appendChild(opt);
       });
       updateSelectors()
+    }
 
     function loadOptions(options){
       var page = $.mobile.activePage;
@@ -117,7 +118,8 @@
       var description = option.description;                           
       //html += '<label for=number><input is="emby-input" type=number value=' + defaultValue + ' class = "number" data-css = "'+ css+ '" +  data-mini="true" id="' + id + '" name="' + id + '" data-name="' + name + '" ' + ' /><span>' + name  + '</span></label><br>';
       html += '<div class="selectContainer"><select is="emby-select"  data-css= "'+css + '"class="selector" label="'+name+'">' + getOptions(option)+'</select></div>'
-      return html
+      return html;
+    }
       function getOptions(option){
         var html = "";
         var selections = option.selections
@@ -139,15 +141,7 @@
           html += '<div class="inputContainer"><input is="emby-slider" type="range" class = "slider" value=' + defaultValue + ' step=' + step + ' data-css = "'+ css+ '"  id="' + id + '" name="' + id + '"  min="0" max="300" label="'+name +'" /><div class="fieldDescription">'+description+'</div></div>'
           return html
         }             
-        function updateDescription( ){
-          var description = document.getElementById("description");
-          var selected = $('#cssOptions').val();
-          data.forEach(element => {          
-            if(element.defaultCss == selected){
-              description.innerHTML=element.description;
-            }                                               
-          })           
-        }
+        
         function createCss(){
           var savedHtml = "";
           //process checkbox
@@ -198,11 +192,13 @@
           return css;       
         }
         function updateSelectors(){
-          var selected = $('#cssOptions').val();
+          var selected = document.getElementById("cssOptions");
+          var description = document.getElementById("description");
           data.forEach(element=>{
-            if(element.defaultCss == selected){
+            if(element.name == selected.selectedOptions[0].innerText){
               loadOptions(element.options);
-              updateDescription();
+              description.innerHTML=element.description;
+              
             }    
           })
         }