MediaWiki:Citizen.css - Revision history

Eviand at 22:39, 7 March 2026

2026-03-07T22:39:54Z

@@ Line 1: / Line 1: @@
 /* SpiritVale Wiki — Citizen.css */
 /* Theme tokens, Citizen skin overrides, and global chrome polish. */
 /* -------------------------------------------------------------------------- */
@@ Line 335: / Line 363: @@
 /* -------------------------------------------------------------------------- */
-/* 11) Mobile glass removal */
+/* 11) Default viewpoint safety (<640px)                                      */
 /* -------------------------------------------------------------------------- */
-@media (max-width:500px){
+/* Mobile glass removal stays theme-owned and is mapped to the default        */
    :root{
      --backdrop-filter-frosted-glass:none !important;

Eviand at 22:13, 6 March 2026

2026-03-06T22:13:58Z

Show changes

Eviand at 04:59, 4 March 2026

2026-03-04T04:59:52Z

← Older revision		Revision as of 04:59, 4 March 2026
Line 354:		Line 354:
	.cdx-message.cdx-message--error:not(.cdx-message--inline) .cdx-message__icon{ color:#ff3b30 !important; }		.cdx-message.cdx-message--error:not(.cdx-message--inline) .cdx-message__icon{ color:#ff3b30 !important; }
	.cdx-message.cdx-message--success:not(.cdx-message--inline) .cdx-message__icon{ color:#18c37e !important; }		.cdx-message.cdx-message--success:not(.cdx-message--inline) .cdx-message__icon{ color:#18c37e !important; }

			/* ============================================================
			Diff highlights (history/compare) — match Codex message palette
			- Added lines: match cdx-message--success
			- Deleted lines: match cdx-message--error
			============================================================ */

			.diff-addedline .diffchange{
			background:#172d26 !important; /* success bg */
			color:#ffffff !important;
			}

			.diff-deletedline .diffchange{
			background:#3e1d17 !important; /* error bg */
			color:#ffffff !important;
			}

			/* Links inside diff highlights */
			.diff-addedline .diffchange a,
			.diff-addedline .diffchange a:visited,
			.diff-deletedline .diffchange a,
			.diff-deletedline .diffchange a:visited{
			color:#2f78ff !important;
			}

Eviand at 04:44, 4 March 2026

2026-03-04T04:44:54Z

@@ Line 7: / Line 7: @@
 - Exports Citizen theme vars -> Common.css --sv-ui-* tokens
 - Mobile (<=500): no frosted glass / no transparency
 ============================================================ */
@@ Line 285: / Line 286: @@
 color:#0b1a33 !important;
+}
 body.skin-citizen select#namespace:focus option,
 body.skin-citizen select#mw-search-ns:focus option,
@@ Line 291: / Line 291: @@
 color:#0b1a33 !important;
+}

Eviand at 04:51, 25 February 2026

2026-02-25T04:51:38Z

@@ Line 272: / Line 272: @@
 body.skin-citizen .cdx-menu-item__text,
 body.skin-citizen .cdx-menu-item__label{
 color:#0b1a33 !important;
+}

Eviand at 04:47, 25 February 2026

2026-02-25T04:47:47Z

@@ Line 256: / Line 256: @@
 backdrop-filter:none !important;
+}
+}

Eviand at 06:33, 23 February 2026

2026-02-23T06:33:48Z

Show changes

Eviand at 06:07, 23 February 2026

2026-02-23T06:07:06Z

← Older revision		Revision as of 06:07, 23 February 2026
Line 27:		Line 27:

	/* Surfaces (set directly so it cannot “stay white”) */		/* Surfaces (set directly so it cannot “stay white”) */
	--color-surface-0:#~~dbeaff~~ !important;		--color-surface-0:#bcd4ff !important;
	--color-surface-1:#~~e8f2ff~~ !important;		--color-surface-1:#c9dcff !important;
	--color-surface-2:#~~f3f8ff~~ !important;		--color-surface-2:#d6e5ff !important;
	--color-surface-3:#~~cfe3ff~~ !important;		--color-surface-3:#a7c6ff !important;
	--color-surface-4:#~~bdd7ff~~ !important;		--color-surface-4:#93b7ff !important;

	/* Also tune the OKLCH inputs so any derived/internal use matches */		/* Also tune the OKLCH inputs so any derived/internal use matches */

