Theme demonstrating multiple header styles

FoldingText
1

Continuing the discussion from Visual cues for headers:

Yes, after installing this theme FoldingText h1, h2, and h3 headers will have distinct styling.

.CodeMirror {
	.cm-heading {
		font-weight: normal;
	}

	.cm-heading[cm-level="1"] {
		font-style: normal;
		font-weight: bold;

		// You can also change the size by uncommenting
		// the following two lines.
		//font-size: @fontSize * 1.5;
		//line-height: @lineHeight * 1.5;
	}

	.cm-heading[cm-level="2"] {
		font-style: italic;
		font-weight: normal;
	}
}```
2

Hi Jesse,

This is useful! Can I ask whether it’s possible to style a particular heading? For example, ## IMPORTANT always turns red?

Thanks in advance,

Mark

3

Sorry I don’t think so. FoldingText styling is all done directly through DOM/CSS … and when searching I just found this:

https://stackoverflow.com/questions/1777357/css-rule-based-on-content

Which says you can’t use CSS to style based on element text content. I think best approach here would be to add an @important tag and styled based on that.

4

Thanks, Jesse. Appreciate your response, as always.