D5599.diff
No OneTemporary
Actions

Size

1 KB

Referenced Files

None

Subscribers

None

D5599.diff
View Options

	diff --git a/web/markdown/markdown-spoiler.react.js b/web/markdown/markdown-spoiler.react.js
	--- a/web/markdown/markdown-spoiler.react.js
	+++ b/web/markdown/markdown-spoiler.react.js
	@@ -4,6 +4,8 @@

	import type { ReactElement } from 'lib/shared/markdown';

	+import css from './markdown.css';
	+
	type MarkdownSpoilerProps = {
	+text: ReactElement,
	};
	@@ -11,7 +13,7 @@
	function MarkdownSpoiler(props: MarkdownSpoilerProps): React.Node {
	const { text } = props;

	- return <span>{text}</span>;
	+ return <span className={css.spoiler}>{text}</span>;
	}

	const MemoizedMarkdownSpoiler: React.ComponentType<MarkdownSpoilerProps> = React.memo<MarkdownSpoilerProps>(
	diff --git a/web/markdown/markdown.css b/web/markdown/markdown.css
	--- a/web/markdown/markdown.css
	+++ b/web/markdown/markdown.css
	@@ -76,3 +76,9 @@
	div.darkBackground a {
	color: white;
	}
	+
	+span.spoiler {
	+ background: var(--spoiler-background-color);
	+ color: var(--spoiler-text-color);
	+ cursor: pointer;
	+}
	diff --git a/web/theme.css b/web/theme.css
	--- a/web/theme.css
	+++ b/web/theme.css
	@@ -181,4 +181,6 @@
	--compose-subchannel-mark-color: var(--violet-light-100);
	--enum-option-icon-color: var(--violet-dark-100);
	--show-password-bg-hover: var(--shades-black-70);
	+ --spoiler-text-color: var(--shades-black-80);
	+ --spoiler-background-color: var(--shades-black-80);
	}