← All changes | assets/css/my-wordpress.css +33 -23 1.1.4 → 1.1.13 View file →

		@@ -846,9 +846,9 @@
846	846	font-size: 11px;
847	847	font-weight: 600;
848	848	text-transform: uppercase;
849	849	letter-spacing: 0.04em;
850		- background: rgba( 34, 113, 177, 0.12 );
	850	+ background: color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 12%, transparent );
851	851	color: var( --wp-admin-theme-color, #2271b1 );
852	852	}
853	853
854	854	.os-my-wordpress__user-links {
		@@ -868,9 +868,9 @@
868	868
869	869	.os-my-wordpress__user-bio {
870	870	font-size: 14px;
871	871	line-height: 1.5;
872		- color: var( --os-fg, #1d2327 );
	872	+ color: var( --os-my-wordpress-fg, var( --os-ui-fg, #1d2327 ) );
873	873	margin: 0 0 16px;
874	874	padding-left: 12px;
875	875	border-left: 3px solid var( --os-ui-border, #dcdcde );
876	876	}
		@@ -951,9 +951,9 @@
951	951	.os-my-wordpress__user-spark-bar {
952	952	background: linear-gradient(
953	953	180deg,
954	954	var( --wp-admin-theme-color, #2271b1 ) 0%,
955		- rgba( 34, 113, 177, 0.55 ) 100%
	955	+ color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 55%, transparent ) 100%
956	956	);
957	957	border-radius: 3px 3px 0 0;
958	958	min-height: 2px;
959	959	transition: height 0.3s ease;
		@@ -1087,9 +1087,9 @@
1087	1087	}
1088	1088
1089	1089	.os-my-wordpress__term-icon--category {
1090	1090	background: linear-gradient( 135deg, var( --os-ui-accent, #2271b1 ) 0%, var( --os-ui-accent-strong, #135e96 ) 100% );
1091		- box-shadow: 0 4px 12px rgba( 34, 113, 177, 0.32 );
	1091	+ box-shadow: 0 4px 12px color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 32%, transparent );
1092	1092	}
1093	1093
1094	1094	.os-my-wordpress__term-icon--tag {
1095	1095	background: linear-gradient( 135deg, #7c3aed 0%, #5b21b6 100% );
		@@ -1096,9 +1096,9 @@
1096	1096	box-shadow: 0 4px 12px rgba( 124, 58, 237, 0.32 );
1097	1097	}
1098	1098
1099	1099	.os-my-wordpress__user-role--category {
1100		- background: rgba( 34, 113, 177, 0.12 );
	1100	+ background: color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 12%, transparent );
1101	1101	color: var( --os-ui-accent-strong, #135e96 );
1102	1102	}
1103	1103
1104	1104	.os-my-wordpress__user-role--tag {
		@@ -1158,9 +1158,9 @@
1158	1158	* for users with moderate_comments.
1159	1159	* --------------------------------------------------------------- */
1160	1160
1161	1161	.os-my-wordpress__comment-status--approved {
1162		- background: rgba( 34, 113, 177, 0.12 );
	1162	+ background: color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 12%, transparent );
1163	1163	color: var( --os-ui-accent-strong, #135e96 );
1164	1164	}
1165	1165
1166	1166	.os-my-wordpress__comment-status--pending {
		@@ -1191,9 +1191,9 @@
1191	1191	.os-my-wordpress__comment-quote {
1192	1192	margin: 0 0 16px;
1193	1193	padding: 10px 14px;
1194	1194	border-left: 3px solid var( --wp-admin-theme-color, #2271b1 );
1195		- background: rgba( 34, 113, 177, 0.06 );
	1195	+ background: color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 6%, transparent );
1196	1196	border-radius: 0 6px 6px 0;
1197	1197	font-size: 13px;
1198	1198	}
1199	1199
		@@ -1207,9 +1207,9 @@
1207	1207	}
1208	1208
1209	1209	.os-my-wordpress__comment-quote p {
1210	1210	margin: 0;
1211		- color: var( --os-fg, #1d2327 );
	1211	+ color: var( --os-my-wordpress-fg, var( --os-ui-fg, #1d2327 ) );
1212	1212	}
1213	1213
1214	1214	/* Comment body — same style as article-content but with a soft
1215	1215	* card background so it reads as the focal element. */
		@@ -1299,9 +1299,9 @@
1299	1299
1300	1300	.os-my-wordpress__comment-reply-excerpt {
1301	1301	margin: 0;
1302	1302	font-size: 13px;
1303		- color: var( --os-fg, #1d2327 );
	1303	+ color: var( --os-my-wordpress-fg, var( --os-ui-fg, #1d2327 ) );
1304	1304	line-height: 1.45;
1305	1305	}
1306	1306
1307	1307	/* =================================================================== *
		@@ -1336,10 +1336,10 @@
1336	1336	border-radius: 50%;
1337	1337	overflow: hidden;
1338	1338	background: linear-gradient(
1339	1339	135deg,
1340		- rgba( 34, 113, 177, 0.18 ),
1341		- rgba( 34, 113, 177, 0.04 )
	1340	+ color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 18%, transparent ),
	1341	+ color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 4%, transparent )
1342	1342	);
1343	1343	box-shadow:
1344	1344	inset 0 0 0 1px rgba( 0, 0, 0, 0.08 ),
1345	1345	0 2px 6px rgba( 0, 0, 0, 0.08 );
		@@ -1460,10 +1460,10 @@
1460	1460	padding: 24px;
1461	1461	border-radius: 16px;
1462	1462	background: linear-gradient(
1463	1463	135deg,
1464		- rgba( 34, 113, 177, 0.10 ) 0%,
1465		- rgba( 34, 113, 177, 0.02 ) 60%,
	1464	+ color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 10%, transparent ) 0%,
	1465	+ color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 2%, transparent ) 60%,
1466	1466	transparent 100%
1467	1467	);
1468	1468	border: 1px solid var( --os-ui-border, #dcdcde );
1469	1469	}
		@@ -1478,10 +1478,10 @@
1478	1478	inset 0 0 0 2px rgba( 255, 255, 255, 0.8 ),
1479	1479	0 6px 24px rgba( 0, 0, 0, 0.14 );
1480	1480	background: linear-gradient(
1481	1481	135deg,
1482		- rgba( 34, 113, 177, 0.18 ),
1483		- rgba( 34, 113, 177, 0.04 )
	1482	+ color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 18%, transparent ),
	1483	+ color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 4%, transparent )
1484	1484	);
1485	1485	display: inline-flex;
1486	1486	align-items: center;
1487	1487	justify-content: center;
		@@ -1506,14 +1506,17 @@
1506	1506	flex-direction: column;
1507	1507	gap: 8px;
1508	1508	}
1509	1509
	1510	+/* Window text reads the app's own foreground, never `--os-fg`: that token
	1511	+ * is the shell's text ON THE DESK, so a light theme (Legacy) leaves it
	1512	+ * white and the name vanished into the white hero. */
1510	1513	.os-my-wordpress__footprint-title {
1511	1514	margin: 0;
1512	1515	font-size: 28px;
1513	1516	line-height: 1.15;
1514	1517	font-weight: 700;
1515		- color: var( --os-fg, #1d2327 );
	1518	+ color: var( --os-my-wordpress-fg, var( --os-ui-fg, #1d2327 ) );
1516	1519	}
1517	1520
1518	1521	.os-my-wordpress__footprint-meta {
1519	1522	display: flex;
		@@ -1613,17 +1616,17 @@
1613	1616	background: var( --os-ui-hover, rgba( 0, 0, 0, 0.06 ) );
1614	1617	}
1615	1618
1616	1619	.os-my-wordpress__footprint-cell--l1 {
1617		- background: rgba( 34, 113, 177, 0.25 );
	1620	+ background: color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 25%, transparent );
1618	1621	}
1619	1622
1620	1623	.os-my-wordpress__footprint-cell--l2 {
1621		- background: rgba( 34, 113, 177, 0.5 );
	1624	+ background: color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 50%, transparent );
1622	1625	}
1623	1626
1624	1627	.os-my-wordpress__footprint-cell--l3 {
1625		- background: rgba( 34, 113, 177, 0.75 );
	1628	+ background: color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 75%, transparent );
1626	1629	}
1627	1630
1628	1631	.os-my-wordpress__footprint-cell--l4 {
1629	1632	background: var( --wp-admin-theme-color, #2271b1 );
		@@ -1693,9 +1696,9 @@
1693	1696	.os-my-wordpress__footprint-bar {
1694	1697	background: linear-gradient(
1695	1698	180deg,
1696	1699	var( --wp-admin-theme-color, #2271b1 ) 0%,
1697		- rgba( 34, 113, 177, 0.55 ) 100%
	1700	+ color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 55%, transparent ) 100%
1698	1701	);
1699	1702	border-radius: 3px 3px 0 0;
1700	1703	min-height: 2px;
1701	1704	transition: opacity 0.2s ease;
		@@ -1727,10 +1730,10 @@
1727	1730	text-align: center;
1728	1731	padding: 20px 24px;
1729	1732	background: linear-gradient(
1730	1733	135deg,
1731		- rgba( 34, 113, 177, 0.10 ),
1732		- rgba( 34, 113, 177, 0.02 )
	1734	+ color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 10%, transparent ),
	1735	+ color-mix( in srgb, var( --wp-admin-theme-color, #2271b1 ) 2%, transparent )
1733	1736	);
1734	1737	}
1735	1738
1736	1739	.os-my-wordpress__footprint-callout-label {
		@@ -1744,9 +1747,9 @@
1744	1747	.os-my-wordpress__footprint-callout-value {
1745	1748	margin: 2px 0;
1746	1749	font-size: 24px;
1747	1750	font-weight: 700;
1748		- color: var( --os-fg, #1d2327 );
	1751	+ color: var( --os-my-wordpress-fg, var( --os-ui-fg, #1d2327 ) );
1749	1752	}
1750	1753
1751	1754	.os-my-wordpress__footprint-callout-detail {
1752	1755	margin: 0;
		@@ -2472,8 +2475,13 @@
2472	2475	/* One view at a time: the grid, an agent, or the wizard. A sidebar of
2473	2476	faces next to a detail form would leave neither enough room, and the
2474	2477	whole point of the grid is that the faces are big enough to tell
2475	2478	apart. */
	2479	+/* The pane scrolls, and a scroll container clips ink overflow: a field
	2480	+ flush with its edge loses the focus halo the kit paints outside the
	2481	+ border (1px ring + 4px bloom), so the brief's ring read as a top and
	2482	+ bottom line with nothing at the sides. Trade 5px of the section's
	2483	+ 12px padding for a gutter inside the pane; the content does not move. */
2476	2484	.dm-agents__view {
2477	2485	display: flex;
2478	2486	flex-direction: column;
2479	2487	flex: 1;
		@@ -2479,8 +2487,10 @@
2479	2487	flex: 1;
2480	2488	min-height: 0;
2481	2489	overflow-y: auto;
2482	2490	gap: 12px;
	2491	+ margin-inline: -5px;
	2492	+ padding-inline: 5px;
2483	2493	}
2484	2494
2485	2495	.dm-agents__cast-head {
2486	2496	display: flex;