jared
aab7e5ae20
Web half of the desktop feature wave. A shared bridge (`hooks/useTauri.ts`: invokeTauri/isTauri/useTauriEvent) backs per-feature hooks that no-op in the browser and drive the native Tauri commands (compiled in cinny-desktop): - P5-46 useTauriCallPower — hold system awake while a call is active. - P5-36 useTauriJumpList — Windows jump list of recent rooms → matrix: deep links. - P5-44 useTauriThumbbar — taskbar Mute/Deafen/End; events toggle mic/sound/hangup. - P5-43 useTauriSmtc — SMTC call state + button events. - P5-49 useTauriNetwork — react to native network-change → mx.retryImmediately(). - P5-47 window chrome — opt-in `customWindowChromeAtom` + TDS `TitleBar`; DesktopChrome wrapper in App.tsx (zero layout impact when off) + a desktop-only settings toggle. - P5-55 composer toolbar drag-reorder (settings order[] + pragmatic-drag-and-drop). - P5-57 DraftIndicator — subtle "draft saved" cue in the composer. Client-scoped hooks mount via TauriDesktopFeatures in ClientNonUIFeatures; window chrome mounts at App level. Gates: tsc/eslint/prettier clean, build OK, 556 tests. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
32 lines
847 B
TypeScript
32 lines
847 B
TypeScript
import { keyframes, style } from '@vanilla-extract/css';
|
|
import { color, toRem } from 'folds';
|
|
|
|
// A brief, gentle acknowledgement when a draft first becomes persisted.
|
|
// Guarded by `prefers-reduced-motion` so it only plays for users who opt in.
|
|
const savedPulse = keyframes({
|
|
'0%': { opacity: 0.4, transform: 'scale(0.7)' },
|
|
'45%': { opacity: 1, transform: 'scale(1.15)' },
|
|
'100%': { opacity: 1, transform: 'scale(1)' },
|
|
});
|
|
|
|
export const DraftIndicatorBase = style({
|
|
userSelect: 'none',
|
|
whiteSpace: 'nowrap',
|
|
});
|
|
|
|
export const DraftDot = style({
|
|
width: toRem(6),
|
|
height: toRem(6),
|
|
borderRadius: '50%',
|
|
backgroundColor: color.Success.Main,
|
|
flexShrink: 0,
|
|
});
|
|
|
|
export const DraftDotPulse = style({
|
|
'@media': {
|
|
'(prefers-reduced-motion: no-preference)': {
|
|
animation: `${savedPulse} 600ms ease-out`,
|
|
},
|
|
},
|
|
});
|