Fix outdated PrismJS line-highlight CSS rules to avoid webpack warnings.

config/RtlCssPlugin.ts

@@ -33,7 +33,7 @@ export class RtlCssPlugin {
 				stage: Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL
 			}, assets => {
 				for (const chunk of compilation.chunks) {
-					if (chunk.name && !this.options.entries.has(chunk.name)) {
+					if (chunk.name && this.options.entries.has(chunk.name)) {
 						for (const sourceFilename of chunk.files) {
 							if ('.css' === path.extname(sourceFilename)) {
 								const rtlFilename = this.options.transformFilename(sourceFilename)

src/css/prism.scss

@@ -1,17 +1,82 @@
 @import '~prismjs/themes/prism.css';
-@import '~prismjs/plugins/line-highlight/prism-line-highlight.css';
 @import '~prismjs/plugins/line-numbers/prism-line-numbers.css';
 @import '~prismjs/plugins/toolbar/prism-toolbar.css';
 @import '~prismjs/plugins/inline-color/prism-inline-color.css';
 @import '~prismjs/plugins/previewers/prism-previewers.css';
 @import '~prismjs/plugins/autolinker/prism-autolinker.css';
 
-:not(.is-style-prism-shades-of-purple) pre[class*=language-].line-numbers .line-highlight {
-	box-sizing: border-box;
-	padding: 0;
-	margin: 1em 0 0;
+/* These lines are taken from '~prismjs/plugins/inline-color/prism-inline-color.css', adjusted to avoid autoprefixer
+complaining about deprecated syntax. Ideally, they can be removed if the file in question is updated. */
+
+pre[data-line] {
+	position: relative;
+	padding: 1em 0 1em 3em;
+}
+
+.line-highlight {
+	position: absolute;
+	left: 0;
+	right: 0;
+	padding: inherit;
+	margin-top: 1em;
+	background: hsla(24, 20%, 50%, .08);
+	background: linear-gradient(to right, hsla(24, 20%, 50%, .1) 70%, hsla(24, 20%, 50%, 0));
+	pointer-events: none;
+	line-height: inherit;
+	white-space: pre;
+
+	@media print {
+		print-color-adjust: exact;
+	}
+
+	&:before, &[data-end]:after {
+		content: attr(data-start);
+		position: absolute;
+		top: .4em;
+		left: .6em;
+		min-width: 1em;
+		padding: 0 .5em;
+		background-color: hsla(24, 20%, 50%, .4);
+		color: hsl(24, 20%, 95%);
+		font: bold 65%/1.5 sans-serif;
+		text-align: center;
+		vertical-align: .3em;
+		border-radius: 999px;
+		text-shadow: none;
+		box-shadow: 0 1px white;
+	}
+
+	&[data-end]:after {
+		content: attr(data-end);
+		top: auto;
+		bottom: .4em;
+	}
+
+	.line-numbers &:before, .line-numbers &:after {
+		content: none;
+	}
+
+	/* Additional fixes to the behaviour of line highlighting with certain themes. */
+
+	:not(.is-style-prism-shades-of-purple) pre[class*=language-].line-numbers & {
+		box-sizing: border-box;
+		padding: 0;
+		margin: 1em 0 0;
+	}
+
+	.is-style-prism-coy-without-shadows pre[class*=language-] & {
+		margin-top: 0;
+	}
 }
 
-.is-style-prism-coy-without-shadows pre[class*=language-] .line-highlight {
-	margin-top: 0;
+pre[id].linkable-line-numbers span.line-numbers-rows {
+	pointer-events: all;
+
+	> span:before {
+		cursor: pointer;
+	}
+
+	> span:hover:before {
+		background-color: rgba(128, 128, 128, .2);
+	}
 }

src/js/services/settings/editor-preview.ts

@@ -14,6 +14,7 @@ const initialiseCodeMirror = () => {
 	}
 
 	console.error('Could not initialise CodeMirror on textarea.', textarea)
+	return undefined
 }
 
 export const handleEditorPreviewUpdates = () => {