Eviand: Created page with "/* ============================================================ SpiritVale Wiki — Citizen.css Blue System v0.2 (Hard Theme Override) - Light: light blue canvas (not white) - Dark: very dark blue canvas - Uses Citizen’s documented theme classes: .skin-theme-clientpref-day / night / os - Forces page canvas containers to use our surfaces - Mobile (<=500): no frosted glass / no transparency ============================================================ / / -----------..."

2026-02-23T06:00:14Z

Created page with "============================================================ SpiritVale Wiki — Citizen.css Blue System v0.2 (Hard Theme Override) - Light: light blue canvas (not white) - Dark: very dark blue canvas - Uses Citizen’s documented theme classes: .skin-theme-clientpref-day / night / os - Forces page canvas containers to use our surfaces - Mobile (<=500): no frosted glass / no transparency ============================================================: /* -----------..."

New page

/* ============================================================
SpiritVale Wiki — Citizen.css
Blue System v0.2 (Hard Theme Override)
- Light: light blue canvas (not white)
- Dark: very dark blue canvas
- Uses Citizen’s documented theme classes:
.skin-theme-clientpref-day / night / os
- Forces page canvas containers to use our surfaces
- Mobile (<=500): no frosted glass / no transparency
============================================================ */

/* ------------------------------------------------------------
0) Shared tweaks
------------------------------------------------------------ */
:root{
--transform-image-hover:none;
}

/* ------------------------------------------------------------
1) LIGHT MODE (Day)
------------------------------------------------------------ */
:root.skin-theme-clientpref-day{
/* Primary (accent) hue -> blue */
--color-progressive-oklch__h:225 !important;
--color-progressive-oklch__c:0.170 !important;
--color-progressive-oklch__l:56% !important;

/* Surfaces (set directly so it cannot “stay white”) */
--color-surface-0:#dbeaff !important;
--color-surface-1:#e8f2ff !important;
--color-surface-2:#f3f8ff !important;
--color-surface-3:#cfe3ff !important;
--color-surface-4:#bdd7ff !important;

/* Also tune the OKLCH inputs so any derived/internal use matches */
--color-surface-0-oklch__l:93% !important;
--color-surface-0-oklch__c:0.040 !important;

/* Text */
--color-emphasized:#0b1a33 !important;
--color-base:#1f3556 !important;
--color-subtle:#456083 !important;

/* Links (blue-only; kill purple visited) */
--color-link:#0b63f0 !important;
--color-link--hover:#0a56d1 !important;
--color-link--active:#0847ad !important;
--color-visited:#2b7bff !important;
--color-visited--hover:#1f6fff !important;
--color-visited--active:#155fe0 !important;

/* Some MW/Citizen pieces use these fixed vars */
--background-color-base-fixed:var(--color-surface-0) !important;
}

/* ------------------------------------------------------------
2) DARK MODE (Night)
------------------------------------------------------------ */
:root.skin-theme-clientpref-night{
/* Primary (accent) hue -> blue */
--color-progressive-oklch__h:225 !important;
--color-progressive-oklch__c:0.170 !important;
--color-progressive-oklch__l:60% !important;

/* Surfaces (very dark blues) */
--color-surface-0:#050d1a !important;
--color-surface-1:#071225 !important;
--color-surface-2:#0b1a33 !important;
--color-surface-3:#10264b !important;
--color-surface-4:#14315f !important;

/* Keep OKLCH inputs aligned */
--color-surface-0-oklch__l:10% !important;
--color-surface-0-oklch__c:0.040 !important;

/* Text */
--color-emphasized:#eaf2ff !important;
--color-base:#c9d8f2 !important;
--color-subtle:#9fb3d8 !important;

/* Links (blue-only) */
--color-link:#5aa6ff !important;
--color-link--hover:#7bb8ff !important;
--color-link--active:#3f95ff !important;
--color-visited:#7bb8ff !important;
--color-visited--hover:#9acbff !important;
--color-visited--active:#5aa6ff !important;

--background-color-base-fixed:var(--color-surface-0) !important;
}

