mirror of
https://github.com/AmruthPillai/Reactive-Resume.git
synced 2026-07-23 16:33:43 +10:00
Amruth Pillai
6e7fc68068
- Add `import type * as React from "react"` to the 26 previews that reference `React.CSSProperties` under the automatic JSX runtime (React isn't a global type namespace there, so the annotation was unresolved standalone). - Accordion preview: use `multiple` instead of `openMultiple` — @base-ui/react 1.6 renamed the prop, so the multi-open cell wasn't actually multi-open. Skipped CodeRabbit's BrandIcon dark-mode note: the preview renders in the default light card (the dark <img> is hidden there); per-theme sources would need component support it doesn't expose. Claude-Session: https://claude.ai/code/session_01R8Aq8F1nTuvJwfut7g3DVE
69 lines
1.3 KiB
TypeScript
69 lines
1.3 KiB
TypeScript
import type * as React from "react";
|
|
import { Kbd, KbdGroup } from "@reactive-resume/ui/components/kbd";
|
|
|
|
const row: React.CSSProperties = { display: "flex", flexWrap: "wrap", alignItems: "center", gap: 12, padding: 20 };
|
|
const listRow: React.CSSProperties = {
|
|
display: "flex",
|
|
alignItems: "center",
|
|
justifyContent: "space-between",
|
|
gap: 24,
|
|
fontSize: 13,
|
|
color: "var(--foreground)",
|
|
};
|
|
const col: React.CSSProperties = { display: "flex", flexDirection: "column", gap: 10, padding: 20, minWidth: 260 };
|
|
|
|
export const Keys = () => (
|
|
<div style={row}>
|
|
<Kbd>⌘</Kbd>
|
|
<Kbd>⇧</Kbd>
|
|
<Kbd>⌥</Kbd>
|
|
<Kbd>Esc</Kbd>
|
|
<Kbd>Enter</Kbd>
|
|
<Kbd>Tab</Kbd>
|
|
</div>
|
|
);
|
|
|
|
export const Combinations = () => (
|
|
<div style={row}>
|
|
<KbdGroup>
|
|
<Kbd>⌘</Kbd>
|
|
<Kbd>K</Kbd>
|
|
</KbdGroup>
|
|
<KbdGroup>
|
|
<Kbd>⌘</Kbd>
|
|
<Kbd>S</Kbd>
|
|
</KbdGroup>
|
|
<KbdGroup>
|
|
<Kbd>⌘</Kbd>
|
|
<Kbd>⇧</Kbd>
|
|
<Kbd>P</Kbd>
|
|
</KbdGroup>
|
|
</div>
|
|
);
|
|
|
|
export const ShortcutList = () => (
|
|
<div style={col}>
|
|
<div style={listRow}>
|
|
<span>Command palette</span>
|
|
<KbdGroup>
|
|
<Kbd>⌘</Kbd>
|
|
<Kbd>K</Kbd>
|
|
</KbdGroup>
|
|
</div>
|
|
<div style={listRow}>
|
|
<span>Save resume</span>
|
|
<KbdGroup>
|
|
<Kbd>⌘</Kbd>
|
|
<Kbd>S</Kbd>
|
|
</KbdGroup>
|
|
</div>
|
|
<div style={listRow}>
|
|
<span>Undo</span>
|
|
<KbdGroup>
|
|
<Kbd>⌘</Kbd>
|
|
<Kbd>Z</Kbd>
|
|
</KbdGroup>
|
|
</div>
|
|
</div>
|
|
);
|