👁️
fix card reference button, less aggro colors
+26
-4
+10
-2
src/components/richtext/CombinedAutocomplete.tsx
+10
-2
src/components/richtext/CombinedAutocomplete.tsx
···
33
33
{ name: "card", trigger: "[[" },
34
34
],
35
35
reducer: (action: AutocompleteAction) => {
36
-
const triggerName = action.type?.name as AutocompleteType | undefined;
36
+
// Determine trigger type from action.type, or fall back to trigger string
37
+
// (openAutocomplete sets type: null, so we need this fallback)
38
+
const triggerName: AutocompleteType | undefined =
39
+
(action.type?.name as AutocompleteType) ||
40
+
(action.trigger === "[["
41
+
? "card"
42
+
: action.trigger === "@"
43
+
? "mention"
44
+
: undefined);
37
45
38
46
switch (action.kind) {
39
47
case ActionKind.open: {
···
179
187
aria-selected={i === selectedIndex}
180
188
className={`w-full px-3 py-2 text-left text-sm ${
181
189
i === selectedIndex
182
-
? "bg-amber-100 dark:bg-amber-900/30 text-amber-900 dark:text-amber-100"
190
+
? "bg-sky-50 dark:bg-sky-900/30 text-sky-900 dark:text-sky-100"
183
191
: "text-gray-900 dark:text-gray-100 hover:bg-gray-100 dark:hover:bg-slate-700"
184
192
}`}
185
193
onMouseEnter={() => onSelectIndex(i)}
+1
-1
src/components/richtext/RichtextRenderer.tsx
+1
-1
src/components/richtext/RichtextRenderer.tsx
···
257
257
<Link
258
258
to="/card/$id"
259
259
params={{ id: feature.scryfallId }}
260
-
className="inline-flex items-center px-1.5 py-0.5 rounded bg-amber-100 dark:bg-amber-900/50 text-amber-700 dark:text-amber-300 text-sm font-medium hover:bg-amber-200 dark:hover:bg-amber-900/70"
260
+
className="inline-flex items-center px-1.5 py-0.5 rounded bg-sky-50 dark:bg-sky-900/30 text-sky-700 dark:text-sky-300 text-sm font-medium hover:bg-sky-100 dark:hover:bg-sky-900/50"
261
261
>
262
262
{content}
263
263
</Link>
+14
src/components/richtext/Toolbar.tsx
+14
src/components/richtext/Toolbar.tsx
···
10
10
Minus,
11
11
Redo,
12
12
SquareCode,
13
+
TextSearch,
13
14
Undo,
14
15
} from "lucide-react";
16
+
import { openAutocomplete } from "prosemirror-autocomplete";
15
17
import { setBlockType, toggleMark } from "prosemirror-commands";
16
18
import { redo, undo } from "prosemirror-history";
17
19
import type { MarkType, NodeType } from "prosemirror-model";
···
164
166
// Move selection to the new paragraph (position inside the paragraph)
165
167
tr.setSelection(TextSelection.near(tr.doc.resolve(insertPos + 1)));
166
168
view.dispatch(tr);
169
+
view.focus();
170
+
};
171
+
172
+
const insertCardTrigger = () => {
173
+
openAutocomplete(view, "[[");
167
174
view.focus();
168
175
};
169
176
···
335
342
title="Horizontal Rule"
336
343
>
337
344
<Minus className="w-4 h-4" />
345
+
</ToolbarButton>
346
+
<ToolbarButton
347
+
onClick={insertCardTrigger}
348
+
active={false}
349
+
title="Insert Card Reference ([[)"
350
+
>
351
+
<TextSearch className="w-4 h-4" />
338
352
</ToolbarButton>
339
353
</div>
340
354
<LinkModal
+1
-1
src/components/richtext/schema.ts
+1
-1
src/components/richtext/schema.ts
···
239
239
"span",
240
240
{
241
241
class:
242
-
"inline-flex items-center px-1.5 py-0.5 rounded bg-amber-100 dark:bg-amber-900/50 text-amber-700 dark:text-amber-300 text-sm font-medium",
242
+
"inline-flex items-center px-1.5 py-0.5 rounded bg-sky-50 dark:bg-sky-900/30 text-sky-700 dark:text-sky-300 text-sm font-medium",
243
243
"data-cardref": "",
244
244
"data-name": node.attrs.name,
245
245
"data-scryfall-id": node.attrs.scryfallId,