@cosxai/ui 0.4.7 → 0.4.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/dialogs/Modal.tsx +12 -1
- package/src/styles/chrome-editorial.css +12 -0
package/package.json
CHANGED
package/src/dialogs/Modal.tsx
CHANGED
|
@@ -161,6 +161,14 @@ export function ModalHeader({ title, subtitle, onClose, titleId }: ModalHeaderPr
|
|
|
161
161
|
type="button"
|
|
162
162
|
onClick={onClose}
|
|
163
163
|
aria-label="Close"
|
|
164
|
+
onMouseEnter={(e) => {
|
|
165
|
+
(e.currentTarget as HTMLButtonElement).style.background =
|
|
166
|
+
"var(--ck-bg-muted)";
|
|
167
|
+
}}
|
|
168
|
+
onMouseLeave={(e) => {
|
|
169
|
+
(e.currentTarget as HTMLButtonElement).style.background =
|
|
170
|
+
"transparent";
|
|
171
|
+
}}
|
|
164
172
|
style={{
|
|
165
173
|
border: "none",
|
|
166
174
|
background: "transparent",
|
|
@@ -168,7 +176,10 @@ export function ModalHeader({ title, subtitle, onClose, titleId }: ModalHeaderPr
|
|
|
168
176
|
cursor: "pointer",
|
|
169
177
|
fontSize: 18,
|
|
170
178
|
lineHeight: 1,
|
|
171
|
-
padding:
|
|
179
|
+
padding: 4,
|
|
180
|
+
borderRadius: "var(--ck-radius-sm, 4px)",
|
|
181
|
+
transition:
|
|
182
|
+
"background var(--ck-dur-fast) var(--ck-ease)",
|
|
172
183
|
}}
|
|
173
184
|
>
|
|
174
185
|
×
|
|
@@ -116,6 +116,18 @@ html[data-ck-chrome="editorial"] [data-ck-leftnav] {
|
|
|
116
116
|
border-right-color: var(--ck-border-subtle);
|
|
117
117
|
}
|
|
118
118
|
|
|
119
|
+
/* Nav-item hover — match the actionbar / button hover token so
|
|
120
|
+
every interactive surface in the editorial chrome reads as
|
|
121
|
+
actionable on pointer enter. The sketch / ambient / riso / etc.
|
|
122
|
+
chromes have always carried this rule; editorial was the only
|
|
123
|
+
gap (consumers saw rail items as static even though they're
|
|
124
|
+
navigable). Active rows keep their accent-muted background from
|
|
125
|
+
the base NavItem inline style, so the `:not([data-active="true"])`
|
|
126
|
+
guard is the same shape the other chromes use. */
|
|
127
|
+
html[data-ck-chrome="editorial"] [data-ck-navitem]:not([data-active="true"]):hover {
|
|
128
|
+
background: var(--ck-bg-muted);
|
|
129
|
+
}
|
|
130
|
+
|
|
119
131
|
/* Topbar — flatten to the paper, lose the bottom border (the
|
|
120
132
|
folio rule under it is the visual divider in editorial). */
|
|
121
133
|
html[data-ck-chrome="editorial"] [data-ck-topbar] {
|