Merge pull request #17 from prayag17/master

Categorize Options

skins-3.0.json

@@ -4,7 +4,6 @@
         "author": "Jellyfin",
         "description": "Default, stock, Jellyfin.",
         "defaultCss": "",
-    "options": [],
         "previews": [
             {
                 "name": "Login Page",
@@ -22,6 +21,12 @@
                 "name": "Title page",
                 "url": ""
             }
+        ],
+        "categories": [
+            {
+                "name": "Default",
+                "options": []
+            }
         ]
     },
     {
@@ -29,7 +34,6 @@
         "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": [],
         "previews": [
             {
                 "name": "Login Page",
@@ -47,6 +51,12 @@
                 "name": "Title page",
                 "url": "https://github.com/prayag17/JellyFlix/raw/main/Public%20Ver%201/TV-TitlePage.png?raw=true"
             }
+        ],
+        "categories": [
+            {
+                "name": "Default",
+                "options": []
+            }
         ]
     },
     {
@@ -54,6 +64,27 @@
         "author": "EdgeMentality",
         "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');",
+        "previews": [
+            {
+                "name": "Login Page",
+                "url": "https://github.com/danieladov/jellyfin-plugin-skin-manager/blob/master/src/img/Monochromic/login.jpg?raw=true"
+            },
+            {
+                "name": "Home/Index Page",
+                "url": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true"
+            },
+            {
+                "name": "Library Page",
+                "url": "https://raw.githubusercontent.com/danieladov/jellyfin-plugin-skin-manager/master/src/img/Monochromic/Lib.jpg"
+            },
+            {
+                "name": "Title page",
+                "url": "https://github.com/CTalvio/Monochromic/raw/master/screenshots/2.png"
+            }
+        ],
+        "categories": [
+            {
+                "name": "Default",
                 "options": [
                     {
                         "type": "checkBox",
@@ -87,23 +118,7 @@
                         "css": "@import url('https://ctalvio.github.io/Monochromic/customcolor_style.css');:root {--accent: $;}",
                         "default": ""
                     }
-    ],
+                ]
-"previews":[
-		{
-			"name": "Login Page",
-			"url": "https://github.com/danieladov/jellyfin-plugin-skin-manager/blob/master/src/img/Monochromic/login.jpg?raw=true"
-		},
-		{
-			"name": "Home/Index Page",
-			"url": "https://github.com/CTalvio/Monochromic/blob/master/screenshots/1.png?raw=true"
-		},
-		{
-			"name": "Library Page",
-			"url": "https://raw.githubusercontent.com/danieladov/jellyfin-plugin-skin-manager/master/src/img/Monochromic/Lib.jpg"
-		},
-		{
-			"name": "Title page",
-			"url": "https://github.com/CTalvio/Monochromic/raw/master/screenshots/2.png"
             }
         ]
     },
@@ -112,6 +127,27 @@
         "author": "EdgeMentality",
         "description": "This theme aims to be more colorful and minimalistic. 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/Kaleidochromic/default_style.css');",
+        "previews": [
+            {
+                "name": "Login Page",
+                "url": "https://github.com/danieladov/jellyfin-plugin-skin-manager/blob/master/src/img/Kaleidochromic/Login.jpg?raw=true"
+            },
+            {
+                "name": "Home/Index Page",
+                "url": "https://github.com/CTalvio/Kaleidochromic/raw/main/screenshots/6.png"
+            },
+            {
+                "name": "Library Page",
+                "url": "https://github.com/CTalvio/Kaleidochromic/raw/main/screenshots/5.png"
+            },
+            {
+                "name": "Title page",
+                "url": "https://github.com/CTalvio/Kaleidochromic/raw/main/screenshots/1.png"
+            }
+        ],
+        "categories": [
+            {
+                "name": "Default",
                 "options": [
                     {
                         "type": "checkBox",
@@ -139,23 +175,7 @@
                         "css": ":root {--accent: $;}",
                         "default": "#6279cd"
                     }
-    ],
+                ]
-	"previews":[
-		{
-			"name": "Login Page",
-			"url": "https://github.com/danieladov/jellyfin-plugin-skin-manager/blob/master/src/img/Kaleidochromic/Login.jpg?raw=true"
-		},
-		{
-			"name": "Home/Index Page",
-			"url": "https://github.com/CTalvio/Kaleidochromic/raw/main/screenshots/6.png"
-		},
-		{
-			"name": "Library Page",
-			"url": "https://github.com/CTalvio/Kaleidochromic/raw/main/screenshots/5.png"
-		},
-		{
-			"name": "Title page",
-			"url": "https://github.com/CTalvio/Kaleidochromic/raw/main/screenshots/1.png"
             }
         ]
     },
@@ -164,6 +184,27 @@
         "author": "prayagprajapati17",
         "description": "A very bright and colorful look using lots of drop shadows. Theme is by prayag17.",
         "defaultCss": "@import url('https://prayag17.github.io/JellySkin/default.css');",
+        "previews": [
+            {
+                "name": "Login Page",
+                "url": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Login.png?raw=true"
+            },
+            {
+                "name": "Home/Index Page",
+                "url": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true"
+            },
+            {
+                "name": "Library Page",
+                "url": "https://github.com/prayag17/JellySkin/raw/master/Version%204/lib%202.png?raw=true"
+            },
+            {
+                "name": "Title page",
+                "url": "https://github.com/prayag17/JellySkin/raw/master/Version%204/title%201.png?raw=true"
+            }
+        ],
+        "categories": [
+            {
+                "name": "Default",
                 "options": [
                     {
                         "type": "selector",
@@ -185,23 +226,7 @@
                             }
                         ]
                     }
-    ],
+                ]
-	"previews":[
-		{
-			"name": "Login Page",
-			"url": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Login.png?raw=true"
-		},
-		{
-			"name": "Home/Index Page",
-			"url": "https://github.com/prayag17/JellySkin/raw/master/Version%204/Home.png?raw=true"
-		},
-		{
-			"name": "Library Page",
-			"url": "https://github.com/prayag17/JellySkin/raw/master/Version%204/lib%202.png?raw=true"
-		},
-		{
-			"name": "Title page",
-			"url": "https://github.com/prayag17/JellySkin/raw/master/Version%204/title%201.png?raw=true"
             }
         ]
     },
@@ -210,6 +235,9 @@
         "author": "you",
         "description": "customize the look of jellyfin by your needs",
         "defaultCss": "/*Custom*/",
+        "categories": [
+            {
+                "name": "Fonts",
                 "options": [
                     {
                         "type": "selector",
@@ -265,7 +293,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;\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;}"
+                        "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;}"
                     },
                     {
                         "type": "colorPicker",
@@ -274,7 +302,12 @@
                         "description": "Modifies the color of the left menu panel.",
                         "css": ".mainDrawer-scrollContainer { color: $; }",
                         "default": "#ffffff"
+                    }
+                ]
             },
+            {
+                "name": "Home/Dashboard Page",
+                "options": [
                     {
                         "type": "checkBox",
                         "name": "Enlarge Tab Buttons",
@@ -294,7 +327,12 @@
                         "description": "Change background color.",
                         "css": ".backgroundContainer, .dialog, html { background-color: $;}",
                         "default": "#000000"
+                    }
+                ]
             },
+            {
+                "name": "Miscellaneous",
+                "options": [
                     {
                         "type": "colorPicker",
                         "mode": "hex",
@@ -333,3 +371,5 @@
                 ]
             }
         ]
+    }
+]