Appearance

Appearance #

CSS #

jfa-go uses a17t, which is relatively easy to customize. There are 2 options in the “Look” or themes section of the config, “Default”, “Jellyfin”.

  • Default is the default appearance of a17t, and is a light theme.
  • Jellyfin is a passing attempt to recreate the Jellyfin look , and is a dark theme.

Custom CSS can be achieved by modifying css/dark.css in the source code, and then recompiling. This will replace the Jellyfin theme. See the a17t docs for info on customizing a17t’s CSS variables and examples.

HTML #

One can specify a path to a folder containing customized HTML files with the files/html_templates setting. Any files that match the names of jfa-go’s internal templates will be loaded instead. The files use go’s built in templating language, so familiarize yourself with it first (a good resource) so you know what different parts do. You can find the internal templates here.

Text/Translation #

Additionally, All text on the page, including password requirement strings (e.g “Must have at least n characters”) can be customized. The files/lang_files setting should be the path to a custom language directory that follows the same structure as the internal lang directory:

lang/
├─ admin/
│  ├─ en-us.json
├─ form/
│  ├─ en-us.json
├─ pwreset/
│  ├─ en-us.json
├─ telegram/
│  ├─ en-us.json
├─ common/
│  ├─ en-us.json
├─ setup/
│  ├─ en-us.json

Copy one of the internal language files from lang/<admin|form|pwreset|telegram|common|setup> into it and change the name in the file, this will appear in settings. You can also provide a fallback language (anything you don’t translate will fall back to this language).

{
    "meta": {
        "name": "My custom lang"
        // "fallback": "sv-se"
    },
    "strings": {
    }
}

If you want to replace the internal language file, leave name the same. Restart jfa-go and you should see a new option in Settings > General > Language.

Good luck!