xuanchi/XCDesktop
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(remote): 优化设备控制面板按钮样式为灰白极简风

Browse Source
This commit is contained in:
ssdfasd
2026-03-08 15:46:24 +08:00
parent 8f56ae89b9
commit 7b2a88f27e
1 changed files with 23 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/modules/remote/RemotePage.tsx
View File

@@ -561,48 +561,53 @@ export const RemotePage: React.FC = () => {
<div className="grid grid-cols-[2fr_1fr_1fr] gap-8"> <div className="grid grid-cols-[2fr_1fr_1fr] gap-8">
<button <button
onClick={handleOpenRemoteDesktop} onClick={handleOpenRemoteDesktop}
className="rounded-lg overflow-hidden border border-gray-300/40 dark:border-gray-500/50 bg-gray-100/30 dark:bg-gray-800/30 hover:opacity-80 transition-opacity cursor-pointer" className="relative flex flex-col rounded-2xl overflow-hidden border-2 border-gray-300 dark:border-gray-600 hover:border-gray-500 dark:hover:border-gray-400 bg-white dark:bg-gray-800 shadow-sm hover:shadow-md transition-all cursor-pointer"
> >
<div className="relative">
<img <img
src={screenshot || '/background.png'} src={screenshot || '/background.png'}
alt="远程桌面" alt="远程桌面"
className="w-full aspect-video object-cover" className="w-full aspect-video object-cover"
/> />
<div className="absolute bottom-0 left-0 right-0 py-2 bg-gradient-to-t from-black/50 to-transparent text-lg font-medium text-white text-center">
远程桌面
</div>
</div>
</button> </button>
<div className="grid grid-rows-2 gap-6"> <div className="grid grid-rows-2 gap-6">
<button <button
onClick={handleOpenGitRepo} onClick={handleOpenGitRepo}
className="flex items-center justify-center gap-2 text-2xl bg-gray-100/50 dark:bg-gray-700/40 hover:bg-gray-200/60 dark:hover:bg-gray-600/50 rounded-2xl shadow-md hover:shadow-xl transition-all font-medium text-gray-700 dark:text-gray-200 whitespace-nowrap" className="flex flex-col items-center justify-center gap-2 text-lg bg-white dark:bg-gray-800 border-2 border-gray-300 dark:border-gray-600 hover:border-gray-500 dark:hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-700 rounded-2xl shadow-sm hover:shadow-md transition-all font-medium text-gray-700 dark:text-gray-200"
> >
<GitBranch size={24} /> <GitBranch size={28} className="text-gray-600 dark:text-gray-300" />
Git 仓库 <span>Git 仓库</span>
</button> </button>
<button <button
onClick={handleOpenFileTransfer} onClick={handleOpenFileTransfer}
className="flex items-center justify-center gap-2 text-2xl bg-gray-100/50 dark:bg-gray-700/40 hover:bg-gray-200/60 dark:hover:bg-gray-600/50 rounded-2xl shadow-md hover:shadow-xl transition-all font-medium text-gray-700 dark:text-gray-200 whitespace-nowrap" className="flex flex-col items-center justify-center gap-2 text-lg bg-white dark:bg-gray-800 border-2 border-gray-300 dark:border-gray-600 hover:border-gray-500 dark:hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-700 rounded-2xl shadow-sm hover:shadow-md transition-all font-medium text-gray-700 dark:text-gray-200"
> >
<Folder size={24} /> <Folder size={28} className="text-gray-600 dark:text-gray-300" />
文件传输 <span>文件传输</span>
</button> </button>
</div> </div>
<div className="grid grid-rows-2 gap-6"> <div className="grid grid-rows-2 gap-6">
<button <button
onClick={handleOpenCode} onClick={handleOpenCode}
className="flex items-center justify-center gap-2 text-2xl bg-gray-100/50 dark:bg-gray-700/40 hover:bg-gray-200/60 dark:hover:bg-gray-600/50 rounded-2xl shadow-md hover:shadow-xl transition-all font-medium text-gray-700 dark:text-gray-200 whitespace-nowrap" className="flex flex-col items-center justify-center gap-2 text-lg bg-white dark:bg-gray-800 border-2 border-gray-300 dark:border-gray-600 hover:border-gray-500 dark:hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-700 rounded-2xl shadow-sm hover:shadow-md transition-all font-medium text-gray-700 dark:text-gray-200"
> >
<Code size={24} /> <Code size={28} className="text-gray-600 dark:text-gray-300" />
OpenCode <span>OpenCode</span>
</button> </button>
<button <button
onClick={handleOpenClaw} onClick={handleOpenClaw}
className="flex items-center justify-center gap-2 text-2xl bg-gray-100/50 dark:bg-gray-700/40 hover:bg-gray-200/60 dark:hover:bg-gray-600/50 rounded-2xl shadow-md hover:shadow-xl transition-all font-medium text-gray-700 dark:text-gray-200 whitespace-nowrap" className="flex flex-col items-center justify-center gap-2 text-lg bg-white dark:bg-gray-800 border-2 border-gray-300 dark:border-gray-600 hover:border-gray-500 dark:hover:border-gray-400 hover:bg-gray-50 dark:hover:bg-gray-700 rounded-2xl shadow-sm hover:shadow-md transition-all font-medium text-gray-700 dark:text-gray-200"
> >
<Sparkles size={24} /> <Sparkles size={28} className="text-gray-600 dark:text-gray-300" />
OpenClaw <span>OpenClaw</span>
</button> </button>
</div> </div>
</div> </div>