MediaWiki:Gadget-brownTheme.css

From The Deadlock Wiki
Jump to navigation Jump to search

Note: After publishing, you may need to reload with your cache disabled to see your changes.

  • Windows / Linux: Press Ctrl-Shift-R
  • macOS: Press ⌘-Shift-R
:root[data-theme="brown"] {
	--base: #241c16;
	--accent: #60f8b3;
	
	--link-color: var(--accent);
	--color-progressive: var(--accent);
	--color-visited: var(--accent);
	--color-visited--hover: var(--accent);
	--color-visited--active: var(--accent);

	--color-content-added: #009c00;
	--background-color-success-subtle: #009c00;
	--border-color-success: #009c00;

	--color-destructive: #e64835;
	--border-color-error: #e64835;
	--color-destructive--visited--active: #e64835;
	--background-color-content-removed: #ff4e4e;

	--border-color-warning: #ab7f2a;

	--color-progressive--hover: var(--accent);

	--bg-image-color: transparent;

	--background-color-base: var(--base);
	--background-color-base-border: oklch(from var(--base) calc(l - 0.06) c h);
	--background-color-base-subtle: oklch(from var(--base) calc(l - 0.09) c h);
	--background-color-base-subtle-border: oklch(from var(--base) calc(l - 0.06) c h);
	--background-color-light: oklch(from var(--base) calc(l + 0.05) calc(c + 0.011) h);
	--background-color-base-2: oklch(from var(--base) calc(l + 0.07) c h);
	--background-color-base-3: oklch(from var(--base) calc(l + 0.12) c h);
	--background-color-base-4: oklch(from var(--base) calc(l + 0.17) c h);
	--background-color-base-5: oklch(from var(--base) calc(l + 0.22) c h);
	--background-color-neutral-subtle: oklch(from var(--base) calc(l + 0.07) c h);
	--background-color-neutral: var(--base);
	--background-color-interactive-subtle: var(--base);
	--background-color-interactive: oklch(from var(--base) calc(l + 0.07) c h);
	--background-color-disabled: oklch(from var(--base) calc(l + 0.03) c h);
	--background-color-disabled-subtle: var(--base);

	--border-color-base: oklch(from var(--base) calc(l + 0.27) c h);
	--border-color-subtle: oklch(from var(--base) calc(l + 0.19) c h / 0.96);
	--border-color-muted: oklch(from var(--base) calc(l + 0.19) c h / 0.96);
	--border-color-disabled: oklch(from var(--base) calc(l + 0.19) c h / 0.96);

	--color-base: oklch(from var(--base) calc(l + 0.72) c h);
	--color-emphasized: oklch(from var(--base) calc(l + 0.78) c h);
	--color-subtle: oklch(from var(--base) calc(l + 0.72) c h / 0.63);
	--color-notice: oklch(from var(--base) calc(l + 0.72) c h / 0.63);
	--color-base--hover: oklch(from var(--base) calc(l + 0.72) c h);

	--link-color--hover: oklch(from var(--accent) calc(l - 0.22) c h);
	--alt-link-color: oklch(from var(--base) calc(l + 0.72) c h);

	--color-destructive-subtle: #3e0000;
	--background-color-error-subtle: #3e0000;

	--background-color-warning-subtle: oklch(from var(--base) calc(l + 0.14) c h);

	--background-color-progressive: oklch(from var(--accent) calc(l - 0.50) c h);
	--background-color-progressive-subtle: oklch(from var(--accent) calc(l - 0.56) c h);
	--background-color-progressive-subtle--hover: oklch(from var(--accent) calc(l - 0.52) c h);
	--background-color-progressive--hover: oklch(from var(--accent) calc(l - 0.40) c h);
	--background-color-progressive--active: oklch(from var(--accent) calc(l - 0.45) c h);
	--background-color-progressive-subtle--active: oklch(from var(--accent) calc(l - 0.45) c h);

	--border-color-progressive: oklch(from var(--accent) calc(l - 0.56) c h);
	--border-color-progressive--hover: oklch(from var(--accent) calc(l - 0.48) c h);
	--border-color-progressive-subtle--active: oklch(from var(--accent) calc(l - 0.45) c h);

	--color-progressive--focus: oklch(from var(--accent) calc(l - 0.56) c h);
	--color-progressive--active: #fff;
}

:root[data-theme="brown"][data-mode="light"] {
	--base: #f5ede0;
	--accent: #0a7a4b;

	--background-color-base-border: oklch(from var(--base) calc(l + 0.06) c h);
	--background-color-base-subtle: oklch(from var(--base) calc(l + 0.09) c h);
	--background-color-base-subtle-border: oklch(from var(--base) calc(l + 0.06) c h);
	--background-color-light: oklch(from var(--base) calc(l - 0.09) c h);
	--background-color-base-2: oklch(from var(--base) calc(l - 0.07) c h);
	--background-color-base-3: oklch(from var(--base) calc(l - 0.12) c h);
	--background-color-base-4: oklch(from var(--base) calc(l - 0.17) c h);
	--background-color-base-5: oklch(from var(--base) calc(l - 0.22) c h);
	--background-color-neutral-subtle: oklch(from var(--base) calc(l - 0.07) c h);
	--background-color-interactive: oklch(from var(--base) calc(l - 0.07) c h);
	--background-color-disabled: oklch(from var(--base) calc(l - 0.03) c h);

	--border-color-base: oklch(from var(--base) calc(l - 0.27) c h);
	--border-color-subtle: oklch(from var(--base) calc(l - 0.19) c h / 0.96);
	--border-color-muted: oklch(from var(--base) calc(l - 0.19) c h / 0.96);
	--border-color-disabled: oklch(from var(--base) calc(l - 0.19) c h / 0.96);

	--color-base: oklch(from var(--base) calc(l - 0.72) c h);
	--color-emphasized: oklch(from var(--base) calc(l - 0.78) c h);
	--color-subtle: oklch(from var(--base) calc(l - 0.72) c h / 0.63);
	--color-notice: oklch(from var(--base) calc(l - 0.72) c h / 0.63);
	--color-base--hover: oklch(from var(--base) calc(l - 0.72) c h);

	--link-color--hover: oklch(from var(--accent) calc(l + 0.22) c h);
	--alt-link-color: oklch(from var(--base) calc(l - 0.72) c h);

	--color-destructive-subtle: #fde8e6;
	--background-color-error-subtle: #fde8e6;

	--background-color-warning-subtle: oklch(from var(--base) calc(l - 0.14) c h);

	--background-color-progressive: oklch(from var(--accent) calc(l + 0.50) c h);
	--background-color-progressive-subtle: oklch(from var(--accent) calc(l + 0.56) c h);
	--background-color-progressive-subtle--hover: oklch(from var(--accent) calc(l + 0.52) c h);
	--background-color-progressive--hover: oklch(from var(--accent) calc(l + 0.40) c h);
	--background-color-progressive--active: oklch(from var(--accent) calc(l + 0.45) c h);
	--background-color-progressive-subtle--active: oklch(from var(--accent) calc(l + 0.45) c h);

	--border-color-progressive: oklch(from var(--accent) calc(l + 0.56) c h);
	--border-color-progressive--hover: oklch(from var(--accent) calc(l + 0.48) c h);
	--border-color-progressive-subtle--active: oklch(from var(--accent) calc(l + 0.45) c h);

	--color-progressive--focus: oklch(from var(--accent) calc(l + 0.56) c h);
	--color-progressive--active: #000;
}