From 5b2fc436b3ac663ba4eafcd41faa8b270854f0c0 Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Fri, 25 Dec 2020 14:56:19 +0530 Subject: [PATCH 1/6] add color selector css --- .../Configuration/configurationpage.html | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html index 763ca1f..359b93b 100644 --- a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html +++ b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html @@ -514,6 +514,12 @@ .tooltip:hover .tooltiptext { visibility: visible; } + input#favcolor { + width: 100%; + height: 3em !important; + background: none; + border: none; +} From 000e6293781939bf133588cfe15d75553186b9f6 Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Fri, 25 Dec 2020 14:58:09 +0530 Subject: [PATCH 2/6] change the info icon --- .../Configuration/configurationpage.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html index 359b93b..dc32f95 100644 --- a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html +++ b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html @@ -209,7 +209,7 @@ return ""; } html =""; - html += '
🛈' + html += '
info' html += ''; html += '
' return html; From c68e663b619aa3ccf08811b3cef047d14511e0b0 Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Sat, 26 Dec 2020 20:56:23 +0530 Subject: [PATCH 3/6] Change the selectors to Array like objects --- .../Configuration/configurationpage.html | 82 ++++++++----------- 1 file changed, 35 insertions(+), 47 deletions(-) diff --git a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html index d028a04..e4a8bbd 100644 --- a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html +++ b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html @@ -382,48 +382,43 @@ Dashboard.processPluginConfigurationUpdateResult(res);}); }); } - function getValue(option){ - var result = ""; - switch(option.type){ - - case "checkBox": - document.getElementsByClassName("checkbox emby-checkbox").forEach(element =>{ - if(option.css == element.getAttribute("data-css")){ - result = element.checked?"true":"false"; - - } - }) - - case "number": - document.getElementsByClassName("number emby-input").forEach(element =>{ - if(option.css == element.getAttribute("data-css")){ - result = element.value; - } - }) - case "colorPicker": - document.getElementsByClassName("color").forEach(element =>{ - if(option.css == element.getAttribute("data-css")){ - result = element.value; - } - }) - case "slider": - document.getElementsByClassName("slider").forEach(element =>{ - if(option.css == element.getAttribute("data-css")){ - result = element.value; - } - }) - case "selector": - document.getElementsByClassName("selector emby-select-withcolor emby-select").forEach(element =>{ - if(option.css == element.getAttribute("data-css")){ - result = element.selectedOptions[0].innerText;; - } - }) - - } - return result; - } + var result = ""; + switch(option.type){ + case "checkBox": + Array.from(document.getElementsByClassName("checkbox emby-checkbox")).forEach(element =>{ + if(option.css == element.getAttribute("data-css")){ + result = element.checked?"true":"false"; + } + }) + case "number": + Array.from(document.getElementsByClassName("number emby-input")).forEach(element =>{ + if(option.css == element.getAttribute("data-css")){ + result = element.value; + } + }) + case "colorPicker": + Array.from(document.getElementsByClassName("color")).forEach(element =>{ + if(option.css == element.getAttribute("data-css")){ + result = element.value; + } + }) + case "slider": + Array.from(document.getElementsByClassName("slider")).forEach(element =>{ + if(option.css == element.getAttribute("data-css")){ + result = element.value; + } + }) + case "selector": + Array.from(document.getElementsByClassName("selector emby-select-withcolor emby-select")).forEach(element =>{ + if(option.css == element.getAttribute("data-css")){ + result = element.selectedOptions[0].innerText;; + } + }) + } + return result; + } function checkEasterEggs(){ var d = new Date(); @@ -441,14 +436,7 @@ maxSize: 25 }); }); - } - - - - - - function setSkin() { saveConfig() ApiClient.getServerConfiguration().then(function (config) { From 28f2244e97d7ba61f07b91cdb4afdd160e5365f8 Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Sat, 26 Dec 2020 21:16:27 +0530 Subject: [PATCH 4/6] Update skins-3.0.json --- skins-3.0.json | 11 ++++------- 1 file changed, 4 insertions(+), 7 deletions(-) diff --git a/skins-3.0.json b/skins-3.0.json index 30e38e8..6475623 100644 --- a/skins-3.0.json +++ b/skins-3.0.json @@ -309,7 +309,8 @@ "name": "Accent color", "description": "Choose a custom accent color to use with the theme.", "css": ".countIndicator {background: rgba($,0.8);}.playedIndicator, .innerCardFooter /*Accenting*/.button-flat:hover {background: rgba($,0.25);}.paper-icon-button-light:hover { background-color: rgba($,0.25) !important;}.subtitleappearance-preview { background: linear-gradient(140deg,rgba($),#111) !important;}.navMenuOption-selected, .selectionCommandsPanel { background: rgba($, 0.8) !important;}.raised,.fab,a[data-role='button'] { background: rgba($, 0.8) !important;transition: all 0.2s !important;} /*Glow accent*/ .raised.homeLibraryButton {box-shadow: 0px 0px 5px rgba($, 0) !important; border: solid 1px rgba($,0) !important;}.cardOverlayContainer:hover,.dialog,..raised.homeLibraryButton:hover { box-shadow: 0px 0px 5px rgb($) !important; border: solid 1px rgba($,0.6) !important;}.cardOverlayContainer { border: solid 1px rgba($,0.0) !important;}" - }, + "default": "#303030" + }, { "type": "colorPicker", "mode": "hex", @@ -341,7 +342,7 @@ "name": "Custom Background Color", "description": "Change background color.", "css": ".backgroundContainer, .dialog, html { background-color: $;}", - "default": "#000000" + "default": "rgba(0,0,0,.86)" } ] }, @@ -356,17 +357,13 @@ "css": ".headerRight { color: $; }", "default": "#ffffff" }, - { - "type": "section", - "name": "Buttons" - }, { "type": "colorPicker", "mode": "hex", "name": "Interact Buttons Color", "description": "This modifies the color of interact buttons.", "css": ".paper-icon-button-light { color: $ !important; } .paper-icon-button-light:hover:not(:disabled) { color:$ !important; background-color: $ !important; } .paper-icon-button-light:focus:not(:disabled) { color:$ !important; background-color: $ !important; }", - "default": "#00a4dc", + "default": "#ffffff", "preview": "https://github.com/LambadaCorez/custom_css_jellyfin/blob/master/ui/buttons/colored_interact_buttons/colored_buttons_example3.png?raw=true" }, { From 9c0429fcebdfd87b2616b3666e2707e39448b4fb Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Sat, 26 Dec 2020 21:20:02 +0530 Subject: [PATCH 5/6] Fix Syntax --- skins-3.0.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/skins-3.0.json b/skins-3.0.json index 6475623..e4d7607 100644 --- a/skins-3.0.json +++ b/skins-3.0.json @@ -308,7 +308,7 @@ "mode": "rgba", "name": "Accent color", "description": "Choose a custom accent color to use with the theme.", - "css": ".countIndicator {background: rgba($,0.8);}.playedIndicator, .innerCardFooter /*Accenting*/.button-flat:hover {background: rgba($,0.25);}.paper-icon-button-light:hover { background-color: rgba($,0.25) !important;}.subtitleappearance-preview { background: linear-gradient(140deg,rgba($),#111) !important;}.navMenuOption-selected, .selectionCommandsPanel { background: rgba($, 0.8) !important;}.raised,.fab,a[data-role='button'] { background: rgba($, 0.8) !important;transition: all 0.2s !important;} /*Glow accent*/ .raised.homeLibraryButton {box-shadow: 0px 0px 5px rgba($, 0) !important; border: solid 1px rgba($,0) !important;}.cardOverlayContainer:hover,.dialog,..raised.homeLibraryButton:hover { box-shadow: 0px 0px 5px rgb($) !important; border: solid 1px rgba($,0.6) !important;}.cardOverlayContainer { border: solid 1px rgba($,0.0) !important;}" + "css": ".countIndicator {background: rgba($,0.8);}.playedIndicator, .innerCardFooter /*Accenting*/.button-flat:hover {background: rgba($,0.25);}.paper-icon-button-light:hover { background-color: rgba($,0.25) !important;}.subtitleappearance-preview { background: linear-gradient(140deg,rgba($),#111) !important;}.navMenuOption-selected, .selectionCommandsPanel { background: rgba($, 0.8) !important;}.raised,.fab,a[data-role='button'] { background: rgba($, 0.8) !important;transition: all 0.2s !important;} /*Glow accent*/ .raised.homeLibraryButton {box-shadow: 0px 0px 5px rgba($, 0) !important; border: solid 1px rgba($,0) !important;}.cardOverlayContainer:hover,.dialog,..raised.homeLibraryButton:hover { box-shadow: 0px 0px 5px rgb($) !important; border: solid 1px rgba($,0.6) !important;}.cardOverlayContainer { border: solid 1px rgba($,0.0) !important;}", "default": "#303030" }, { From 9a86e3c4eda537dc0b13f798f8f851c10868f930 Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Tue, 29 Dec 2020 21:47:01 +0530 Subject: [PATCH 6/6] Update help.html --- src/html/help.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/html/help.html b/src/html/help.html index 0b359ad..b2afe07 100644 --- a/src/html/help.html +++ b/src/html/help.html @@ -9,7 +9,7 @@