Conversation

Maggie

visting SFO

@Mappletons

Made a quick demo on how to customise the visual styling of specific page tags in Roam Learned this trick off

@Malcolm_Ocean

youtu.be/DevXi-h0SPY #roamcult

3:17 PM · May 2, 2020TweetDeck

Replying to

@Mappletons

and

@Malcolm_Ocean

By using a CSS style plugin like Stylus (github.com/openstyles/sty) and adding custom styles to the selector: span.rm-page-ref[data-tag="YourTagName"] { // your styles } ...you can create a whole library of customised tags. For example, here's how I style my #TwitterPost tag.

I also showed how you can also get rid of the [[Double Brackets]] around page links! My page links are now a lovely orange and gloriously double bracket-free. Just add: .rm-page-ref-brackets { display: none; }

If you want to see someone absolutely going to town on building out 99 custom data-tags, check out

@Malcolm_Ocean

's Github Gist: gist.github.com/malcolmocean/0 😳

gist.github.com

Malcolm's custom roam styles

Malcolm's custom roam styles. GitHub Gist: instantly share code, notes, and snippets.

Replying to

and

That's beautifully awesome!! I'm also toying with some customisations but didn't even imagined about customising the styles myself... I'm using a dark theme with some issues... The bracket-free tip is excellent! Definitely will do today. Thanks a lot for sharing!!