优化 2026 前端无障碍与响应式体验

完善 2026 主题的移动端与桌面端交互体验,修复多项可访问性和信息展示问题。

- 允许浏览器缩放,补充焦点样式、按钮名称、表单标签和对话框键盘焦点管理\n- 支持 reduced-motion,扩大公共页、后台导航、记录列表和分页控件的触控区域\n- 优化系统设置分区导航、密码显示、字段语义和底部粘性保存栏\n- 压缩移动文件列表操作区,改善桌面表格滚动可达性和统计值截断\n- 优化仪表盘指标、趋势摘要、进度条语义及中英文文案
This commit is contained in:
2026-07-21 11:03:13 +08:00
parent 2f020f5d42
commit b60c003ec2
29 changed files with 638 additions and 312 deletions
+5 -1
View File
@@ -1,6 +1,6 @@
<template>
<div class="flex flex-col space-y-3">
<label :class="['text-sm font-medium', isDarkMode ? 'text-gray-300' : 'text-gray-700']">
<label for="send-expiration-value" :class="['text-sm font-medium', isDarkMode ? 'text-gray-300' : 'text-gray-700']">
{{ t('send.expiration.label') }}
</label>
<div class="relative flex-grow group">
@@ -14,6 +14,7 @@
>
<template v-if="expirationMethod !== 'forever'">
<input
id="send-expiration-value"
:value="expirationValue"
@input="updateValue"
type="number"
@@ -35,6 +36,7 @@
>
<button
type="button"
:aria-label="t('send.expiration.increment')"
@click="incrementValue(1)"
class="flex-1 px-2 flex items-center justify-center transition-all duration-200"
:class="[
@@ -54,6 +56,7 @@
</button>
<button
type="button"
:aria-label="t('send.expiration.decrement')"
@click="incrementValue(-1)"
class="flex-1 px-2 flex items-center justify-center transition-all duration-200"
:class="[
@@ -74,6 +77,7 @@
</div>
</template>
<select
:aria-label="t('send.expiration.method')"
:value="expirationMethod"
@change="updateMethod"
:class="[