Syntax-highlighting minimum theme

Development
1

What is the minimum theme to get everything the same color and style with Frameworks / Syntax Highlighting Engine · GitLab?

(i want to experiment with what parts do i really want to syntax highlight)

first i tried this test.theme:

{
	"metadata": {
		"name": "TEST",
		"revision": 1
	},
	"text-styles": {
		"Normal": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		}
	}
}

but it looks like this:

test1
test1502×502 13.1 KB

  • is this normal behaviour?
  • i would assume that when not otherwise defined, everything would use “Normal” style, no?

heres my test qml code:

import QtQuick
import QtQuick.Controls
import org.kde.syntaxhighlighting

Window {
	id: root
	width: 640
	height: 480
	visible: true
	color: "#111" // TODO: foo bar
	signal justatest() // TODO: interesting!
	property font myFont: ({
		family: "monospace",
		pixelSize: 12
	})
	function readSelf() {
		let req = new XMLHttpRequest();
		req.open("GET", "test.qml", false);
		req.send(null);
		textArea.text = req.responseText;
	}
	FontMetrics {
		id: fm;
		font: myFont
	}
	Flickable {
		anchors.fill: parent
		boundsBehavior: Flickable.StopAtBounds
		TextArea.flickable: TextArea {
			id: textArea
			color: "#888"
			font: myFont
			tabStopDistance: Math.round(fm.averageCharacterWidth) * 3
			SyntaxHighlighter {
				id: syntaxHilite
				textEdit: textArea
				repository: Repository
				theme: "TEST"
				definition: "QML"
			}
			Component.onCompleted: readSelf()
		}
		Shortcut {
			sequence: "ctrl+q"
			onActivated: Qt.quit()
		}
	}
}

and a makefile i used for testing (in the syntax-highlighting clone dir):

.PHONY: build text

build:
	mkdir -p .build
	cd .build && \
	cmake .. && \
	make -j $(shell nproc)

test:
	mkdir -p ~/.local/share/org.kde.syntax-highlighting/themes
	cp test.theme ~/.local/share/org.kde.syntax-highlighting/themes/
	QML_XHR_ALLOW_FILE_READ=1 QML_DISABLE_DISTANCEFIELD=1 qml6 -I .build/bin test.qml
2

also tried with defining all? keys for “text-styles”:

{
	"metadata": {
		"name": "TEST",
		"revision": 1
	},
	"text-styles": {
		"Normal": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Keyword": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Function": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Variable": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"ControlFlow": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Operator": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"BuiltIn": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Extension": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Preprocessor": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Attribute": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"DataType": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"DecVal": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"BaseN": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Float": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Constant": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Char": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"SpecialChar": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"String": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"VerbatimString": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"SpecialString": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Import": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Comment": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Documentation": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Annotation": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"CommentVar": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"RegionMarker": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Information": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Warning": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Alert": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Error": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		},
		"Others": {
			"background-color": "#111",
			"selected-background-color": "#111",
			"text-color": "#888",
			"selected-text-color": "#888",
			"strike-through" : false,
			"underline" : false,
			"italic" : false,
			"bold" : false
		}
	}
}

and that looks like this:

test2
test2502×502 33 KB

  • why is first “TODO” in odd colors?
    • and next “TODO” not?
  • why is “signal” bold?
  • why is “let” italic?