style.css

body {
	margin: 1em;
	font-family: sans-serif;
}

#json-container {
	display: none;
}

#json {
	width: 100%;
	height: 400px;
}

#flex-container {
	display: flex;
}

#rich-text {
	width: 65%;
	height: 425px;
	border: 1px solid black;
	cursor: text;
	overflow: scroll;
	resize: both;
	/* in Chrome, must have display: inline-block for contenteditable=true to prevent it from adding <div> <p> and <span> when you type. This fixes GitHub bug #23 double enter when hitting enter at end of file and #24 hitting backspace at end does not work*/
	display: inline-block;
	line-height: 1.3;
}

#definition {
	width: 35%;
	height: 425px;
	border: 1px solid black;
	overflow: scroll;
	resize: both;
}

/* color ideas: https://encycolorpedia.com/websafe */

/* PRE PARSING DIRECTIVES */
.uboPreParsingDirective {background-color: #C586AB}
.agHint {background-color: #C586AB}

/* COMMENTS */
.comment {background-color: #6A9955}

/* DOMAINS */
.hosts {background-color: black; color: white;}

.domain {background-color: #CE9178}
.exception {background-color: #D4D4D4}

.domainRegEx {background-color: navy; color: white;}
.exceptionRegEx {background-color: yellow}

/* SELECTORS */
.option {background-color: lightblue}

.selector {background-color: #DCDCAA}
.agStyling {background-color: #DCDCAA}

.selectorException {background-color: limegreen}
.agStylingException {background-color: limegreen}

.htmlFilter {background-color: orange}

.htmlFilterException {background-color: blue; color: white;}

.abpExtendedSelector {background-color: rgba(112, 55, 16, 0.808); color: white;}
.agExtendedSelector {background-color: rgba(112, 55, 16, 0.808); color: white;}
.agAdvancedStyling {background-color: rgba(112, 55, 16, 0.808); color: white;}

.agExtendedSelectorException {background-color: maroon; color: white;}
.agAdvancedStylingException {background-color: maroon; color: white;}

/* ACTION OPERATORS */
.actionOperator {background-color: gold}
.agActionOperator {background-color: gold}

/* SCRIPTS */
.uboScriptlet {background-color: pink}
.abpSnippet {background-color: pink}
.agJSRule {background-color: pink}

.uboScriptletException {background-color: aqua}
.agJSException {background-color: aqua}

/* WHITESPACE */
.whitespaceFront {background-color: #569CD6; color: white;}
.whitespaceBack {background-color: #569CD6; color: white;}

/* ERRORS */
.error {background-color: red !important; color: black;}