From 7f9aec6672b2b97d419e4a571523a2a2114282d0 Mon Sep 17 00:00:00 2001 From: lscambo13 <32175188+lscambo13@users.noreply.github.com> Date: Sat, 6 Jun 2026 22:56:59 +0530 Subject: [PATCH 1/2] Docs: Add anime and sports cover properties to custom media covers add-on documentation --- custom-media-covers.md | 22 +++++++++++++++++----- 1 file changed, 17 insertions(+), 5 deletions(-) diff --git a/custom-media-covers.md b/custom-media-covers.md index f44fe14..62e6161 100644 --- a/custom-media-covers.md +++ b/custom-media-covers.md @@ -1,4 +1,4 @@ -# 🧩 Add-on: Custom media covers for ElegantFin +# 🧩 Add-on: Custom Media Covers for ElegantFin This is a Jellyfin add-on that allows you to customise My Media cover arts. This is an experimental feature, so limited support will be provided. @@ -54,6 +54,8 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This --colorOverlayMixedCover: transparent; --colorOverlayRecordedmoviesCover: transparent; --colorOverlayRecordedtvCover: transparent; + --colorOverlayAnimeCover: transparent; + --colorOverlaySportsCover: transparent; --urlMoviesCover: transparent; --urlTvshowsCover: transparent; --urlLivetvCover: transparent; @@ -66,6 +68,8 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This --urlMixedCover: transparent; --urlRecordedmoviesCover: transparent; --urlRecordedtvCover: transparent; + --urlAnimeCover: transparent; + --urlSportsCover: transparent; } ``` @@ -89,6 +93,8 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This --colorOverlayMixedCover: transparent; --colorOverlayRecordedmoviesCover: transparent; --colorOverlayRecordedtvCover: transparent; + --colorOverlayAnimeCover: transparent; + --colorOverlaySportsCover: transparent; --urlMoviesCover: var(--cardBackgroundGradient); --urlTvshowsCover: var(--cardBackgroundGradient); --urlLivetvCover: var(--cardBackgroundGradient); @@ -101,6 +107,8 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This --urlMixedCover: var(--cardBackgroundGradient); --urlRecordedmoviesCover: var(--cardBackgroundGradient); --urlRecordedtvCover: var(--cardBackgroundGradient); + --urlAnimeCover: var(--cardBackgroundGradient); + --urlSportsCover: var(--cardBackgroundGradient); } ``` @@ -127,6 +135,8 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This --colorOverlayMixedCover: rgb(194, 58, 58); --colorOverlayRecordedmoviesCover: rgb(52, 52, 52); --colorOverlayRecordedtvCover: rgb(120, 100, 28); + --colorOverlayAnimeCover: rgb(189, 203, 99); + --colorOverlaySportsCover: rgb(233, 126, 60); --urlMoviesCover: linear-gradient(0deg, #313131, #585858 25%); --urlTvshowsCover: linear-gradient(0deg, #313131, #585858 25%); --urlLivetvCover: linear-gradient(0deg, #313131, #585858 25%); @@ -139,6 +149,8 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This --urlMixedCover: linear-gradient(0deg, #313131, #585858 25%); --urlRecordedmoviesCover: linear-gradient(0deg, #313131, #585858 25%); --urlRecordedtvCover: linear-gradient(0deg, #313131, #585858 25%); + --urlAnimeCover: linear-gradient(0deg, #313131, #585858 25%); + --urlSportsCover: linear-gradient(0deg, #313131, #585858 25%); } ``` @@ -187,6 +199,8 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This --colorOverlayMixedCover: rgb(); --colorOverlayRecordedmoviesCover: rgb(); --colorOverlayRecordedtvCover: rgb(); + --colorOverlayAnimeCover: rgb(); + --colorOverlaySportsCover: rgb(); @@ -201,6 +215,8 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This --urlMixedCover: url(); --urlRecordedmoviesCover: url(); --urlRecordedtvCover: url(); + --urlAnimeCover: url(); + --urlSportsCover: url(); } @@ -245,7 +261,3 @@ Suppose you want to modify the Live TV cover art. You'll have to modify the vari 4. Click save. - -
- -``` From 9c24801ff9dcd966d31bf9cd27e99591b59a93de Mon Sep 17 00:00:00 2001 From: lscambo13 <32175188+lscambo13@users.noreply.github.com> Date: Sat, 6 Jun 2026 23:32:19 +0530 Subject: [PATCH 2/2] Docs: Update README for clarity and new customisation options --- README.md | 29 ++++++++++++++++++++++++----- 1 file changed, 24 insertions(+), 5 deletions(-) diff --git a/README.md b/README.md index 5518f43..7a98b19 100644 --- a/README.md +++ b/README.md @@ -159,7 +159,7 @@ https://github.com/user-attachments/assets/bb7f3174-b703-4c98-a23c-e6bb4abba390
- 3. Enable extra overlay buttons on cards on desktop + 3. Enable or disable extra overlay buttons on cards on desktop image @@ -169,7 +169,8 @@ https://github.com/user-attachments/assets/bb7f3174-b703-4c98-a23c-e6bb4abba390 --extraCardButtonsVisibility: block; } ``` -- To hide them again, simply remove this code block or replace `block` with `none`. +- To hide the three-dot button that shows up next to these buttons, also include `--menuButtonVisibility: none;` in `:root{}` +- To undo these changes, simply remove this code block or switch between `block` and `none`.
@@ -260,6 +261,23 @@ https://github.com/user-attachments/assets/b5868cd2-8df9-490d-a2b6-4386c6ddcd56 - You can also experiment and share your own take there if you wish.
+
+ 10. Increase the size of Continue Watching cards so that they stand out + +image + +- You can adjust their scaling `--resumeCardScale`. +- Use any values over 1.0 to make them bigger. + +``` +:root{ + --resumeCardScale: 1.25; +} +``` + +- To undo this change, simply remove this code block or set the value back to `1`. +
+
### 🆗 Tested on @@ -273,12 +291,13 @@ https://github.com/user-attachments/assets/b5868cd2-8df9-490d-a2b6-4386c6ddcd56 ### 🛠️ Troubleshooting
- 1️⃣ - How do I check if I am using the latest version of ElegantFin? + 1️⃣ - How do I check which version of ElegantFin I am using? - Check the version number at the bottom in the Settings screen. -- It should be something like `ElegantFin v25.XX.XX`. +- It should be something like `ElegantFin v26.YY.ZZ`. + +image - image