I’m trying to add a modified css for lemmy-ui to my self-hosted instance running on Docker. I’m following this guide but the custom theme is just showing up as litely. Steps taken:
- Went to bootstrap.build, made the necessary edits.
- Exported the
bootstrap.min.cssas well as the_variables.scss - Renamed them to
theme-name.cssand_variables.theme-name.scss - Do the necessary bind mounts so lemmy-ui can access the files. Can confirm the files are correct and appear within the container.
- From lemmy web ui, select from drop down the theme called
theme-name(it shows up with the right name and all). - Press Save, but theme is just litely.
- Use dev tools on browser and can confirm
theme-name.cssis just the litely css.cat theme-name.csswithin the container is showing the right content. LEMMY_UI_EXTRA_THEMES_FOLDERis set correctly since the option fortheme-nameis showing up, it’s just loading litely instead.
Not sure what I’m doing wrong here :/
Yeah I figured it out (check out my instance), a few hiccups here and there but I basically did the same thing I posted up there and it now loads correctly.
The problem wasn’t from my end, lemmy-ui didn’t move fully to bootstrap 5 when I made that post.
After an update to pre version
0.18.x, I could use bootstrap.build and follow the rest and the theme loads.Post
0.18.x, when the devs reintroduced some bundled themes like the vaporwave ones and others, my theme broke again, bootstrap.build doesn’t seem to work anymore. They now also require three files_variables.theme.css,theme.scssandtheme.cssNow I’m not a web frontend dev or anything like that so I ended up just copy and renamed the vaporwave theme and edited it to what I want.
Thank you SO much. There were a lot of blanks to fill in with the doc page. I was putting the theme files in subfolders rather than renaming (though I suspected that was my issue). Then it says to use v4 themes, and those KIND of worked, but kind of not. v5 seems good so far. Still a bit more to figure out, but you’ve been incredibly helpful!