feat(Header): Add drag and no-drag regions for desktop app

* Implemented `.hd-drag` and `.hd-btns` classes for better window management in the Electron app.
* Updated `Header.tsx` to utilize these new classes for improved user experience.
This commit is contained in:
Savoki
2025-09-01 15:24:37 +08:00
committed by VancySavoki
parent 7cddb5e480
commit da13c7b759
6 changed files with 25 additions and 8 deletions

5
.gitignore vendored
View File

@@ -8,7 +8,8 @@ pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist/*
dist-ssr
*.local
@@ -23,3 +24,5 @@ dist-ssr
*.sln
*.sw?
.env
release
electron

View File

@@ -8,7 +8,7 @@
"build": "vite build",
"lint": "eslint .",
"preview": "vite preview",
"build:desktop": "node scripts/build-desktop.js",
"build:desktop": "node scripts/build-desktop.cjs",
"electron": "electron electron/main.js",
"electron:dev": "NODE_ENV=development electron electron/main.js",
"dist": "electron-builder",
@@ -28,6 +28,8 @@
"@types/react-dom": "^18.3.0",
"@vitejs/plugin-react": "^4.3.1",
"autoprefixer": "^10.4.18",
"electron": "^37.4.0",
"electron-builder": "^26.0.12",
"eslint": "^9.9.1",
"eslint-plugin-react-hooks": "^5.1.0-rc.0",
"eslint-plugin-react-refresh": "^0.4.11",

View File

@@ -8,7 +8,7 @@ console.log('🚀 开始构建桌面应用...');
// 1. 构建Web应用
console.log('📦 构建Web应用...');
execSync('npm run build', { stdio: 'inherit' });
execSync('pnpm run build', { stdio: 'inherit' });
// 2. 创建Electron目录和文件
console.log('⚡ 设置Electron环境...');
@@ -37,7 +37,7 @@ function createWindow() {
enableRemoteModule: false,
webSecurity: true
},
icon: path.join(__dirname, '../dist/vite.svg'),
icon: path.join(__dirname, '../dist/icon.svg'),
titleBarStyle: process.platform === 'darwin' ? 'hiddenInset' : 'default',
show: false
});
@@ -162,7 +162,7 @@ fs.writeFileSync(
// 5. 安装Electron依赖
console.log('📥 安装Electron依赖...');
try {
execSync('npm install --save-dev electron electron-builder', { stdio: 'inherit' });
execSync('pnpm install --save-dev electron electron-builder', { stdio: 'inherit' });
} catch (error) {
console.error('安装依赖失败:', error.message);
process.exit(1);

View File

@@ -98,7 +98,7 @@ export const Header: React.FC = () => {
const t = (zh: string, en: string) => language === 'zh' ? zh : en;
return (
<header className="bg-white dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700 sticky top-0 z-50">
<header className="bg-white dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700 sticky top-0 z-50 hd-drag">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex items-center justify-between h-16">
{/* Logo and Title */}
@@ -121,7 +121,7 @@ export const Header: React.FC = () => {
</div>
{/* Navigation */}
<nav className="hidden md:flex items-center space-x-1">
<nav className="hidden md:flex items-center space-x-1 hd-btns">
<button
onClick={() => setCurrentView('repositories')}
className={`px-4 py-2 rounded-lg font-medium transition-colors ${
@@ -158,7 +158,7 @@ export const Header: React.FC = () => {
</nav>
{/* User Actions */}
<div className="flex items-center space-x-3">
<div className="flex items-center space-x-3 hd-btns">
{/* Sync Status */}
<div className="hidden sm:flex items-center space-x-2 text-sm text-gray-500 dark:text-gray-400">
<span>{t('上次同步:', 'Last sync:')} {formatLastSync(lastSync)}</span>

View File

@@ -9,4 +9,14 @@
-webkit-box-orient: vertical;
overflow: hidden;
}
}
.hd-drag {
-webkit-app-region: drag;
-webkit-user-select: none;
user-select: none;
}
.hd-btns {
-webkit-app-region: no-drag;
}

View File

@@ -3,8 +3,10 @@ import react from '@vitejs/plugin-react';
// https://vitejs.dev/config/
export default defineConfig({
base: './',
plugins: [react()],
optimizeDeps: {
exclude: ['lucide-react'],
},
});