unixaxwell/jellyfin-plugin-skin-manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

make custom look more default without theming

Browse Source
This commit is contained in:
Prayag
2021-05-02 19:02:56 +05:30
parent ddfb13cf18
commit 0317cc7ef2
1 changed files with 430 additions and 453 deletions
Download Patch File Download Diff File Expand all files Collapse all files

109
skins-3.0.json
View File

@@ -1,11 +1,9 @@
[ [{
{
"name": "Default", "name": "Default",
"author": "Jellyfin", "author": "Jellyfin",
"description": "Default, stock, Jellyfin.", "description": "Default, stock, Jellyfin.",
"defaultCss": "", "defaultCss": "",
"previews": [ "previews": [{
{
"name": "Login Page", "name": "Login Page",
"url": "" "url": ""
}, },
@@ -22,20 +20,17 @@
"url": "" "url": ""
} }
], ],
"categories": [ "categories": [{
{
"name": "Default", "name": "Default",
"options": [] "options": []
} }]
]
}, },
{ {
"name": "JellyFlix", "name": "JellyFlix",
"author": "prayagprajapati17", "author": "prayagprajapati17",
"description": "A theme that aims to replicate the red and black look of Netflix. Theme is by prayag17.", "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);", "defaultCss": "@import url(https://prayag17.github.io/JellyFlix/default.css);",
"previews": [ "previews": [{
{
"name": "Login Page", "name": "Login Page",
"url": "https://prayag17.github.io/JellyFlix/img/Login.jpg" "url": "https://prayag17.github.io/JellyFlix/img/Login.jpg"
}, },
@@ -52,20 +47,17 @@
"url": "https://prayag17.github.io/JellyFlix/img/Title%20Page-TV.jpg" "url": "https://prayag17.github.io/JellyFlix/img/Title%20Page-TV.jpg"
} }
], ],
"categories": [ "categories": [{
{
"name": "Default", "name": "Default",
"options": [] "options": []
} }]
]
}, },
{ {
"name": "Monochromic", "name": "Monochromic",
"author": "EdgeMentality", "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.", "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');", "defaultCss": "@import url('https://ctalvio.github.io/Monochromic/default_style.css');",
"previews": [ "previews": [{
{
"name": "Login Page", "name": "Login Page",
"url": "https://github.com/danieladov/jellyfin-plugin-skin-manager/blob/master/src/img/Monochromic/login.jpg?raw=true" "url": "https://github.com/danieladov/jellyfin-plugin-skin-manager/blob/master/src/img/Monochromic/login.jpg?raw=true"
}, },
@@ -82,11 +74,9 @@
"url": "https://github.com/CTalvio/Monochromic/raw/master/screenshots/2.png" "url": "https://github.com/CTalvio/Monochromic/raw/master/screenshots/2.png"
} }
], ],
"categories": [ "categories": [{
{
"name": "Default", "name": "Default",
"options": [ "options": [{
{
"type": "checkBox", "type": "checkBox",
"name": "Improve performance", "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.", "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.",
@@ -119,16 +109,14 @@
"default": "" "default": ""
} }
] ]
} }]
]
}, },
{ {
"name": "Kaleidochromic", "name": "Kaleidochromic",
"author": "Casper Talvio", "author": "Casper Talvio",
"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.", "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');", "defaultCss": "@import url('https://ctalvio.github.io/Kaleidochromic/default_style.css');",
"previews": [ "previews": [{
{
"name": "Login Page", "name": "Login Page",
"url": "https://github.com/danieladov/jellyfin-plugin-skin-manager/blob/master/src/img/Kaleidochromic/Login.jpg?raw=true" "url": "https://github.com/danieladov/jellyfin-plugin-skin-manager/blob/master/src/img/Kaleidochromic/Login.jpg?raw=true"
}, },
@@ -145,11 +133,9 @@
"url": "https://github.com/CTalvio/Kaleidochromic/raw/main/screenshots/1.png" "url": "https://github.com/CTalvio/Kaleidochromic/raw/main/screenshots/1.png"
} }
], ],
"categories": [ "categories": [{
{
"name": "Default", "name": "Default",
"options": [ "options": [{
{
"type": "checkBox", "type": "checkBox",
"name": "Improve performance", "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.", "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.",
@@ -176,8 +162,7 @@
"default": "#6279cd" "default": "#6279cd"
} }
] ]
} }]
]
}, },
{ {
"name": "Novachromic", "name": "Novachromic",
@@ -203,11 +188,9 @@
"url": "https://github.com/CTalvio/Novachromic/raw/main/screenshots/two.png" "url": "https://github.com/CTalvio/Novachromic/raw/main/screenshots/two.png"
} }
], ],
"categories": [ "categories": [{
{
"name": "Default", "name": "Default",
"options": [ "options": [{
{
"type": "checkBox", "type": "checkBox",
"name": "Restore bottom bar style episode progress", "name": "Restore bottom bar style episode progress",
"description": "Don't like my transparent view progress overlay? Use this to go back to the old style.", "description": "Don't like my transparent view progress overlay? Use this to go back to the old style.",
@@ -228,16 +211,14 @@
"default": "#ffffff" "default": "#ffffff"
} }
] ]
} }]
]
}, },
{ {
"name": "JellySkin", "name": "JellySkin",
"author": "prayagprajapati17", "author": "prayagprajapati17",
"description": "A very bright and colorful look using lots of drop shadows. Theme is by prayag17.", "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');", "defaultCss": "@import url('https://prayag17.github.io/JellySkin/default.css');",
"previews": [ "previews": [{
{
"name": "Login Page", "name": "Login Page",
"url": "https://prayag17.github.io/JellySkin/img/login.jpg" "url": "https://prayag17.github.io/JellySkin/img/login.jpg"
}, },
@@ -254,17 +235,14 @@
"url": "https://prayag17.github.io/JellySkin/img/Title%20Page-Movie.jpg" "url": "https://prayag17.github.io/JellySkin/img/Title%20Page-Movie.jpg"
} }
], ],
"categories": [ "categories": [{
{
"name": "Default", "name": "Default",
"options": [ "options": [{
{
"type": "selector", "type": "selector",
"name": "Gradient", "name": "Gradient",
"description": "Changes the Jellyfin themed Hover gradient", "description": "Changes the Jellyfin themed Hover gradient",
"css": "@import url('https://prayag17.github.io/JellySkin/$.css');", "css": "@import url('https://prayag17.github.io/JellySkin/$.css');",
"selections": [ "selections": [{
{
"name": "Default", "name": "Default",
"value": "" "value": ""
}, },
@@ -287,25 +265,22 @@
] ]
}, },
{ {
"type":"checkBox", "type": "checkBox",
"name":"Theme Logo", "name": "Theme Logo",
"description":"Styles title page in such a way in which logos are used instead of Names.", "description": "Styles title page in such a way in which logos are used instead of Names.",
"css":"@import url('https://prayag17.github.io/JellySkin/Logo.css');" "css": "@import url('https://prayag17.github.io/JellySkin/Logo.css');"
}
]
} }
] ]
}]
}, },
{ {
"name": "Custom", "name": "Custom",
"author": "you", "author": "you",
"description": "customize the look of jellyfin by your needs", "description": "customize the look of jellyfin by your needs",
"defaultCss": "/*Custom*/", "defaultCss": "/*Custom*/",
"categories": [ "categories": [{
{
"name": "Fonts", "name": "Fonts",
"options": [ "options": [{
{
"type": "googleFonts" "type": "googleFonts"
}, },
{ {
@@ -320,25 +295,21 @@
}, },
{ {
"name": "Home/Dashboard Page", "name": "Home/Dashboard Page",
"options": [ "options": [{
{
"type": "checkBox", "type": "checkBox",
"name": "Enlarge Tab Buttons", "name": "Enlarge Tab Buttons",
"description": "Enlarges the tab buttons, suggested, genres, etc. By default they are really tiny, especially on mobile.", "description": "Enlarges the tab buttons, suggested, genres, etc. By default they are really tiny, especially on mobile.",
"css": ".headerTabs.sectionTabs {text-size-adjust: 110%; font-size: 110%;}.pageTitle {margin-top: auto; margin-bottom: auto;}.emby-tab-button {padding: 1.75em 1.7em;}" "css": ".headerTabs.sectionTabs {text-size-adjust: 110%; font-size: 110%;}.pageTitle {margin-top: auto; margin-bottom: auto;}.emby-tab-button {padding: 1.75em 1.7em;}"
} }]
]
}, },
{ {
"name": "Miscellaneous", "name": "Miscellaneous",
"options": [ "options": [{
{
"type": "selector", "type": "selector",
"name": "Poster card hover effect", "name": "Poster card hover effect",
"description": "Changes the hover effect on Movie/TV show/Music poster card.", "description": "Changes the hover effect on Movie/TV show/Music poster card.",
"css": "", "css": "",
"selections": [ "selections": [{
{
"name": "Scale in and out", "name": "Scale in and out",
"css": "/*Dynamic Poster effect-option1*/.cardBox-bottompadded{margin-bottom; 1em !important;}.itemsContainer>.card>.cardBox {margin: 1em;background: rgba(0,0,0,0.5);transition: transform .2s;}.card:hover .cardBox{transform: scale(1.1);}" "css": "/*Dynamic Poster effect-option1*/.cardBox-bottompadded{margin-bottom; 1em !important;}.itemsContainer>.card>.cardBox {margin: 1em;background: rgba(0,0,0,0.5);transition: transform .2s;}.card:hover .cardBox{transform: scale(1.1);}"
}, },
@@ -366,8 +337,7 @@
"type": "selector", "type": "selector",
"name": "Episode View", "name": "Episode View",
"description": "Theme episode list", "description": "Theme episode list",
"selections": [ "selections": [{
{
"name": "Card", "name": "Card",
"css": " #itemDetailPage .vertical-list {display: grid;grid-template-columns: 30% 30% 30%;padding: 0 6px !important;height: fit-content;justify-content: space-evenly;-webkit-box-orient: horizontal;-webkit-box-direction: normal;margin: -6px;width: calc(100% - 6px);}.listItem-withContentWrapper:hover .listItemImageButton.itemAction.paper-icon-button-light {opacity: 100%;}@media (max-width: 901px){#itemDetailPage .vertical-list {grid-template-columns: 30% 30%;}}.listItem-withContentWrapper {transition: none;height: fit-content;max-width: 100%;margin: 6px;border-radius: var(--rounding);overflow: hidden;padding: 0;overflow: hidden;}.listItem-withContentWrapper:hover{background: transparent;}.listItem-content {height: 100%;}.listItem-content {display: -webkit-flex;display: flex;-webkit-align-items: center;align-items: center;width: 100%;display: grid;grid-template-columns: 100%;}.listItemImage.listItemImage-large.itemAction.lazy {height: 14rem;width: 100%;padding: 0 !important;margin: 0 !important;top: 0;left: 0;}.layout-mobile #itemDetailPage .vertical-list {grid-template-columns: 100%;}.secondary.listItem-overview.listItemBodyText {height: fit-content;}.layout-mobile .listItem-bottomoverview {padding: 0 10px;}.listItemBody.itemAction {padding: 0 5px;}.listItemImageButton.itemAction.paper-icon-button-light {opacity: 0;color: var(--accent);transition: all .2s;}.layout-mobile .listItemImageButton.itemAction.paper-icon-button-light{opacity: 100% !important;}" "css": " #itemDetailPage .vertical-list {display: grid;grid-template-columns: 30% 30% 30%;padding: 0 6px !important;height: fit-content;justify-content: space-evenly;-webkit-box-orient: horizontal;-webkit-box-direction: normal;margin: -6px;width: calc(100% - 6px);}.listItem-withContentWrapper:hover .listItemImageButton.itemAction.paper-icon-button-light {opacity: 100%;}@media (max-width: 901px){#itemDetailPage .vertical-list {grid-template-columns: 30% 30%;}}.listItem-withContentWrapper {transition: none;height: fit-content;max-width: 100%;margin: 6px;border-radius: var(--rounding);overflow: hidden;padding: 0;overflow: hidden;}.listItem-withContentWrapper:hover{background: transparent;}.listItem-content {height: 100%;}.listItem-content {display: -webkit-flex;display: flex;-webkit-align-items: center;align-items: center;width: 100%;display: grid;grid-template-columns: 100%;}.listItemImage.listItemImage-large.itemAction.lazy {height: 14rem;width: 100%;padding: 0 !important;margin: 0 !important;top: 0;left: 0;}.layout-mobile #itemDetailPage .vertical-list {grid-template-columns: 100%;}.secondary.listItem-overview.listItemBodyText {height: fit-content;}.layout-mobile .listItem-bottomoverview {padding: 0 10px;}.listItemBody.itemAction {padding: 0 5px;}.listItemImageButton.itemAction.paper-icon-button-light {opacity: 0;color: var(--accent);transition: all .2s;}.layout-mobile .listItemImageButton.itemAction.paper-icon-button-light{opacity: 100% !important;}"
}, },
@@ -399,7 +369,7 @@
}, },
{ {
"type": "colorPicker", "type": "colorPicker",
"mode":"hex", "mode": "hex",
"name": "Button background color", "name": "Button background color",
"description": "change background color of button.", "description": "change background color of button.",
"css": ".raised{background-color: $;}", "css": ".raised{background-color: $;}",
@@ -444,11 +414,18 @@
"css": "*,*::before,*::after{border-radius: $ !important;}", "css": "*,*::before,*::after{border-radius: $ !important;}",
"default": "0" "default": "0"
}, },
{
"type": "colorPicker",
"name": "Background-color",
"description": "change background-color of the background",
"css": ".backgroundContainer.withBackdrop {background-color: rgba(0,0,0,0);}",
"default": "inherit"
},
{ {
"type": "blurSlider", "type": "blurSlider",
"name": "Backdrop Blur", "name": "Backdrop Blur",
"description": "adds blur to the backdrop images default is zero", "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": ":root{--bgblur: blur($px)}.backdropImage {filter: var(--bgblur);}",
"default": "0" "default": "0"
} }
] ]