From b29b4d66b23cf0ddb325f17b5bcf7abc0c70107f Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Sat, 5 Dec 2020 21:46:28 +0530 Subject: [PATCH 1/9] Added links to Preview images --- skins-3.0.json | 36 ++++++++++++++++++++++++++++++------ 1 file changed, 30 insertions(+), 6 deletions(-) diff --git a/skins-3.0.json b/skins-3.0.json index 976b8e8..164bb4f 100644 --- a/skins-3.0.json +++ b/skins-3.0.json @@ -4,14 +4,22 @@ "author": "Jellyfin", "description": "Default, stock, Jellyfin.", "defaultCss": "", - "options": [] + "options": [], + "preview": [ + "home": "", + "title": "" + ] }, { "name": "JellyFlix", "author": "prayagprajapati17", "description": "A theme that aims to replicate the red and black look of Netflix. Theme is by prayag17.", "defaultCss": "@import url(https://prayag17.github.io/JellyFlix/default.css);", - "options": [] + "options": [], + "preview": [ + "home": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/Home.png?raw=true", + "title": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/TitlePage.png?raw=true" + ] }, { "name": "Monochromic", @@ -51,6 +59,10 @@ "css": "@import url('https://ctalvio.github.io/Monochromic/customcolor_style.css');:root {--accent: $;}", "default": "" } + ], + "preview": [ + "home": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true", + "title": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/2.png?raw=true" ] }, { @@ -85,6 +97,10 @@ "css": ":root {--accent: $;}", "default": "#6279cd" } + ], + "preview": [ + "home": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/6.png?raw=true", + "title": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/1.png?raw=true" ] }, { @@ -117,6 +133,10 @@ "description": "changes the Jellyfin themed Hover gradient", "css": "@import url('https://prayag17.github.io/JellySkin/morningGradient.css');" } + ], + "preview": [ + "home": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true", + "title": "https://github.com/prayag17/JellySkin/raw/master/Version%204/title%202.png?raw=true" ] }, { @@ -220,17 +240,21 @@ { "type": "number", "name": "Border Radius", - "description": ":root {--rounding: 0px;}.formDialogHeader {border-top-left-radius: var(--rounding);border-top-right-radius: var(--rounding);}.formDialogFooter {border-bottom-left-radius: var(--rounding);border-bottom-right-radius: var(--rounding);}.cardOverlayContainer {border-radius: var(--rounding) !important;}.toast,.paperList,.cardContent,.sessionNowPlayingInnerContent, .listItem:hover, .cardImage,.fab,.multiSelectCheckboxOutline,.itemSelectionPanel,.cardContent-button, .cardContent-shadow, .itemDetailImage, .cardOverlayButton-hover,.cardImageContainer,.cardPadder,.listItemImage,.listItemImageButton,.listItemButton,.headerButton,.paper-icon-button-light,.innerCardFooter,.blurhash-canvas,.actionSheetMenuItem:hover,.dialog,.listItemIcon,.listItem-border,.button-flat,.visualCardBox,.checkboxOutline,.emby-select-withcolor,.chapterThumbTextContainer,.chapterThumbContainer,.chapterThumb,.emby-input, .emby-textarea, .emby-select-withcolor,.cardOverlayButtonIcon,.subtitleappearance-preview.flex.align-items-center.justify-content-center {border-radius: var(--rounding) !important;}.osdPoster img {border-radius: var(--rounding); border: none;}.mdl-slider::-moz-range-thumb {border-radius: var(--rounding);}.mdl-slider::-ms-thumb {border-radius: var(--rounding);}.mdl-slider::-webkit-slider-thumb {border-radius: var(--rounding);}div[data-role='controlgroup'] a[data-role='button']:first-child {border-bottom-left-radius: var(--rounding);border-top-left-radius: var(--rounding);}div[data-role='controlgroup'] a[data-role='button']:last-child {border-bottom-right-radius: var(--rounding);border-top-right-radius: var(--rounding);}", - "css": "", + "description": "Change the roundness of text box and more default is zero", + "css": "@import url('https://prayag17.github.io/jellyfin-plugin-skin-manager/src/border-radius.css'); :root{--rounding: $px;}", "default":"0" }, { "type": "number", "name": "Backdrop Blur", "description": "adds blur to the backdrop images default is zero", - "css": ":root{--bgblur: blur($px)}.backdropImage {filter: var(--bgblur);}.backgroundContainer.withBackdrop {background-color: rgba(0,0,0,0);}", + "css": "@import url('https://prayag17.github.io/jellyfin-plugin-skin-manager/src/bgBlur.css'); :root{--bgblur: blur($px)}", "default": "0" } + ], + "preview": [ + "home": "", + "title": "" ] } -] \ No newline at end of file +] From cfeaaaff50e09cdb1a52a4faa50ef30ca5b7e3b7 Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Sun, 6 Dec 2020 21:26:52 +0530 Subject: [PATCH 2/9] Fixed my preview JSON Code --- skins-3.0.json | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/skins-3.0.json b/skins-3.0.json index 164bb4f..aaa5162 100644 --- a/skins-3.0.json +++ b/skins-3.0.json @@ -6,8 +6,10 @@ "defaultCss": "", "options": [], "preview": [ + { "home": "", "title": "" + } ] }, { @@ -17,8 +19,10 @@ "defaultCss": "@import url(https://prayag17.github.io/JellyFlix/default.css);", "options": [], "preview": [ + { "home": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/Home.png?raw=true", "title": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/TitlePage.png?raw=true" + } ] }, { @@ -61,8 +65,10 @@ } ], "preview": [ + { "home": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true", "title": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/2.png?raw=true" + } ] }, { @@ -99,8 +105,10 @@ } ], "preview": [ + { "home": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/6.png?raw=true", "title": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/1.png?raw=true" + } ] }, { @@ -135,8 +143,10 @@ } ], "preview": [ + { "home": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true", "title": "https://github.com/prayag17/JellySkin/raw/master/Version%204/title%202.png?raw=true" + } ] }, { From 86121c93e3489feada696dded71a3676f07dbabd Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Sun, 6 Dec 2020 21:28:03 +0530 Subject: [PATCH 3/9] Update skins-3.0.json --- skins-3.0.json | 2 ++ 1 file changed, 2 insertions(+) diff --git a/skins-3.0.json b/skins-3.0.json index aaa5162..3786edc 100644 --- a/skins-3.0.json +++ b/skins-3.0.json @@ -263,8 +263,10 @@ } ], "preview": [ + { "home": "", "title": "" + } ] } ] From dd7100a730c709c951de3e25b655dd4561d624c6 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sun, 6 Dec 2020 17:44:04 +0100 Subject: [PATCH 4/9] Fix JSON --- skins-3.0.json | 24 ++++++++++++------------ 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/skins-3.0.json b/skins-3.0.json index 3786edc..0c36fd3 100644 --- a/skins-3.0.json +++ b/skins-3.0.json @@ -5,12 +5,12 @@ "description": "Default, stock, Jellyfin.", "defaultCss": "", "options": [], - "preview": [ + "preview": { "home": "", "title": "" } - ] + }, { "name": "JellyFlix", @@ -18,12 +18,12 @@ "description": "A theme that aims to replicate the red and black look of Netflix. Theme is by prayag17.", "defaultCss": "@import url(https://prayag17.github.io/JellyFlix/default.css);", "options": [], - "preview": [ + "preview": { "home": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/Home.png?raw=true", "title": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/TitlePage.png?raw=true" } - ] + }, { "name": "Monochromic", @@ -64,12 +64,12 @@ "default": "" } ], - "preview": [ + "preview": { "home": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true", "title": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/2.png?raw=true" } - ] + }, { "name": "Kaleidochromic", @@ -104,12 +104,12 @@ "default": "#6279cd" } ], - "preview": [ + "preview": { "home": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/6.png?raw=true", "title": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/1.png?raw=true" } - ] + }, { "name": "JellySkin", @@ -142,12 +142,12 @@ "css": "@import url('https://prayag17.github.io/JellySkin/morningGradient.css');" } ], - "preview": [ + "preview": { "home": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true", "title": "https://github.com/prayag17/JellySkin/raw/master/Version%204/title%202.png?raw=true" } - ] + }, { "name": "Custom", @@ -262,11 +262,11 @@ "default": "0" } ], - "preview": [ + "preview": { "home": "", "title": "" } - ] + } ] From 76f5e3675bc00004021276786d837e7af4de6856 Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Tue, 8 Dec 2020 08:40:34 +0530 Subject: [PATCH 5/9] Update skins-3.0.json --- skins-3.0.json | 48 ++++++++++++++++++++++++++++++------------------ 1 file changed, 30 insertions(+), 18 deletions(-) diff --git a/skins-3.0.json b/skins-3.0.json index 0c36fd3..b2cc077 100644 --- a/skins-3.0.json +++ b/skins-3.0.json @@ -5,12 +5,14 @@ "description": "Default, stock, Jellyfin.", "defaultCss": "", "options": [], - "preview": + "preview": [ + { + "home": "" + }, { - "home": "", "title": "" } - + ] }, { "name": "JellyFlix", @@ -18,12 +20,14 @@ "description": "A theme that aims to replicate the red and black look of Netflix. Theme is by prayag17.", "defaultCss": "@import url(https://prayag17.github.io/JellyFlix/default.css);", "options": [], - "preview": + "preview": [ + { + "home": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/Home.png?raw=true" + }, { - "home": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/Home.png?raw=true", "title": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/TitlePage.png?raw=true" } - + ] }, { "name": "Monochromic", @@ -64,12 +68,14 @@ "default": "" } ], - "preview": + "preview": [ + { + "home": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true" + }, { - "home": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true", "title": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/2.png?raw=true" } - + ] }, { "name": "Kaleidochromic", @@ -104,12 +110,14 @@ "default": "#6279cd" } ], - "preview": + "preview": [ + { + "home": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/6.png?raw=true" + }, { - "home": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/6.png?raw=true", "title": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/1.png?raw=true" } - + ] }, { "name": "JellySkin", @@ -142,12 +150,14 @@ "css": "@import url('https://prayag17.github.io/JellySkin/morningGradient.css');" } ], - "preview": + "preview": [ + { + "home": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true" + }, { - "home": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true", "title": "https://github.com/prayag17/JellySkin/raw/master/Version%204/title%202.png?raw=true" } - + ] }, { "name": "Custom", @@ -262,11 +272,13 @@ "default": "0" } ], - "preview": + "preview": [ + { + "home": "" + }, { - "home": "", "title": "" } - + ] } ] From 34e0388afe2827fca5f1ff97774cc067fd63b2b7 Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Tue, 8 Dec 2020 08:57:24 +0530 Subject: [PATCH 6/9] Update skins-3.0.json --- skins-3.0.json | 29 ++++++----------------------- 1 file changed, 6 insertions(+), 23 deletions(-) diff --git a/skins-3.0.json b/skins-3.0.json index b2cc077..fd181be 100644 --- a/skins-3.0.json +++ b/skins-3.0.json @@ -5,14 +5,11 @@ "description": "Default, stock, Jellyfin.", "defaultCss": "", "options": [], - "preview": [ + "preview": { "home": "" - }, - { "title": "" } - ] }, { "name": "JellyFlix", @@ -20,14 +17,11 @@ "description": "A theme that aims to replicate the red and black look of Netflix. Theme is by prayag17.", "defaultCss": "@import url(https://prayag17.github.io/JellyFlix/default.css);", "options": [], - "preview": [ + "preview": { "home": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/Home.png?raw=true" - }, - { "title": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/TitlePage.png?raw=true" } - ] }, { "name": "Monochromic", @@ -68,14 +62,11 @@ "default": "" } ], - "preview": [ + "preview": { "home": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true" - }, - { "title": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/2.png?raw=true" } - ] }, { "name": "Kaleidochromic", @@ -110,11 +101,9 @@ "default": "#6279cd" } ], - "preview": [ + "preview": { "home": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/6.png?raw=true" - }, - { "title": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/1.png?raw=true" } ] @@ -150,14 +139,11 @@ "css": "@import url('https://prayag17.github.io/JellySkin/morningGradient.css');" } ], - "preview": [ + "preview": { "home": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true" - }, - { "title": "https://github.com/prayag17/JellySkin/raw/master/Version%204/title%202.png?raw=true" } - ] }, { "name": "Custom", @@ -272,13 +258,10 @@ "default": "0" } ], - "preview": [ + "preview": { "home": "" - }, - { "title": "" } - ] } ] From d951da15d959a9e3bb371a638f3090947a2715be Mon Sep 17 00:00:00 2001 From: Daniel Date: Tue, 8 Dec 2020 13:51:46 +0100 Subject: [PATCH 7/9] Update skins-3.0.json --- skins-3.0.json | 53 ++++++++++++++++++++++---------------------------- 1 file changed, 23 insertions(+), 30 deletions(-) diff --git a/skins-3.0.json b/skins-3.0.json index fd181be..8758150 100644 --- a/skins-3.0.json +++ b/skins-3.0.json @@ -5,11 +5,10 @@ "description": "Default, stock, Jellyfin.", "defaultCss": "", "options": [], - "preview": - { - "home": "" + "preview": { + "home": "", "title": "" - } + } }, { "name": "JellyFlix", @@ -17,11 +16,10 @@ "description": "A theme that aims to replicate the red and black look of Netflix. Theme is by prayag17.", "defaultCss": "@import url(https://prayag17.github.io/JellyFlix/default.css);", "options": [], - "preview": - { - "home": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/Home.png?raw=true" + "preview": { + "home": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/Home.png?raw=true", "title": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/TitlePage.png?raw=true" - } + } }, { "name": "Monochromic", @@ -62,11 +60,10 @@ "default": "" } ], - "preview": - { - "home": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true" + "preview": { + "home": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true", "title": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/2.png?raw=true" - } + } }, { "name": "Kaleidochromic", @@ -101,12 +98,10 @@ "default": "#6279cd" } ], - "preview": - { - "home": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/6.png?raw=true" + "preview": { + "home": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/6.png?raw=true", "title": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/1.png?raw=true" - } - ] + } }, { "name": "JellySkin", @@ -139,11 +134,10 @@ "css": "@import url('https://prayag17.github.io/JellySkin/morningGradient.css');" } ], - "preview": - { - "home": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true" + "preview": { + "home": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true", "title": "https://github.com/prayag17/JellySkin/raw/master/Version%204/title%202.png?raw=true" - } + } }, { "name": "Custom", @@ -151,7 +145,7 @@ "description": "customize the look of jellyfin by your needs", "defaultCss": "", "options": [ - { + { "type": "selector", "name": "Change Font", "description": "Change the default fonts", @@ -202,7 +196,7 @@ }, { "type": "colorPicker", - "mode":"rgba", + "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;\ttransition: 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;}" @@ -213,7 +207,7 @@ "name": "Console Panel Color", "description": "Modifies the color of the left menu panel.", "css": ".mainDrawer-scrollContainer { color: $; }", - "default":"#ffffff" + "default": "#ffffff" }, { "type": "checkBox", @@ -241,14 +235,14 @@ "name": "Right Header Color", "description": "This modifies the colors of the cast, search and user buttons in the top right.", "css": ".headerRight { color: $; }", - "default":"#ffffff" + "default": "#ffffff" }, { "type": "number", "name": "Border Radius", "description": "Change the roundness of text box and more default is zero", "css": "@import url('https://prayag17.github.io/jellyfin-plugin-skin-manager/src/border-radius.css'); :root{--rounding: $px;}", - "default":"0" + "default": "0" }, { "type": "number", @@ -258,10 +252,9 @@ "default": "0" } ], - "preview": - { - "home": "" + "preview": { + "home": "", "title": "" - } + } } ] From 5e8c3e00d6b3adade13c3591ee79cb2b6e93c8a4 Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Fri, 11 Dec 2020 19:04:17 +0530 Subject: [PATCH 8/9] Add image links --- skins-3.0.json | 102 ++++++++++++++++++++++++++++++++----------------- 1 file changed, 68 insertions(+), 34 deletions(-) diff --git a/skins-3.0.json b/skins-3.0.json index 8758150..e5882e9 100644 --- a/skins-3.0.json +++ b/skins-3.0.json @@ -5,10 +5,18 @@ "description": "Default, stock, Jellyfin.", "defaultCss": "", "options": [], - "preview": { - "home": "", - "title": "" - } + "previews":[ + { + "name": "Home", + "url": "" + }, + { + "name": "Title", + "url": "" + } + + + ] }, { "name": "JellyFlix", @@ -16,10 +24,18 @@ "description": "A theme that aims to replicate the red and black look of Netflix. Theme is by prayag17.", "defaultCss": "@import url(https://prayag17.github.io/JellyFlix/default.css);", "options": [], - "preview": { - "home": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/Home.png?raw=true", - "title": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/TitlePage.png?raw=true" - } + "previews":[ + { + "name": "Home", + "url": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/Home.png?raw=true" + }, + { + "name": "Title", + "url": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/TitlePage.png?raw=true" + } + + + ] }, { "name": "Monochromic", @@ -27,7 +43,7 @@ "description": "This theme aims to be minimalistic and somewhat muted in color. Add-ons and custom accent colors are possible, but not entirely supported by this plug-in. Visit the github of the theme for more information.", "defaultCss": "@import url('https://ctalvio.github.io/Monochromic/default_style.css');", "options": [ - { + { "type": "checkBox", "name": "Improve performance", "description": "The theme uses mask-image to fade out items below the top bar as you scroll. This works well on most reasonable hardware but struggles on some phones and especially smart TVs. This switches to a method without using mask-image, but foregoes the fade-out effect. I may switch to this method being the default.", @@ -60,10 +76,18 @@ "default": "" } ], - "preview": { - "home": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true", - "title": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/2.png?raw=true" - } + "previews":[ + { + "name": "Home", + "url": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true" + }, + { + "name": "Title", + "url": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/2.png?raw=true" + } + + + ] }, { "name": "Kaleidochromic", @@ -98,10 +122,17 @@ "default": "#6279cd" } ], - "preview": { - "home": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/6.png?raw=true", - "title": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/1.png?raw=true" - } + "previews":[ + { + "name": "Home", + "url": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/6.png?raw=true" + }, + { + "name": "Title", + "url": "https://github.com/CTalvio/Kaleidochromic/blob/main/screenshots/1.png?raw=true" + } + + ] }, { "name": "JellySkin", @@ -134,10 +165,17 @@ "css": "@import url('https://prayag17.github.io/JellySkin/morningGradient.css');" } ], - "preview": { - "home": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true", - "title": "https://github.com/prayag17/JellySkin/raw/master/Version%204/title%202.png?raw=true" - } + "previews":[ + { + "name": "Home", + "url": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true" + }, + { + "name": "Title", + "url": "https://github.com/prayag17/JellySkin/raw/master/Version%204/title%202.png?raw=true" + } + + ] }, { "name": "Custom", @@ -145,7 +183,7 @@ "description": "customize the look of jellyfin by your needs", "defaultCss": "", "options": [ - { + { "type": "selector", "name": "Change Font", "description": "Change the default fonts", @@ -196,7 +234,7 @@ }, { "type": "colorPicker", - "mode": "rgba", + "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;\ttransition: 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;}" @@ -207,7 +245,7 @@ "name": "Console Panel Color", "description": "Modifies the color of the left menu panel.", "css": ".mainDrawer-scrollContainer { color: $; }", - "default": "#ffffff" + "default":"#ffffff" }, { "type": "checkBox", @@ -235,26 +273,22 @@ "name": "Right Header Color", "description": "This modifies the colors of the cast, search and user buttons in the top right.", "css": ".headerRight { color: $; }", - "default": "#ffffff" + "default":"#ffffff" }, { "type": "number", "name": "Border Radius", - "description": "Change the roundness of text box and more default is zero", - "css": "@import url('https://prayag17.github.io/jellyfin-plugin-skin-manager/src/border-radius.css'); :root{--rounding: $px;}", - "default": "0" + "description": ":root {--rounding: 0px;}.formDialogHeader {border-top-left-radius: var(--rounding);border-top-right-radius: var(--rounding);}.formDialogFooter {border-bottom-left-radius: var(--rounding);border-bottom-right-radius: var(--rounding);}.cardOverlayContainer {border-radius: var(--rounding) !important;}.toast,.paperList,.cardContent,.sessionNowPlayingInnerContent, .listItem:hover, .cardImage,.fab,.multiSelectCheckboxOutline,.itemSelectionPanel,.cardContent-button, .cardContent-shadow, .itemDetailImage, .cardOverlayButton-hover,.cardImageContainer,.cardPadder,.listItemImage,.listItemImageButton,.listItemButton,.headerButton,.paper-icon-button-light,.innerCardFooter,.blurhash-canvas,.actionSheetMenuItem:hover,.dialog,.listItemIcon,.listItem-border,.button-flat,.visualCardBox,.checkboxOutline,.emby-select-withcolor,.chapterThumbTextContainer,.chapterThumbContainer,.chapterThumb,.emby-input, .emby-textarea, .emby-select-withcolor,.cardOverlayButtonIcon,.subtitleappearance-preview.flex.align-items-center.justify-content-center {border-radius: var(--rounding) !important;}.osdPoster img {border-radius: var(--rounding); border: none;}.mdl-slider::-moz-range-thumb {border-radius: var(--rounding);}.mdl-slider::-ms-thumb {border-radius: var(--rounding);}.mdl-slider::-webkit-slider-thumb {border-radius: var(--rounding);}div[data-role='controlgroup'] a[data-role='button']:first-child {border-bottom-left-radius: var(--rounding);border-top-left-radius: var(--rounding);}div[data-role='controlgroup'] a[data-role='button']:last-child {border-bottom-right-radius: var(--rounding);border-top-right-radius: var(--rounding);}", + "css": "", + "default":"0" }, { "type": "number", "name": "Backdrop Blur", "description": "adds blur to the backdrop images default is zero", - "css": "@import url('https://prayag17.github.io/jellyfin-plugin-skin-manager/src/bgBlur.css'); :root{--bgblur: blur($px)}", + "css": ":root{--bgblur: blur($px)}.backdropImage {filter: var(--bgblur);}.backgroundContainer.withBackdrop {background-color: rgba(0,0,0,0);}", "default": "0" } - ], - "preview": { - "home": "", - "title": "" - } + ] } ] From 93b25fc4f1106fc5d40ecab06e82390a24899273 Mon Sep 17 00:00:00 2001 From: Prayag <55829513+prayag17@users.noreply.github.com> Date: Fri, 11 Dec 2020 20:40:45 +0530 Subject: [PATCH 9/9] Add names to previews and fix the size of images --- .../Configuration/configurationpage.html | 22 ++++++++++++++----- 1 file changed, 16 insertions(+), 6 deletions(-) diff --git a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html index aca2550..6e9f783 100644 --- a/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html +++ b/Jellyfin.Plugin.SkinManager/Configuration/configurationpage.html @@ -81,11 +81,11 @@ function loadPreviews(skin){ var html = ""; skin.previews.forEach(element => { + html += getImgnames(element.name); html += getImage(element.url); }); return html; - } - + } function getCheckBox ( option) { var html = ""; @@ -155,11 +155,17 @@ return html } - function getImage(url){ + function getImage(url){ var html = ""; - html += ''; + html += '
'; return html; - } + } + + function getImgnames(name){ + var html = ""; + html += ''+name+'
'; + return html; + } function createCss(){ var savedHtml = ""; @@ -285,7 +291,11 @@ return false; }); - +