refactor: 移除工具栏 Gitee 按钮,项目地址移至关于弹框

- 工具栏移除 Gitee 图标按钮
- 关于弹框添加项目地址链接(带 Gitee 图标)
- 链接点击跳转到 gitee.com/thzxx/MarkLite
This commit is contained in:
thzxx
2026-05-28 16:13:21 +08:00
parent 4a1c06320f
commit 359a4572b7
3 changed files with 33 additions and 13 deletions
+12 -1
View File
@@ -19,7 +19,7 @@ import { WelcomeScreen } from './components/WelcomeScreen/WelcomeScreen'
import { Toast } from './components/Toast/Toast' import { Toast } from './components/Toast/Toast'
import { ModifiedBanner } from './components/ModifiedBanner/ModifiedBanner' import { ModifiedBanner } from './components/ModifiedBanner/ModifiedBanner'
import { DropOverlay } from './components/DropOverlay/DropOverlay' import { DropOverlay } from './components/DropOverlay/DropOverlay'
import { AppIcon } from './components/Icons' import { AppIcon, Gitee } from './components/Icons'
const APP_VERSION = 'v0.1.0' const APP_VERSION = 'v0.1.0'
@@ -268,6 +268,17 @@ export default function App() {
</div> </div>
</div> </div>
<div className="about-footer"> <div className="about-footer">
<a className="about-link" href="#" onClick={(e) => {
e.preventDefault()
if (window.electronAPI?.openExternal) {
window.electronAPI.openExternal('https://gitee.com/thzxx/MarkLite')
} else {
window.open('https://gitee.com/thzxx/MarkLite', '_blank')
}
}}>
<Gitee size={16} />
<span>gitee.com/thzxx/MarkLite</span>
</a>
<p> Electron + React + TypeScript </p> <p> Electron + React + TypeScript </p>
<p className="about-copyright">© 2026 thzxx</p> <p className="about-copyright">© 2026 thzxx</p>
</div> </div>
+1 -12
View File
@@ -1,5 +1,5 @@
import React from 'react' import React from 'react'
import { FolderOpen, Save, EditMode, PreviewMode, Moon, Sun, Gitee, Info } from '../Icons' import { FolderOpen, Save, EditMode, PreviewMode, Moon, Sun, Info } from '../Icons'
interface ToolbarProps { interface ToolbarProps {
onOpen: () => void onOpen: () => void
@@ -12,14 +12,6 @@ interface ToolbarProps {
} }
export function Toolbar({ onOpen, onSave, viewMode, onViewModeChange, darkMode, onToggleDark, onShowAbout }: ToolbarProps) { export function Toolbar({ onOpen, onSave, viewMode, onViewModeChange, darkMode, onToggleDark, onShowAbout }: ToolbarProps) {
const handleOpenGitee = () => {
if (window.electronAPI?.openExternal) {
window.electronAPI.openExternal('https://gitee.com/thzxx/MarkLite')
} else {
window.open('https://gitee.com/thzxx/MarkLite', '_blank')
}
}
return ( return (
<div id="toolbar"> <div id="toolbar">
<div className="toolbar-left"> <div className="toolbar-left">
@@ -45,9 +37,6 @@ export function Toolbar({ onOpen, onSave, viewMode, onViewModeChange, darkMode,
<button className="toolbar-btn" onClick={onToggleDark} title="切换暗色主题"> <button className="toolbar-btn" onClick={onToggleDark} title="切换暗色主题">
{darkMode ? <Sun size={18} /> : <Moon size={18} />} {darkMode ? <Sun size={18} /> : <Moon size={18} />}
</button> </button>
<button className="toolbar-btn" onClick={handleOpenGitee} title="Gitee 项目主页">
<Gitee size={18} />
</button>
<button className="toolbar-btn" onClick={onShowAbout} title="关于"> <button className="toolbar-btn" onClick={onShowAbout} title="关于">
<Info size={18} /> <Info size={18} />
</button> </button>
+20
View File
@@ -1161,6 +1161,26 @@ html, body {
margin-bottom: 20px; margin-bottom: 20px;
} }
.about-link {
display: inline-flex;
align-items: center;
gap: 6px;
color: var(--primary);
text-decoration: none;
font-size: 13px;
margin-bottom: 8px;
padding: 6px 12px;
border-radius: 6px;
background: var(--primary-light);
transition: all 0.15s ease;
cursor: pointer;
}
.about-link:hover {
background: var(--primary);
color: white;
}
.about-footer p { .about-footer p {
color: var(--text-tertiary); color: var(--text-tertiary);
font-size: 12px; font-size: 12px;