345e46002a
- 安全：AI聊天历史、患者档案、设备同步数据统一走 secureSet/secureGet 加密存储 - 合规：TabBar "消息" 改为 "助手" 消除命名误导 - 合规：新增 .env.production 模板配置 HTTPS API URL - UX：AI发送按钮 40→44px、反馈按钮 32→44px、协议勾选框 44px 点击热区 - UX：5处硬编码 10-12px 字号替换为 design token（DoctorTabBar/ShortcutButton/TodoAlert/mall） - UX：6处安全区域写法统一（全部使用 --tk-page-padding/--tk-tabbar-space + env fallback） - 新增 safe-bottom-padded / safe-bottom-tabbar 两个 mixin Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
80 lines
1.4 KiB
SCSS
80 lines
1.4 KiB
SCSS
@import '../../../styles/variables.scss';
|
||
|
||
.shortcut-btn {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
gap: 8px;
|
||
cursor: pointer;
|
||
|
||
&:active {
|
||
opacity: var(--tk-touch-feedback-opacity);
|
||
}
|
||
|
||
&__icon-wrap {
|
||
position: relative;
|
||
width: 52px;
|
||
height: 52px;
|
||
border-radius: 26px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
transition: transform 0.15s;
|
||
}
|
||
|
||
&__icon {
|
||
font-size: 22px;
|
||
line-height: 1;
|
||
}
|
||
|
||
&__badge {
|
||
position: absolute;
|
||
top: -4px;
|
||
right: -8px;
|
||
min-width: 18px;
|
||
height: 18px;
|
||
line-height: 18px;
|
||
text-align: center;
|
||
background: $dan;
|
||
color: $white;
|
||
font-size: var(--tk-font-micro);
|
||
font-weight: 700;
|
||
border-radius: $r-pill;
|
||
padding: 0 4px;
|
||
}
|
||
|
||
&__label {
|
||
font-size: var(--tk-font-cap);
|
||
color: $tx2;
|
||
}
|
||
|
||
// ── 色彩变体（对齐 SPEC T.priL/T.accL/T.wrnL/T.danL）──
|
||
&--pri .shortcut-btn__icon-wrap {
|
||
background: #D4E5F0;
|
||
}
|
||
&--pri .shortcut-btn__icon {
|
||
color: #3A6B8C;
|
||
}
|
||
|
||
&--acc .shortcut-btn__icon-wrap {
|
||
background: #E8F0E8;
|
||
}
|
||
&--acc .shortcut-btn__icon {
|
||
color: #5B7A5E;
|
||
}
|
||
|
||
&--wrn .shortcut-btn__icon-wrap {
|
||
background: #FFF3E0;
|
||
}
|
||
&--wrn .shortcut-btn__icon {
|
||
color: #C4873A;
|
||
}
|
||
|
||
&--dan .shortcut-btn__icon-wrap {
|
||
background: #FDEAEA;
|
||
}
|
||
&--dan .shortcut-btn__icon {
|
||
color: #B54A4A;
|
||
}
|
||
}
|