Skip to content

Commit

Permalink
refactor(options): 去除主题切换功能,优化界面布局
Browse files Browse the repository at this point in the history
清理选项页面的无用代码,包括不再需要的CSS文件引用、主题存储逻辑以及GitHub链接按钮。更新界面使用新的布局,提升视觉清晰度和操作便捷性。

```plaintext
- 移除对 `@src/Options.css` 的引用以及相关主题
  • Loading branch information
phodal committed Oct 10, 2024
1 parent c9af156 commit d17e582
Show file tree
Hide file tree
Showing 2 changed files with 19 additions and 20 deletions.
8 changes: 8 additions & 0 deletions docs/roadmap.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@

Browser Copilot

- 分析和生成 UI 测试代码
- 记录网页的运行错误,然后生成 link 分析
- 辅助编写网页需求


31 changes: 11 additions & 20 deletions pages/options/src/Options.tsx
Original file line number Diff line number Diff line change
@@ -1,26 +1,17 @@
import '@src/Options.css';
import { useStorage, withErrorBoundary, withSuspense } from '@extension/shared';
import { exampleThemeStorage } from '@extension/storage';
import { Button } from '@extension/ui';
import { withErrorBoundary, withSuspense } from '@extension/shared';

const Options = () => {
const theme = useStorage(exampleThemeStorage);
const isLight = theme === 'light';
const logo = isLight ? 'options/logo_horizontal.svg' : 'options/logo_horizontal_dark.svg';
const goGithubSite = () =>
chrome.tabs.create({ url: 'https://github.com/Jonghakseo/chrome-extension-boilerplate-react-vite' });

return (
<div className={`App ${isLight ? 'bg-slate-50 text-gray-900' : 'bg-gray-800 text-gray-100'}`}>
<button onClick={goGithubSite}>
<img src={chrome.runtime.getURL(logo)} className="App-logo" alt="logo" />
</button>
<p>
Edit <code>pages/options/src/Options.tsx</code>
</p>
<Button className="mt-4" onClick={exampleThemeStorage.toggle} theme={theme}>
Toggle theme
</Button>
<div className="flex h-screen flex-col bg-gray-100">
<header className="mb-4 flex items-center justify-between bg-white p-8 px-16 shadow">
<h1 className="text-xl font-bold">TITLE</h1>
</header>

<div className="flex flex-1 overflow-hidden">
<nav className="w-72 p-4 pl-16 text-lg">LEFT</nav>

<main className="mr-16 flex-1 overflow-auto bg-white p-6 shadow">CENTER</main>
</div>
</div>
);
};
Expand Down

0 comments on commit d17e582

Please sign in to comment.