chore: directory migration - gateway→server, web→client/electron
This commit is contained in:
44
client/electron/src/main.tsx
Normal file
44
client/electron/src/main.tsx
Normal file
@ -0,0 +1,44 @@
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom/client';
|
||||
import App from './App';
|
||||
import { initTheme } from './stores/themeStore';
|
||||
import './index.css';
|
||||
|
||||
// 必须在 render 之前:晚一步就会让深色偏好的用户看到一帧白色闪屏。
|
||||
// index.html 里还有一段更早的内联脚本处理「JS bundle 到达前」那段空窗,
|
||||
// 这里做的是把 store 状态与 DOM 对齐并订阅系统主题变化。
|
||||
initTheme();
|
||||
|
||||
/**
|
||||
* 用 Visual Viewport 驱动应用高度。
|
||||
*
|
||||
* 手机软键盘通常只缩小「可见视口」,不缩小传统 100%/100vh;如果外壳还按
|
||||
* 布局视口排版,正文和发送按钮就会落到键盘后面。dvh 是 CSS 兜底,这个变量
|
||||
* 处理 iOS WebView 与部分旧 Chromium 对动态视口更新不及时的情况。
|
||||
*/
|
||||
const syncVisibleViewport = () => {
|
||||
const viewport = window.visualViewport;
|
||||
const height = viewport?.height ?? window.innerHeight;
|
||||
document.documentElement.style.setProperty('--app-height', `${Math.round(height)}px`);
|
||||
};
|
||||
|
||||
syncVisibleViewport();
|
||||
window.addEventListener('resize', syncVisibleViewport, { passive: true });
|
||||
window.visualViewport?.addEventListener('resize', syncVisibleViewport, { passive: true });
|
||||
window.visualViewport?.addEventListener('scroll', syncVisibleViewport, { passive: true });
|
||||
|
||||
// 编辑表单时隐藏窄屏底栏,把有限的键盘上方空间留给正文与操作按钮。
|
||||
// focusout 要延后一帧:从一个输入框切到另一个时 activeElement 会短暂回到 body。
|
||||
const syncEditingState = () => {
|
||||
const el = document.activeElement;
|
||||
const editing = el instanceof HTMLInputElement || el instanceof HTMLTextAreaElement || el instanceof HTMLSelectElement;
|
||||
document.documentElement.classList.toggle('form-editing', editing);
|
||||
};
|
||||
document.addEventListener('focusin', syncEditingState);
|
||||
document.addEventListener('focusout', () => requestAnimationFrame(syncEditingState));
|
||||
|
||||
ReactDOM.createRoot(document.getElementById('root')!).render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>
|
||||
);
|
||||
Reference in New Issue
Block a user