← All changes | assets/css/effects.css +27 -24 0.9.6 → 1.1.10 View file →

		@@ -1,21 +1,24 @@
1	1	/**
2		- * Desktop Mode — Window effects.
	2	+ * OpenStation — Window effects.
3	3	*
4	4	* Visual treatments applied to windows by the unfocus-effect engine
5	5	* (`src/effects/unfocus-engine.ts`). The engine toggles a per-effect
6		- * class on the window root (`.desktop-mode-window`) while the window
	6	+ * class on the window root (`.os-window`) while the window
7	7	* is NOT focused; each effect ships the matching rule here (or, for
8	8	* plugin effects, in the plugin's own stylesheet).
9	9	*
10	10	* The fade is driven by the `filter` entry in the shared
11		- * `.desktop-mode-window` transition (see `window-chrome.css`), so
	11	+ * `.os-window` transition (see `window-chrome.css`), so
12	12	* effects that animate via `filter` get a smooth two-way transition as
13	13	* focus moves between windows — and collapse to instant under
14	14	* `prefers-reduced-motion` along with every other window transition.
15	15	*
16		- * Loaded as an @import from `windows.css` so it ships under the single
17		- * `desktop-mode-windows` style handle.
	16	+ * Registered as its own `os-effects` style handle, chained
	17	+ * by dependency between `os-settings` and
	18	+ * `os-window-links` so its position in the cascade matches
	19	+ * where it sat when these sheets were `@import`ed. Enqueuing
	20	+ * `os-windows` still pulls it in via that chain.
18	21	*
19	22	* @since 0.26.0
20	23	*/
21	24
		@@ -23,9 +26,9 @@
23	26	* Built-in effect tuning knobs. Every shipped effect is driven by
24	27	* custom properties so a theme or plugin can re-tune the intensity
25	28	* without overriding the whole rule (and so the values read as a set).
26	29	*/
27		-.desktop-mode-window {
	30	+.os-window {
28	31	/* How long an effect takes to ramp in/out as focus moves between
29	32	* windows. Drives the `filter` entry of the shared window
30	33	* transition (see `window-chrome.css`); applies to every
31	34	* filter-based effect (darken, frost, grayscale) in BOTH
		@@ -31,22 +34,22 @@
31	34	* filter-based effect (darken, frost, grayscale) in BOTH
32	35	* directions — losing focus and regaining it. Bump it up for a
33	36	* slower, dreamier blur; drop it for a snappier feel. Collapses to
34	37	* instant under `prefers-reduced-motion`. */
35		- --desktop-mode-fx-transition-duration: 0.5s;
	38	+ --os-fx-transition-duration: 0.5s;
36	39
37	40	/* darken — dim + slight desaturate */
38		- --desktop-mode-fx-darken-brightness: 0.82;
39		- --desktop-mode-fx-darken-saturate: 0.92;
	41	+ --os-fx-darken-brightness: 0.82;
	42	+ --os-fx-darken-saturate: 0.92;
40	43
41	44	/* frost — frosted-glass blur, lifted + cooled */
42		- --desktop-mode-fx-frost-blur: 3px;
43		- --desktop-mode-fx-frost-saturate: 0.7;
44		- --desktop-mode-fx-frost-brightness: 1.08;
	45	+ --os-fx-frost-blur: 3px;
	46	+ --os-fx-frost-saturate: 0.7;
	47	+ --os-fx-frost-brightness: 1.08;
45	48
46	49	/* grayscale — drain colour, settle brightness */
47		- --desktop-mode-fx-grayscale-amount: 1;
48		- --desktop-mode-fx-grayscale-brightness: 0.95;
	50	+ --os-fx-grayscale-amount: 1;
	51	+ --os-fx-grayscale-brightness: 0.95;
49	52	}
50	53
51	54	/*
52	55	* `darken` — dims unfocused windows (title bar and body alike) so the
		@@ -51,12 +54,12 @@
51	54	/*
52	55	* `darken` — dims unfocused windows (title bar and body alike) so the
53	56	* focused window reads as the active surface.
54	57	*/
55		-.desktop-mode-window--fx-darken {
	58	+.os-window--fx-darken {
56	59	filter:
57		- brightness( var( --desktop-mode-fx-darken-brightness, 0.82 ) )
58		- saturate( var( --desktop-mode-fx-darken-saturate, 0.92 ) );
	60	+ brightness( var( --os-fx-darken-brightness, 0.82 ) )
	61	+ saturate( var( --os-fx-darken-saturate, 0.92 ) );
59	62	}
60	63
61	64	/*
62	65	* `frost` — throws the window literally out of focus. Blur is the
		@@ -65,13 +68,13 @@
65	68	* the user and the content. `filter: blur()` rasterizes the whole
66	69	* window subtree — iframe content included — so the frosting is total,
67	70	* not just chrome-deep.
68	71	*/
69		-.desktop-mode-window--fx-frost {
	72	+.os-window--fx-frost {
70	73	filter:
71		- blur( var( --desktop-mode-fx-frost-blur, 3px ) )
72		- saturate( var( --desktop-mode-fx-frost-saturate, 0.7 ) )
73		- brightness( var( --desktop-mode-fx-frost-brightness, 1.08 ) );
	74	+ blur( var( --os-fx-frost-blur, 3px ) )
	75	+ saturate( var( --os-fx-frost-saturate, 0.7 ) )
	76	+ brightness( var( --os-fx-frost-brightness, 1.08 ) );
74	77	}
75	78
76	79	/*
77	80	* `grayscale` — drains the colour from unfocused windows so the focused
		@@ -79,9 +82,9 @@
79	82	* this makes the active window pop without dimming anything into the
80	83	* dark. A touch of brightness settling keeps the mono windows from
81	84	* glaring.
82	85	*/
83		-.desktop-mode-window--fx-grayscale {
	86	+.os-window--fx-grayscale {
84	87	filter:
85		- grayscale( var( --desktop-mode-fx-grayscale-amount, 1 ) )
86		- brightness( var( --desktop-mode-fx-grayscale-brightness, 0.95 ) );
	88	+ grayscale( var( --os-fx-grayscale-amount, 1 ) )
	89	+ brightness( var( --os-fx-grayscale-brightness, 0.95 ) );
87	90	}