/* ------------------------------------------------------------
3) AUTOMATIC MODE (OS)
------------------------------------------------------------ */
@media (prefers-color-scheme:light){
:root.skin-theme-clientpref-os{
--color-progressive-oklch__h:225 !important;
--color-progressive-oklch__c:0.170 !important;
--color-progressive-oklch__l:56% !important;
--color-surface-0:#dbeaff !important;
--color-surface-1:#e8f2ff !important;
--color-surface-2:#f3f8ff !important;
--color-surface-3:#cfe3ff !important;
--color-surface-4:#bdd7ff !important;
--color-surface-0-oklch__l:93% !important;
--color-surface-0-oklch__c:0.040 !important;
--color-emphasized:#0b1a33 !important;
--color-base:#1f3556 !important;
--color-subtle:#456083 !important;
--color-link:#0b63f0 !important;
--color-visited:#2b7bff !important;
--background-color-base-fixed:var(--color-surface-0) !important;
}
}
@media (prefers-color-scheme:dark){
:root.skin-theme-clientpref-os{
--color-progressive-oklch__h:225 !important;
--color-progressive-oklch__c:0.170 !important;
--color-progressive-oklch__l:60% !important;
--color-surface-0:#050d1a !important;
--color-surface-1:#071225 !important;
--color-surface-2:#0b1a33 !important;
--color-surface-3:#10264b !important;
--color-surface-4:#14315f !important;
--color-surface-0-oklch__l:10% !important;
--color-surface-0-oklch__c:0.040 !important;
--color-emphasized:#eaf2ff !important;
--color-base:#c9d8f2 !important;
--color-subtle:#9fb3d8 !important;
--color-link:#5aa6ff !important;
--color-visited:#7bb8ff !important;
--background-color-base-fixed:var(--color-surface-0) !important;
}
}

/* ------------------------------------------------------------
4) FORCE PAGE CANVAS BACKGROUNDS (this is the “still white” killer)
Citizen sets: body { background: var(--color-surface-0) }
We also remove any background-image/gradients on common wrappers.
------------------------------------------------------------ */
body.skin-citizen{
background-color:var(--color-surface-0) !important;
background-image:none !important;
color:var(--color-base) !important;
}
body.skin-citizen .citizen-body-container,
body.skin-citizen .citizen-page-container{
background-color:var(--color-surface-0) !important;
background-image:none !important;
}
body.skin-citizen .mw-body,
body.skin-citizen .mw-content-container{
background-color:transparent !important;
background-image:none !important;
}

/* ------------------------------------------------------------
5) Link visibility (keep obvious)
------------------------------------------------------------ */
body.skin-citizen .mw-parser-output a{
text-decoration:underline;
text-decoration-thickness:2px;
text-underline-offset:2px;
}
body.skin-citizen .mw-parser-output a:hover{
text-decoration-thickness:3px;
}

/* ------------------------------------------------------------
6) Citizen search trigger micro-interaction
------------------------------------------------------------ */
.citizen-search-trigger{
transition:transform 0.15s ease-in-out;
}
.citizen-search-trigger:hover{
transform:translateY(-2px);
}

/* ------------------------------------------------------------
7) Mobile hard rule: no frosted glass / no transparency (<=500)
------------------------------------------------------------ */
@media (max-width:500px){
:root{
--backdrop-filter-frosted-glass:none !important;
--opacity-glass:1 !important;
}
body.skin-citizen .citizen-menu__card,
body.skin-citizen .citizen-drawer__card,
body.skin-citizen .citizen-search__form,
body.skin-citizen .citizen-search__footer{
background:var(--color-surface-1) !important;
-webkit-backdrop-filter:none !important;
backdrop-filter:none !important;
}
}