Mirrors/gotosocial
1
0
Fork 0
mirror of https://github.com/superseriousbusiness/gotosocial.git synced 2024-11-01 06:50:00 +00:00
Code Issues Projects Releases Packages Wiki Activity
gotosocial/docs/admin/themes.md
tobi 8953f57d88
[feature] User-selectable preset CSS themes for accounts (#2777) 
* [feature] User-selectable preset themes

* docs, more theme stuff

* lint, tests

* fix css name

* correct some little issues

* add another theme

* fix poll background

* okay last theme i swear

* make retrieval of apimodel themes more conventional

* preallocate stylesheet slices
2024-03-25 17:32:24 +00:00

1.8 KiB
Raw Blame History

Themes

Users on your instance can select a theme for their profile from any css files present in the web/assets/themes directory.

GoToSocial comes with some theme files already, but you can add more yourself by doing the following:

  1. Create a file in web/assets/themes called (for example) new-theme.css.
  2. (Optional) Include the following comment at the top of your theme file to title and describe your theme:
/*
  theme-title: My New Theme
  theme-description: This is an example theme
*/

You can use any text you like for these fields, but bear in mind whatever you write here will appear in the settings panel to help users when selecting a theme, so keep it short and sweet. 3. Fill out your custom CSS in the rest of the file. You can use one of the existing CSS files to guide you. Also see this page for some rough guidelines about how to write accessible CSS. 4. Restart your instance so that the new CSS file is picked up.

!!! info If you're using Docker for your deployment, you can mount theme files from the host machine into your GoToSocial web/assets/themes directory instead, by including entries for them in the volumes section of your Docker configuration.

For example, say you've created a theme on your host machine at `~/gotosocial/my-themes/new-theme.css`, you could mount that theme into the GoToSocial Docker container in the following way:

```yaml
volumes:
  [.... some other volume entries ...]
  - "~/gotosocial/my-themes/new-theme.css:/gotosocial/web/assets/themes/new-theme.css"
```

Bear in mind if you mount an entire directory to `/gotosocial/web/assets/themes` instead of mounting individual theme files, you'll override the default themes.