Question about customizing your Mastodon instance:

So there's a nice feature where, as an instance admin, you can write some CSS and customise the appearance of your instance's web interface. It's a nice way to personalize things, make it stand out a bit.

Only problem: It's undocumented. I've not mastered the art of CSS/HTML but I can slap together a responsive website in notepad, so I figured I should be able to do something for my own. No such luck.

I tried the obvious hacks of overriding regular elements like <p> or <body>, I tried digging through my browser's developer tools to figure out the styling, but nothing I tried worked.

NOTHING.

I found some websites, last updated in like 2018 or something, that share templates that you can just copy&paste. They don't work either.

So, how do I do this?! Where's the manual? I actually miss the days of some sneering neckbeard telling me to RTFM before closing my ticket because at least there WAS a manual, ya know?

#mastoadmin #mastodon

@uastronomer

I know for a fact the #MastodonBirdUI #css, created by @rolle, works. It's a Twitter like theme.

Maybe Rolle can point you into the direction of some #MastodonCSS resources and guides.

Also, I remember reading something from @atomicpoet about Mastodon CSS a while back, I think.

https://github.com/ronilaukkarinen/mastodon-bird-ui

GitHub - ronilaukkarinen/mastodon-bird-ui: ๐Ÿ˜๐Ÿฆ Mastodon web UI, but strongly inspired by Twitter (when it was still good!)

๐Ÿ˜๐Ÿฆ Mastodon web UI, but strongly inspired by Twitter (when it was still good!) - ronilaukkarinen/mastodon-bird-ui

GitHub
@paul @uastronomer @atomicpoet Mastodon CSS is built with SCSS, with hardcoded SCSS variables. It is rather cumbersome to build your own framework in place of it so I have just built one on top of it. Itโ€™s not perfect, but makes it much easier to customize.