This is a wiki post. If you have something to share, please add it.
There are some TODO placeholders left that I’ll add when I have time.
Customizing RemNote’s Inline Formatting
RemNote has a set of inline formatting options:
- 6 highlight colors
- bold
- italic
- underline
- quote/code
Each of those 5 options can be applied independently (only 1 highlight can be active at all times) creating theoretically 7 * 2 * 2 * 2 * 2 = 112 distinct inline styles per rem. And you technically can customize each one of them to your liking!
You can of course use a styling tag and have 112 totally different formats on the next rem.
And we also have not counted sequences of formatting, e.g. italics followed by bold!
Important Note
Please be sensible with the styling you change. At all times the meaning (semantics) of your formatting should be equivalent to that of the original formatting. If you import other peoples notes their formatting will be displayed with your formatting and vice versa!
Change the red highlight to red text instead. This is fine since it preserves the intention: Highlight this piece of text with a color.
Change the red highlight to small grey text to represent a comment. Now if you view or import a shared document from your friend (or the official documentation) you are wondering why this really important piece if information you had almost missed has such small grey text.
Also be aware that additional formatting options (e.g. builtin text colors) might be implemented in the future. Think about what this means for you and how you want to handle this in your knowledge base especially before committing to any of the more hacky ones.
Formatting Tags
If a formatting should be applied to the whole rem use a styling tag instead! They are generate backlinks and are easier to manage once a native solution comes available.
You can also limit your styling changes to a tagged rem or a subtree by prefixing with [data-rem-tags~="your-tag"] or [data-rem-container-tags~="your-tag"] respectively.
More info here:
Targeting inline style
Highlights
.rem-text .highlight-color--red {}
.rem-text .highlight-color--orange {}
.rem-text .highlight-color--yellow {}
.rem-text .highlight-color--green {}
.rem-text .highlight-color--blue {}
.rem-text .highlight-color--purple {}
Bold, Italics, Underline
TODO
Quote
.quote {}
Targeting Combinations
TODO (Here the difficulty is that the classes above are probably on different levels of the DOM so you have to remember that for the ordering)
Targeting Sequences
TODO
Can/should be combined with (tagged) references.
Example:
Useful CSS Rules
- color
- background color
- font-size
- font-weight
- font-style
- text-decoration
- border
- border-radius
Examples
WIP: I will fill in examples when I have time.
Quote as inline code by @marcothesis
Note: This changes the semantics from quote (something another person wrote, not your own thought) to code (a piece of a programming language), but ` is code in markdown as well so this seems fine.
CSS
.quote {
font-family: Menlo, Monaco, monospace;
font-size: 14px;
color: #e64400;
border: 1px solid #dfdfdf;
background-color: #f6f6f6;
}
Alternative set of highlight colors
TODO
Highlights to text colors globally
TODO
Highlights to text colors for tagged rem
CSS
[data-rem-tags~="fg-color"] .rem-text .highlight-color--red {
background-color: unset;
color: rgb(234, 67, 53); }
[data-rem-tags~="fg-color"] .rem-text .highlight-color--orange {
background-color: unset;
color: rgb(194, 111, 27); }
[data-rem-tags~="fg-color"] .rem-text .highlight-color--yellow {
background-color: unset;
color: rgb(234, 183, 0); }
[data-rem-tags~="fg-color"] .rem-text .highlight-color--green {
background-color: unset;
color: rgb(52, 168, 83); }
[data-rem-tags~="fg-color"] .rem-text .highlight-color--blue {
background-color: unset;
color: rgb(66, 133, 244); }
[data-rem-tags~="fg-color"] .rem-text .highlight-color--purple {
background-color: unset;
color: rgb(161, 66, 244); }
Danger area
These things are possible, but you should not do them.
These things change the semantics of the formatting and will mess up your notes when you share them and the notes you import from other people.
Strike
TODO
Comments
TODO