feat: update a8m layout for v2 design#113
Merged
wendyyuchensun merged 5 commits intocoseeing:mainfrom Apr 5, 2026
Merged
Conversation
wendyyuchensun
force-pushed
the
v2-5-layout
branch
4 times, most recently
from
170bf0a to
66a444c
Compare
- Add @tabler/icons-react dependency - Add A8M logo SVG asset - Migrate header menus from headlessui to shared DropdownMenu component, replace heroicons with tabler icons, add title input and action buttons - Remove Header from shared Layout so each page owns its header - Update Home to render Header directly with import/export callbacks Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> s
- Replace ToggleButtonGroup with SegmentedControl for latex delimiter - Update left panel background and padding (cyanLight → blue-50) - Add border/bg/rounded container for the editor area - Expand CodeMirror theme with gutter, line number, and content styles Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Replace documentFormat/documentColor ToggleButtonGroups with a single DropdownMenu for document color - Update preview container classes (border-2 → border, add leading/space-y, bg-black → bg-gray-800, text-black → text-text-primary) - Adjust right panel padding to p-6 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Use tabler icon components for delimiter symbols in ConvertHintModal - Set size="sm" on ConvertHintModal and TipModal - Remove fixed-width wrapper div in SettingModal Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
wendyyuchensun
force-pushed
the
v2-5-layout
branch
from
66a444c to
54f2cb2
Compare
wendyyuchensun
commented
Mar 30, 2026
| className="flex flex-col w-full" | ||
| className="flex flex-col w-full h-[600px] border-r border-border-main" | ||
| > | ||
| <div className="flex bg-cyan p-2"> |
Collaborator
Author
There was a problem hiding this comment.
這個檔案 change 比較多，但大部分是因為調整、移除一些應該不需要重複的 DOM node，類似這行，所以造成更往下的 code indent 改變了。
jamliaoo
reviewed
Apr 5, 2026
src/components/header/index.js
Outdated
| import Button from '@/components/core/button'; | ||
|
|
||
| const Header = () => { | ||
| const Header = ({ onImportClick, onExportClick, displayConfig, setDisplayConfig }) => { |
Collaborator
There was a problem hiding this comment.
覺得可以加個 propTypes，然後 displayConfig 可以換成 title
setDisplayConfig 可以換成專門更新 title 的 function （例如 setConfigTitle）或是用 onInputChange（比照 onImportClick）
jamliaoo
approved these changes
Apr 5, 2026
Collaborator
Author
|
Thanks |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Goal
按照 v2 的 figma 設計，調整版面配置，並套用前幾條 PR 加的新 core component 視覺樣式。所有變更都是純視覺或結構調整，不影響任何業務邏輯或資料處理。
Changes
<h1>改為 screen-reader only（保留無障礙性）Before
After