İçeriğe atla

MediaWiki:Gadget-Colors.css

Deltarune Wiki sitesinden

Not: Yayımladıktan sonra değişiklikleri görmeniz için tarayıcınızın önbelleğini temizlemeniz gerekebilir.

  • Firefox / Safari: Shift tuşuna basılıyken Yeniden Yükle'ye tıklayın ya da Ctrl-F5 ya da Ctrl-R tıklayın (Mac için ⌘-R)
  • Google Chrome: Ctrl-Shift-R'ye basın. (Mac için ⌘-Shift-R)
  • Edge: Ctrl basılıyken Yenile'ye tıklayın ya da Ctrl-F5'e basın.
/* Color configuration applying to all themes */
html.skin-theme-clientpref-night,
html.skin-theme-clientpref-os,
html.skin-theme-clientpref-day {
	/* Set visited links to the same color as regular links */
	--color-visited: var(--color-progressive);
	--color-visited--hover: var(--color-progressive--hover);
	--color-visited--active: var(--color-progressive--active);
	--color-base--hover: var(--color-base);

	/* Error colors */
	--background-color-error--active: var(--background-color-error--hover);
	--color-destructive: var(--border-color-error);
	--color-destructive--hover: var(--border-color-error--hover);
	--color-destructive--active: var(--border-color-error--hover);
	--color-destructive--visited: var(--color-destructive);
	--color-destructive--visited--hover: var(--color-destructive--hover);
	--color-destructive--visited--active: var(--color-destructive--active);

	--color-emphasized: var(--color-base);
	--color-progressive--active: var(--color-progressive--hover);
	--background-color-progressive-subtle: var(--background-color-progressive);
	--background-color-progressive--active: var(--background-color-progressive--hover);
	--border-color-progressive: var(--background-color-progressive);
	--border-color-progressive--active: var(--background-color-progressive--hover);
	--border-color-progressive--hover: var(--background-color-progressive--hover);

	--color-destructive--focus: var(--color-inverted-fixed);
	--color-progressive--focus: var(--color-progressive--hover);
	--box-shadow-color-progressive--focus: var(--background-color-progressive);
	--border-color-progressive--focus: var(--background-color-progressive);
	--background-color-progressive--focus: var(--background-color-progressive);
	--box-shadow-color-destructive--focus: var(--color-inverted-fixed);
	--background-color-destructive--focus: var(--color-inverted-fixed);
	--background-color-destructive-subtle: var(--background-color-error--hover);
	--border-color-destructive--focus: var(--color-inverted-fixed);
	--outline-color-progressive--focus: var(--color-inverted-fixed);

	--background-color-interactive-subtle: var(--background-color-neutral);
	--background-color-notice-subtle: var(--background-color-neutral);
	--border-color-interactive: var(--background-color-progressive);

	/* Colors on diff pages and byte difference counters */
	--color-content-added: var(--color-success);
	--color-content-removed: var(--background-color-error);
	--background-color-content-added: var(--color-success);
	--background-color-content-removed: var(--background-color-error);
	--border-color-content-added: var(--color-success);
	--border-color-content-removed: var(--background-color-error);
	--background-color-error-subtle: color-mix(in srgb, var(--background-color-error) 25%, var(--color-inverted));
	--background-color-warning-subtle: color-mix(in srgb, var(--color-warning) 25%, var(--color-inverted));
	--background-color-success-subtle: color-mix(in srgb, var(--color-success) 25%, var(--color-inverted));

	/* For inverting colors on dark theme */
	--invert-on-dark: none;
}

/* Dark theme colors */
html.skin-theme-clientpref-night {
	--background-image: url("/bg-dark.png?v=3");
	--background-color-base: #000; /* --theme-page-background-color */
	--color-base: #e6e6e6; /* --theme-page-text-color */
	--color-base--rgb: 230, 230, 230;
	--color-progressive: #00e4fe; /* --theme-link-color */
	--color-progressive--hover: #65efff; /* --theme-link-color--hover */
	--color-inverted-fixed: #fff; /* --theme-accent-label-color. Wikimedia says this should be unchanging between light and dark themes, then proceeds to use it in label colors... */
	--border-color-base: #3a3a3a; /* --theme-border-color */
	--background-color-neutral: #262626; /* --theme-page-background-color--secondary */
	--background-color-neutral-subtle: #131313; /* Wikitable background, between --background-color-base and --background-color-neutral */
	--background-color-progressive: #007ddf; /* --theme-accent-color */
	--background-color-progressive--hover: #1F9AFF; /* --theme-accent-color--hover */
	--background-color-progressive-subtle: rgba(0, 228, 254, 0.3); /* --theme-link-color--rgb */

	/* Used for the temporary user banner and disabled buttons */
	--color-inverted: #101418;
	--border-color-inverted: #101418;
	--background-color-inverted: #f8f9fa;
	--background-color-backdrop-light: rgba(0, 0, 0, 0.65);
	--background-color-backdrop-dark: rgba(255, 255, 255, 0.65);

	/* Error/warning/success colors, also used for diffs */
	--color-error: #d33; /* hardcoded background for .error */
	--color-warning: #cf721c; /* --theme-warning-color */
	--color-success: #0c742f; /* --theme-success-color */
	--background-color-error: #bf0017; /* --theme-alert-color */
	--background-color-error--hover: #59000b; /* hardcoded background for the delete button */
	--color-base-fixed: rgba(0, 0, 0, 0.65);
	--border-color-error: #e7001b; /* --theme-alert-color--secondary */
	--border-color-warning: #cf721c; /* --theme-warning-color--secondary */
	--border-color-success: #0d8636; /* --theme-success-color--secondary */
	--border-color-error--hover: #fe2540; /* --theme-alert-color--hover */

	/* For inverting colors on dark theme */
	--invert-on-dark: invert(1);

	/* I don't know how to remap these colors */
	--color-notice: #f8f9fa;
	--color-base--subtle: #a2a9b1;
	--background-color-interactive: #27292d;
	--background-color-disabled: #54595d;
	--background-color-disabled-subtle: #404244;
	--border-color-subtle: #54595d;
	--border-color-muted: #404244;
	--border-color-disabled: #54595d;
	--border-color-notice: #c8ccd1;
	--box-shadow-color-inverted: #000;
}

