chore: reset selection color in editor (#280)

tomoam · web-flow · commit 8ef8769c3fe1 · 2023-03-21T23:02:28.000-04:00
* chore: reset selection color in editor

* chore: background-color for dark mode in editor
diff --git a/src/routes/tutorial/[slug]/codemirror.css b/src/routes/tutorial/[slug]/codemirror.css
@@ -6,6 +6,10 @@
 	height: 100%;
 }
 
+.cm-editor ::selection {
+	color: revert;
+}
+
 .cm-editor .cm-scroller {
 	font-family: var(--font-mono);
 	font-size: 1.3rem;
@@ -80,7 +84,7 @@
 	}
 
 	.cm-editor .cm-activeLine {
-		background-color: var(--sk-back-2);
+		background-color: hsl(0, 0%, 40%, 0.2);
 	}
 
 	.cm-editor .cm-diagnostic-warning {
@@ -90,4 +94,15 @@
 	.cm-editor .cm-diagnostic-warning {
 		background: hsl(39, 100%, 10%);
 	}
+
+	.cm-editor.cm-focused .cm-selectionBackground,
+	.cm-editor .cm-selectionBackground,
+	.cm-editor .cm-content ::selection {
+		background: var(--sk-theme-3);
+		opacity: .3;
+	}
+
+	.cm-editor .cm-selectionMatch {
+		background: rgba(255, 255, 255, 0.2);
+	}
 }
