boris/ElegantFin
1
0
Fork 0
mirror of https://github.com/lscambo13/ElegantFin.git synced 2025-09-18 12:40:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update Add-Ons.md

Browse Source
This commit is contained in:
lscambo13
2025-01-19 19:56:56 +05:30
committed by GitHub
parent d82389bb9d
commit bd0d1cc34d
1 changed files with 97 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
Add-Ons.md
View File

@@ -5,12 +5,91 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This
<hr> <hr>
### 🖼️ Preview ### 🖼️ Presets
<details> <details>
<summary><i>Click here to reveal</i></summary> <summary><i>This is how the covers look without this add-on.</i></summary>
<img src="https://github.com/lscambo13/ElegantFin/blob/main/Previews/10.%20My%20Media%20Cover%20Arts.png" style="width:720px;height:auto;"></img> ![Screenshot 2025-01-19 191836](https://github.com/user-attachments/assets/49425368-cfe3-4c3b-9533-eb18b64c84d6)
</details>
<details>
<summary><i>This is how they look with this add-on, by default.</i></summary>
![image](https://github.com/user-attachments/assets/5284af32-3b2e-4150-938c-f6d0fdfddf06)
```
@import url("https://cdn.jsdelivr.net/gh/lscambo13/ElegantFin@main/Theme/assets/add-ons/custom-media-covers-nightly-min.css");
```
</details>
<details>
<summary><i>You can also change these covers.</i></summary>
![Screenshot 2025-01-19 192015](https://github.com/user-attachments/assets/11719ef1-36ca-46e9-8030-b464a5ae5b79)
</details>
<details>
<summary><i>You can achieve a minimal design too.</i></summary>
![Screenshot 2025-01-19 192133](https://github.com/user-attachments/assets/daaefe74-d3a9-4bb4-8389-9605a4364372)
```
@import url("https://cdn.jsdelivr.net/gh/lscambo13/ElegantFin@main/Theme/assets/add-ons/custom-media-covers-nightly-min.css");
:root{
--colorOverlayMoviesCover: transparent;
--colorOverlayTvshowsCover: transparent;
--colorOverlayLivetvCover: transparent;
--colorOverlayPlaylistsCover: transparent;
--colorOverlayBoxsetsCover: transparent;
--colorOverlayMusicCover: transparent;
--colorOverlayHomevideosCover: transparent;
--colorOverlayBooksCover: transparent;
--colorOverlayFoldersCover: transparent;
--urlMoviesCover: transparent;
--urlTvshowsCover: transparent;
--urlLivetvCover: transparent;
--urlPlaylistsCover: transparent;
--urlBoxsetsCover: transparent;
--urlMusicCover: transparent;
--urlHomevideosCover: transparent;
--urlBooksCover: transparent;
--urlFoldersCover: transparent;
}
```
<hr>
![Screenshot 2025-01-19 192505](https://github.com/user-attachments/assets/256718f2-67ca-4fbd-8407-e41803380174)
```
@import url("https://cdn.jsdelivr.net/gh/lscambo13/ElegantFin@main/Theme/assets/add-ons/custom-media-covers-nightly-min.css");
:root{
--colorOverlayMoviesCover: transparent;
--colorOverlayTvshowsCover: transparent;
--colorOverlayLivetvCover: transparent;
--colorOverlayPlaylistsCover: transparent;
--colorOverlayBoxsetsCover: transparent;
--colorOverlayMusicCover: transparent;
--colorOverlayHomevideosCover: transparent;
--colorOverlayBooksCover: transparent;
--colorOverlayFoldersCover: transparent;
--urlMoviesCover: var(--cardBackgroundGradient);
--urlTvshowsCover: var(--cardBackgroundGradient);
--urlLivetvCover: var(--cardBackgroundGradient);
--urlPlaylistsCover: var(--cardBackgroundGradient);
--urlBoxsetsCover: var(--cardBackgroundGradient);
--urlMusicCover: var(--cardBackgroundGradient);
--urlHomevideosCover: var(--cardBackgroundGradient);
--urlBooksCover: var(--cardBackgroundGradient);
--urlFoldersCover: var(--cardBackgroundGradient);
}
```
</details> </details>
@@ -26,7 +105,14 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This
<hr> <hr>
### ⚙️ How to modify this add-on? ### ⚙️ How to configure this add-on?
- Remember, you do not need to configure anything if you're happy with the default set of images.
<details>
<summary><i>Click here to reveal.</i></summary>
- To configure your theme to use the custom images, you'll need to input a URL pointing to an image in variables starting with '--url' and an overlay color in variables starting with '--color'. - To configure your theme to use the custom images, you'll need to input a URL pointing to an image in variables starting with '--url' and an overlay color in variables starting with '--color'.
@@ -34,8 +120,8 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This
- Below are all the configurable variables, but you should remove the entries you do not intend to modify: - Below are all the configurable variables, but you should remove the entries you do not intend to modify:
``` ```
:root{ :root{
<!-- overlay colors; change according to your image. --> <!-- overlay colors; change according to your image. -->
@@ -63,6 +149,10 @@ This is a Jellyfin add-on that allows you to customise My Media cover arts. This
} }
``` ```
</details>
<hr>
### 🆗 Read this example: ### 🆗 Read this example:
Suppose you want to modify the Live TV cover art. You'll have to modify the variables named `--colorOverlayLivetvCover` and `--urlLivetvCover`, so that your final configuration will look something like this: Suppose you want to modify the Live TV cover art. You'll have to modify the variables named `--colorOverlayLivetvCover` and `--urlLivetvCover`, so that your final configuration will look something like this: