Merge pull request #340 from ygg2/main

improve spoilers

src/webpage/markdown.ts

@@ -1005,8 +1005,8 @@ class MarkDown {
 		}
 	}
 	static unspoil(e: any): void {
-		e.target.classList.remove("spoiler");
-		e.target.classList.add("unspoiled");
+		e.currentTarget.classList.remove("spoiler");
+		e.currentTarget.classList.add("unspoiled");
 	}
 	onUpdate: (upto: string, pre: boolean) => unknown = () => {};
 	box = new WeakRef(document.createElement("div"));

src/webpage/style.css

@@ -2857,19 +2857,28 @@ input[type="search"]:read-only {
 	background: var(--spoiler-bg);
 	color: var(--spoiler-bg);
 	cursor: pointer;
-	a {
+	samp, a {
+		background: transparent;
+		color: inherit;
+	}
+	pre, .quote {
+		background: var(--spoiler-bg);
 		color: var(--spoiler-bg);
 	}
 }
 .spoiler:hover {
 	background: var(--spoiler-hover);
 	color: var(--spoiler-hover);
+	pre, .quote {
+		background: var(--spoiler-hover);
+		color: var(--spoiler-hover);
+	}
 }
 .unspoiled {
-	color: var(--spoiler-text);
-}
-a.unspoiled {
-	color: var(--link) !important;
+	background: var(--spoiler-unspoiled);
+	.quote {
+		background: var(--spoiler-unspoiled);
+	}
 }
 .quote {
 	display: inline-block;

src/webpage/themes.css

@@ -108,14 +108,13 @@
 
 	--button-bg: #babdd2;
 	--button-hover: #9c9fbf;
-	--spoiler-bg: #34333a;
+	--spoiler-bg: #c7c6e5;
 	--link: #283c8b;
 
 	--black: #434392;
 	--red: #ca304d;
 	--secondary-text-soft: #211f2e;
 	--blank-bg: #494985;
-	--spoiler-text: #e4e6ed;
 }
 
 .Dark-Accent-theme {
@@ -174,8 +173,8 @@ body {
 	--message-jump-bg: color-mix(in srgb, var(--accent-color) 20%, transparent);
 	--code-bg: var(--secondary-bg);
 	--code-text: var(--secondary-text);
-	--spoiler-text: var(--primary-text);
 	--spoiler-hover: color-mix(in srgb, var(--spoiler-bg), var(--primary-text-soft) 10%);
+	--spoiler-unspoiled: color-mix(in srgb, var(--primary-text-soft) 15%, var(--primary-bg));
 	--quote-line: color-mix(in srgb, var(--primary-text-soft), transparent);
 	--reply-line: color-mix(in srgb, var(--primary-text-soft) 20%, transparent);
 	--reply-text: var(--primary-text-soft);