/* Light theme colors */
html.skin-theme-clientpref-os,
html.skin-theme-clientpref-day {
	--background-image: url("/bg-light.png?v=1");
	--background-color-base: #f7f3ea;
	--color-base: #3a2b28;
	--color-base--rgb: 58, 43, 40;
	--color-progressive: #e09300;
	--color-progressive--hover: #995600;
	--color-inverted-fixed: #fff;
	--border-color-base: #ba9989;
	--background-color-neutral: #eee7e0;
	--background-color-neutral-subtle: #f4eee2;
	--background-color-progressive: #b55e1e;
	--background-color-progressive--hover: #B41F08;
	--background-color-progressive-subtle: rgba(255, 177, 0, 0.3);
	--color-inverted: #fff;
	--border-color-inverted: #fff;
	--background-color-inverted: #101418;
	--background-color-backdrop-light: rgba(255, 255, 255, 0.65);
	--background-color-backdrop-dark: rgba(0, 0, 0, 0.65);
	--color-notice: #202122;
	--color-base--subtle: #54595d;
	--background-color-interactive: #eaecf0;
	--background-color-disabled: #c8ccd1;
	--background-color-disabled-subtle: #eaecf0;
	--border-color-subtle: #c8ccd1;
	--border-color-muted: #dadde3;
	--border-color-disabled: #c8ccd1;
	--border-color-notice: #54595d;
	--box-shadow-color-inverted: #fff;
	--color-error: #d33;
	--color-warning: #886425;
	--color-success: #099979;
	--background-color-error: #f54739;
	--background-color-error--hover: #d74032;
	--color-base-fixed: rgba(0, 0, 0, 0.65);
	--border-color-error: #f54739;
	--border-color-warning: #ab7f2a;
	--border-color-success: #099979;
	--border-color-error--hover: #fd7865;
}

/* Dark theme colors but if the "Automatic" theme was selected */
/* Copy and paste of the other dark theme color block */
@media screen and (prefers-color-scheme: dark) {
	html.skin-theme-clientpref-os {
		--background-image: url("/bg-dark.png?v=3");
		--background-color-base: #000; /* --theme-page-background-color */
		--color-base: #e6e6e6; /* --theme-page-text-color */
		--color-base--rgb: 230, 230, 230;
		--color-progressive: #00e4fe; /* --theme-link-color */
		--color-progressive--hover: #65efff; /* --theme-link-color--hover */
		--color-inverted-fixed: #fff; /* --theme-accent-label-color. Wikimedia says this should be unchanging between light and dark themes, then proceeds to use it in label colors... */
		--border-color-base: #3a3a3a; /* --theme-border-color */
		--background-color-neutral: #262626; /* --theme-page-background-color--secondary */
		--background-color-neutral-subtle: #131313; /* Wikitable background, between --background-color-base and --background-color-neutral */
		--background-color-progressive: #007ddf; /* --theme-accent-color */
		--background-color-progressive--hover: #1F9AFF; /* --theme-accent-color--hover */
		--background-color-progressive-subtle: rgba(0, 228, 254, 0.3); /* --theme-link-color--rgb */
	
		/* Used for the temporary user banner and disabled buttons */
		--color-inverted: #101418;
		--border-color-inverted: #101418;
		--background-color-inverted: #f8f9fa;
		--background-color-backdrop-light: rgba(0, 0, 0, 0.65);
		--background-color-backdrop-dark: rgba(255, 255, 255, 0.65);
	
		/* Error/warning/success colors, also used for diffs */
		--color-error: #d33; /* hardcoded background for .error */
		--color-warning: #cf721c; /* --theme-warning-color */
		--color-success: #0c742f; /* --theme-success-color */
		--background-color-error: #bf0017; /* --theme-alert-color */
		--background-color-error--hover: #59000b; /* hardcoded background for the delete button */
		--color-base-fixed: rgba(0, 0, 0, 0.65);
		--border-color-error: #e7001b; /* --theme-alert-color--secondary */
		--border-color-warning: #cf721c; /* --theme-warning-color--secondary */
		--border-color-success: #0d8636; /* --theme-success-color--secondary */
		--border-color-error--hover: #fe2540; /* --theme-alert-color--hover */
	
		/* For inverting colors on dark theme */
		--invert-on-dark: invert(1);
	
		/* I don't know how to remap these colors */
		--color-notice: #f8f9fa;
		--color-base--subtle: #a2a9b1;
		--background-color-interactive: #27292d;
		--background-color-disabled: #54595d;
		--background-color-disabled-subtle: #404244;
		--border-color-subtle: #54595d;
		--border-color-muted: #404244;
		--border-color-disabled: #54595d;
		--border-color-notice: #c8ccd1;
		--box-shadow-color-inverted: #000;
	}
}
"https://tr.deltarune.wiki/w/MediaWiki:Gadget-Colors.css?oldid=734" sayfasından alınmıştır
Konu ekle