Skip to content

Commit 5e81e47

Browse files
MingMing
Ming
authored and
Ming
committed
docs: finalize elegant layout for voice demos and unify terminology
1 parent 5a7c964 commit 5e81e47

5 files changed

Lines changed: 48 additions & 57 deletions

File tree

‎README.zh-CN.md‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@
6060
## ✨ 主要功能
6161

6262
### 🎤 **专业语音合成**
63-
- **高质量音频**：使用 Azure 神经网络语音生成清晰的 MP3 音频文件
63+
- **高质量音频**：使用 Azure 神经语音生成清晰的 MP3 音频文件
6464
- **200+ 种声音**：从 60+ 种语言的大量自然声音中选择
6565
- **智能分割**：通过将大文档分割成可管理的音频片段来自动处理
6666
- **实时处理**：语音生成过程中的实时进度反馈
@@ -265,7 +265,7 @@ const greeting = "您好，欢迎使用 VS Code Speechify 扩展！";
265265
## 🌟 支持的语言和声音
266266

267267
### 热门语言
268-
- **英语**：20+ 神经网络语音，多种风格和角色
268+
- **英语**：20+ 神经语音，多种风格和角色
269269
- **中文（简体）**：15+ 声音，包括角色扮演
270270
- **西班牙语**：10+ 地区变体，自然发音
271271
- **法语**：专业和对话语音选项
@@ -322,7 +322,7 @@ npm run lint # 检查代码质量
322322

323323
- 大文件（>10MB 文本）可能需要几分钟处理
324324
- 某些 Azure 区域在高峰时段可能有速率限制
325-
- 语音角色选择仅适用于支持的神经网络语音
325+
- 语音角色选择仅适用于支持的神经语音
326326

327327
## 📞 支持
328328

‎docs/assets/css/style.css‎

Lines changed: 2 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -587,14 +587,6 @@ body {
587587
min-height: 60px;
588588
}
589589

