https://github.com/ccrsxx/violetfin

My Jellyfin Theme
https://github.com/ccrsxx/violetfin

Last synced: 5 days ago
JSON representation

My Jellyfin Theme

• Host: GitHub
• URL: https://github.com/ccrsxx/violetfin
• Owner: ccrsxx
• Created: 2024-02-04T09:35:06.000Z (9 months ago)
• Default Branch: main
• Last Pushed: 2024-05-17T01:24:03.000Z (6 months ago)
• Last Synced: 2024-05-17T02:34:57.268Z (6 months ago)
• Language: SCSS
• Homepage:
• Size: 3.51 MB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# My Jellyfin Theme

Just my personal Jellyfin theme.

## Installation

How to install the theme.

1. Go to the Jellyfin `Settings > Dashboard > General > Custom CSS`

1. Paste this CSS code into the Custom CSS input:

   ```css

   @import url('https://ccrsxx.github.io/violetfin/public/style.css');

   ```

1. Click Save

Optional: this theme make a heavy use of Backdrops on the library, it has cool moving animations on the library background. You can enable it by going to `Settings > Display > Backdrops`. There's also a way to enable the backdrop on all users, you can follow the tutorial [here](https://github.com/BobHasNoSoul/jellyfin-mods#force-backdrops-for-all-users-108x).

## Development

Here are the steps to run the project locally.

1. Clone the repository

   ```bash

   git clone https://github.com/ccrsxx/violetfin.git

   ```

1. Change directory to the project

   ```bash

   cd violetfin

   ```

1. Install dependencies

   ```bash

   npm i

   ```

1. Run the project

   ```bash

   npm run dev

   ```

1. Go to the `Settings > Dashboard > General > Custom CSS`, or go to `Settings > Display > Custom CSS`. This way you don't override the entire server's CSS, only on your current client. Make sure to enable `Disable server-provided custom CSS code` to prevent the server's CSS from overriding your custom CSS.

1. Paste the development CSS code into the Custom CSS input:

   ```css

   @import url('http://localhost:3000/public/style.css');

   ```