# 翻译工具收藏按钮与返回按钮优化 Spec

## Why
翻译工具页面的收藏按钮当前位置（右上角绝对定位）显得孤立且不符合整体视觉流；返回按钮样式过于突兀，与页面其他元素不够协调。需要优化这两个按钮的布局和样式，使其与取色器等其他实用工具保持一致的设计语言。

## What Changes
- **收藏按钮**：从右上角绝对定位改为与标题在同一行显示（与取色器布局一致）
- **返回按钮**：优化样式使其更加融入工具栏，减少突兀感
- **Hero区域结构**：调整布局使收藏按钮与标题水平对齐

## Impact
- Affected specs: 无
- Affected code: 
  - `src/pages/BaiduTranslate/BaiduTranslate.tsx` - 调整收藏按钮位置和Hero结构
  - `src/pages/BaiduTranslate/BaiduTranslate.css` - 添加标题行容器样式，优化返回按钮样式

## ADDED Requirements
### Requirement: 收藏按钮与标题同行显示
收藏按钮应与标题在同一行水平对齐，居中对齐，与取色器的布局模式一致。

#### Scenario: 收藏按钮布局正确
- **WHEN** 用户访问翻译工具页面
- **THEN** 收藏按钮显示在标题右侧，与标题在同一行垂直居中对齐
- **AND** 收藏按钮与标题之间有适当间距（16px）
- **AND** 在移动端等小屏幕上，收藏按钮可以换行到下一行

### Requirement: 返回按钮样式优化
返回按钮应与工具栏其他操作按钮视觉权重一致，减少突兀感。

#### Scenario: 返回按钮样式协调
- **WHEN** 用户查看翻译工具的工具栏区域
- **THEN** 返回按钮的视觉样式与复制、交换等操作按钮保持协调
- **AND** 返回按钮有适当的悬停反馈效果

## MODIFIED Requirements
### Requirement: Hero区域布局
Hero区域的内容结构需要调整，使收藏按钮成为标题行的内联元素而非绝对定位元素。

#### Scenario: Hero内容布局正确
- **WHEN** 渲染翻译工具Hero区域
- **THEN** 图标、标题行（含收藏按钮）、描述文字垂直堆叠
- **AND** 整体内容居中对齐