590-
/* Handle 5th item in desktop layout - center it and make it smaller */
591-
.audio-item:nth-child(5) {
592-
grid-column: 1 / -1;
593-
max-width: 60%;
594-
margin: 0.4rem auto 0;
595-
justify-self: center;
596-
}
597-
598590
.audio-item:hover {
599591
background: rgba(255, 255, 255, 0.1);
600592
transform: translateY(-2px);
@@ -1382,9 +1374,8 @@ kbd {
13821374
}
13831375

13841376
.audio-demo-container {
1385-
display: grid;
1386-
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
1387-
gap: 24px; /* 增加磁贴间距 */
1377+
width: 100%;
1378+
margin: 0 auto;
13881379
}
13891380

13901381
.audio-item {

‎docs/index.html‎

Lines changed: 25 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -151,20 +151,20 @@ <h1 class="hero-title">
151151
<div class="container">
152152
<div class="section-header" style="margin-bottom: 2rem;">
153153
<h2 class="section-title" style="font-size: 2rem;">World-Class Multi-language Support</h2>
154-
<p class="section-description">Experience 200+ neural voices powered by Azure</p>
154+
<p class="section-description">Experience 200+ natural voices powered by Azure</p>
155155
</div>
156156
<div class="audio-demo-wrapper" style="display: flex; justify-content: center;">
157-
<div class="audio-demo-container" style="width: 100%; max-width: 800px; background: var(--hero-gradient); color: white;">
158-
<div class="demo-title">
157+
<div class="audio-demo-container" style="width: 100%; max-width: 800px; background: var(--hero-gradient); color: white; display: block;">
158+
<div class="demo-title" style="margin-bottom: 2rem;">
159159
<i class="fas fa-volume-up"></i>
160160
Speechify Voice Demos
161161
</div>
162-
<div class="language-audio-grid" style="grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));">
162+
<div class="language-audio-grid" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin-bottom: 2rem;">
163163
<div class="audio-item" data-lang="en">
164164
<div class="audio-flag">🇺🇸</div>
165165
<div class="audio-info">
166166
<div class="audio-lang">English</div>
167-
<div class="audio-voice">Azure Neural Voice</div>
167+
<div class="audio-voice">Azure AI Voice</div>
168168
</div>
169169
<button class="audio-play-btn" data-audio="en" title="Play English Demo" aria-label="Play Speechify demo in English">
170170
<i class="fas fa-play" aria-hidden="true"></i>
@@ -174,49 +174,49 @@ <h2 class="section-title" style="font-size: 2rem;">World-Class Multi-language Su
174174
<div class="audio-item" data-lang="zh">
175175
<div class="audio-flag">🇨🇳</div>
176176
<div class="audio-info">
177-
<div class="audio-lang">中文</div>
178-
<div class="audio-voice">Azure AI 语音</div>
177+
<div class="audio-lang">Chinese</div>
178+
<div class="audio-voice">Azure AI Voice</div>
179179
</div>
180-
<button class="audio-play-btn" data-audio="zh" title="播放中文演示" aria-label="播放中文 Speechify 演示">
180+
<button class="audio-play-btn" data-audio="zh" title="Play Chinese Demo" aria-label="Play Speechify demo in Chinese">
181181
<i class="fas fa-play" aria-hidden="true"></i>
182182
</button>
183183
</div>
184-
185-
<div class="audio-item" data-lang="es">
186-
<div class="audio-flag">🇪🇸</div>
184+
185+
<div class="audio-item" data-lang="ja">
186+
<div class="audio-flag">🇯🇵</div>
187187
<div class="audio-info">
188-
<div class="audio-lang">Español</div>
189-
<div class="audio-voice">Voz Neural Azure</div>
188+
<div class="audio-lang">Japanese</div>
189+
<div class="audio-voice">Azure AI Voice</div>
190190
</div>
191-
<button class="audio-play-btn" data-audio="es" title="Reproducir demo en español" aria-label="Reproducir demo de Speechify en español">
191+
<button class="audio-play-btn" data-audio="ja" title="Play Japanese Demo" aria-label="Play Speechify demo in Japanese">
192192
<i class="fas fa-play" aria-hidden="true"></i>
193193
</button>
194194
</div>
195195

196-
<div class="audio-item" data-lang="fr">
197-
<div class="audio-flag">🇫🇷</div>
196+
<div class="audio-item" data-lang="es">
197+
<div class="audio-flag">🇪🇸</div>
198198
<div class="audio-info">
199-
<div class="audio-lang">Français</div>
200-
<div class="audio-voice">Voix Neurale Azure</div>
199+
<div class="audio-lang">Spanish</div>
200+
<div class="audio-voice">Azure AI Voice</div>
201201
</div>
202-
<button class="audio-play-btn" data-audio="fr" title="Lire la démo en français" aria-label="Lire la démo de Speechify en français">
202+
<button class="audio-play-btn" data-audio="es" title="Play Spanish Demo" aria-label="Play Speechify demo in Spanish">
203203
<i class="fas fa-play" aria-hidden="true"></i>
204204
</button>
205205
</div>
206206

207-
<div class="audio-item" data-lang="ja" style="grid-column: unset; max-width: unset; margin: unset;">
208-
<div class="audio-flag">🇯🇵</div>
207+
<div class="audio-item" data-lang="fr">
208+
<div class="audio-flag">🇫🇷</div>
209209
<div class="audio-info">
210-
<div class="audio-lang">日本語</div>
211-
<div class="audio-voice">Azure ニューラル语音</div>
210+
<div class="audio-lang">French</div>
211+
<div class="audio-voice">Azure AI Voice</div>
212212
</div>
213-
<button class="audio-play-btn" data-audio="ja" title="日本語デモを再生" aria-label="日本語でSpeechifyデモを再生">
213+
<button class="audio-play-btn" data-audio="fr" title="Play French Demo" aria-label="Play Speechify demo in French">
214214
<i class="fas fa-play" aria-hidden="true"></i>
215215
</button>
216216
</div>
217217
</div>
218218

219-
<div class="audio-player-status">
219+
<div class="audio-player-status" style="border-top: 1px solid rgba(255,255,255,0.1); padding-top: 1.5rem;">
220220
<div class="currently-playing hidden">
221221
<i class="fas fa-music" aria-hidden="true"></i>
222222
<span class="playing-text">Now Playing: </span>

‎docs/zh-cn.html‎

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -153,12 +153,12 @@ <h2 class="section-title" style="font-size: 2rem;">世界级的多语言支持</
153153
<p class="section-description">体验由 Azure 提供的 200+ 自然语音</p>
154154
</div>
155155
<div class="audio-demo-wrapper" style="display: flex; justify-content: center;">
156-
<div class="audio-demo-container" style="width: 100%; max-width: 800px; background: var(--hero-gradient); color: white;">
157-
<div class="demo-title">
156+
<div class="audio-demo-container" style="width: 100%; max-width: 800px; background: var(--hero-gradient); color: white; display: block;">
157+
<div class="demo-title" style="margin-bottom: 2rem;">
158158
<i class="fas fa-volume-up"></i>
159159
Speechify 语音演示
160160
</div>
161-
<div class="language-audio-grid" style="grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));">
161+
<div class="language-audio-grid" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin-bottom: 2rem;">
162162
<div class="audio-item" data-lang="en">
163163
<div class="audio-flag">🇺🇸</div>
164164
<div class="audio-info">
@@ -181,11 +181,22 @@ <h2 class="section-title" style="font-size: 2rem;">世界级的多语言支持</
181181
</button>
182182
</div>
183183

184+
<div class="audio-item" data-lang="ja">
185+
<div class="audio-flag">🇯🇵</div>
186+
<div class="audio-info">
187+
<div class="audio-lang">日本語</div>
188+
<div class="audio-voice">Azure AI 语音</div>
189+
</div>
190+
<button class="audio-play-btn" data-audio="ja" title="播放日语演示" aria-label="播放日语 Speechify 演示">
191+
<i class="fas fa-play" aria-hidden="true"></i>
192+
</button>
193+
</div>
194+
184195
<div class="audio-item" data-lang="es">
185196
<div class="audio-flag">🇪🇸</div>
186197
<div class="audio-info">
187198
<div class="audio-lang">Español</div>
188-
<div class="audio-voice">Voz Neural Azure</div>
199+
<div class="audio-voice">Azure AI 语音</div>
189200
</div>
190201
<button class="audio-play-btn" data-audio="es" title="播放西班牙语演示" aria-label="播放西班牙语 Speechify 演示">
191202
<i class="fas fa-play" aria-hidden="true"></i>
@@ -196,26 +207,15 @@ <h2 class="section-title" style="font-size: 2rem;">世界级的多语言支持</
196207
<div class="audio-flag">🇫🇷</div>
197208
<div class="audio-info">
198209
<div class="audio-lang">Français</div>
199-
<div class="audio-voice">Voix Neurale Azure</div>
210+
<div class="audio-voice">Azure AI 语音</div>
200211
</div>
201212
<button class="audio-play-btn" data-audio="fr" title="播放法语演示" aria-label="播放法语 Speechify 演示">
202213
<i class="fas fa-play" aria-hidden="true"></i>
203214
</button>
204215
</div>
205-
206-
<div class="audio-item" data-lang="ja" style="grid-column: unset; max-width: unset; margin: unset;">
207-
<div class="audio-flag">🇯🇵</div>
208-
<div class="audio-info">
209-
<div class="audio-lang">日本語</div>
210-
<div class="audio-voice">Azure ニューラル音声</div>
211-
</div>
212-
<button class="audio-play-btn" data-audio="ja" title="播放日语演示" aria-label="播放日语 Speechify 演示">
213-
<i class="fas fa-play" aria-hidden="true"></i>
214-
</button>
215-
</div>
216216
</div>
217217

218-
<div class="audio-player-status">
218+
<div class="audio-player-status" style="border-top: 1px solid rgba(255,255,255,0.1); padding-top: 1.5rem;">
219219
<div class="currently-playing hidden">
220220
<i class="fas fa-music" aria-hidden="true"></i>
221221
<span class="playing-text">正在播放: </span>

‎src/i18n/zh-cn.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ const chineseMessages: Messages = {
99
'commands.configureVoice.title': 'Speechify: 配置语音设置',
1010
'commands.configureVoice.description': '配置语音名称、性别和风格偏好',
1111
'commands.selectRole.title': 'Speechify: 选择语音角色',
12-
'commands.selectRole.description': '为神经网络语音选择角色扮演角色',
12+
'commands.selectRole.description': '为神经语音选择角色扮演角色',
1313
'commands.configureAzure.title': 'Speechify: 配置 Azure 设置',
1414
'commands.configureAzure.description': '配置 Azure 语音服务凭据和区域',
1515
'commands.convertToVideo.title': 'Speechify: AI 视觉对齐合成',

0 commit comments

Comments
 (0)