123
2 weeks ago
parent
c0853dbed4
commit
da01eb2cd9
@ -0,0 +1,15 @@
|
|||||||
|
<role>
|
||||||
|
<personality>
|
||||||
|
@!thought://remember
|
||||||
|
@!thought://recall
|
||||||
|
@!thought://ui-optimization-thinking
|
||||||
|
@!thought://aesthetic-enhancement
|
||||||
|
</personality>
|
||||||
|
<principle>
|
||||||
|
@!execution://ui-optimization-workflow
|
||||||
|
@!execution://layout-enhancement-process
|
||||||
|
</principle>
|
||||||
|
<knowledge>
|
||||||
|
@!knowledge://qt-ui-optimization-expertise
|
||||||
|
</knowledge>
|
||||||
|
</role>
|
||||||
Binary file not shown.
@ -0,0 +1,354 @@
|
|||||||
|
/* ===============================================
|
||||||
|
战场探索系统 - 军事主题样式表
|
||||||
|
版本: 2.0 优化版
|
||||||
|
=============================================== */
|
||||||
|
|
||||||
|
/* 全局字体和基础样式 */
|
||||||
|
QWidget {
|
||||||
|
font-family: "Microsoft YaHei", "SimHei", sans-serif;
|
||||||
|
color: #ffffff;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 主面板样式 */
|
||||||
|
#rightFunctionPanel {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #0f1419, stop:1 #1a252f);
|
||||||
|
border-left: 3px solid #00ff88;
|
||||||
|
border-radius: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 面板标题 */
|
||||||
|
#PanelTitle {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,
|
||||||
|
stop:0 #00ff88, stop:1 #00c46a);
|
||||||
|
color: #0f1419;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: bold;
|
||||||
|
padding: 16px 20px;
|
||||||
|
border-radius: 10px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
text-align: center;
|
||||||
|
border: 2px solid #00ff88;
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 模块卡片 */
|
||||||
|
#ModuleCard {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #1e2832, stop:1 #2a3441);
|
||||||
|
border-radius: 12px;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
border-left: 4px solid #00ff88;
|
||||||
|
padding: 0px;
|
||||||
|
margin-bottom: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#ModuleCard:hover {
|
||||||
|
border-color: #00ff88;
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #243340, stop:1 #304050);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 模块标题 */
|
||||||
|
#ModuleTitle {
|
||||||
|
color: #00ff88;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 700;
|
||||||
|
text-shadow: 0 0 5px rgba(0, 255, 136, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
#ModuleIcon {
|
||||||
|
color: #00ff88;
|
||||||
|
font-size: 20px;
|
||||||
|
text-shadow: 0 0 8px rgba(0, 255, 136, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 模块分隔线 */
|
||||||
|
#ModuleSeparator {
|
||||||
|
border: none;
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,
|
||||||
|
stop:0 transparent, stop:0.5 #3c4a59, stop:1 transparent);
|
||||||
|
height: 1px;
|
||||||
|
margin: 8px 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 设备选择器 */
|
||||||
|
#device-selector {
|
||||||
|
background: #2a3441;
|
||||||
|
border: 1px solid #3c4a59;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 设备卡片 */
|
||||||
|
#RightDeviceCard {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #2a3441, stop:1 #34404f);
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
padding: 12px;
|
||||||
|
margin: 4px;
|
||||||
|
min-height: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#RightDeviceCard:hover {
|
||||||
|
border-color: #00a8ff;
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #34404f, stop:1 #3e4a5f);
|
||||||
|
}
|
||||||
|
|
||||||
|
#RightDeviceCard[active="true"] {
|
||||||
|
border-color: #00ff88;
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 rgba(0, 255, 136, 0.1), stop:1 rgba(0, 255, 136, 0.05));
|
||||||
|
box-shadow: 0 0 15px rgba(0, 255, 136, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
#DeviceName {
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
#DeviceStatus {
|
||||||
|
color: #a4b0be;
|
||||||
|
font-size: 11px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 功能按钮基础样式 */
|
||||||
|
#FunctionBtn {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #2a3441, stop:1 #34404f);
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
padding: 12px 16px;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
margin: 4px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn:hover {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #34404f, stop:1 #3e4a5f);
|
||||||
|
border-color: #00a8ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn:pressed {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #1e2a36, stop:1 #283341);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 主要按钮样式 */
|
||||||
|
#FunctionBtn[class="primary-large"] {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #00ff88, stop:1 #00c46a);
|
||||||
|
color: #0f1419;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
border: 2px solid #00ff88;
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="primary-large"]:hover {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #00c46a, stop:1 #009951);
|
||||||
|
box-shadow: 0 4px 15px rgba(0, 255, 136, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="primary-medium"] {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #00ff88, stop:1 #00c46a);
|
||||||
|
color: #0f1419;
|
||||||
|
font-weight: 700;
|
||||||
|
border: 2px solid #00ff88;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="primary-medium"]:hover {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #00c46a, stop:1 #009951);
|
||||||
|
box-shadow: 0 3px 12px rgba(0, 255, 136, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 次要按钮样式 */
|
||||||
|
#FunctionBtn[class="secondary-medium"] {
|
||||||
|
background: #2a3441;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="secondary-medium"]:hover {
|
||||||
|
border-color: #00a8ff;
|
||||||
|
background: #34404f;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="secondary-small"] {
|
||||||
|
background: #2a3441;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 8px 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="secondary-small"]:hover {
|
||||||
|
border-color: #00a8ff;
|
||||||
|
background: #34404f;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 危险按钮样式 */
|
||||||
|
#FunctionBtn[class="danger"] {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #ff3838, stop:1 #c44569);
|
||||||
|
border: 2px solid #ff3838;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="danger"]:hover {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #e53e3e, stop:1 #b83b5e);
|
||||||
|
box-shadow: 0 4px 15px rgba(255, 56, 56, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 加载状态按钮 */
|
||||||
|
#FunctionBtn[class="loading"] {
|
||||||
|
background: #34404f;
|
||||||
|
border-color: #3c4a59;
|
||||||
|
color: #a4b0be;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn:disabled {
|
||||||
|
background: #1e2832;
|
||||||
|
color: #556983;
|
||||||
|
border-color: #2a3441;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 统计显示区域 */
|
||||||
|
#stats-display {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #2a3441, stop:1 #34404f);
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
border-left: 4px solid #ffa502;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#stat-label {
|
||||||
|
color: #a4b0be;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
#stat-value {
|
||||||
|
color: #00ff88;
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: bold;
|
||||||
|
text-shadow: 0 0 8px rgba(0, 255, 136, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
#threat-level {
|
||||||
|
color: #ffa502;
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 700;
|
||||||
|
text-shadow: 0 0 5px rgba(255, 165, 2, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 通话状态 */
|
||||||
|
#call-status {
|
||||||
|
background: #2a3441;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
border-radius: 6px;
|
||||||
|
padding: 12px 16px;
|
||||||
|
color: #a4b0be;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
|
margin-top: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 音量控制 */
|
||||||
|
#volume-label {
|
||||||
|
color: #a4b0be;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
#volume-percent {
|
||||||
|
color: #00ff88;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 音量滑块样式 */
|
||||||
|
#volume-slider::groove:horizontal {
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
height: 8px;
|
||||||
|
background: #2a3441;
|
||||||
|
border-radius: 4px;
|
||||||
|
margin: 2px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#volume-slider::handle:horizontal {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #00ff88, stop:1 #00c46a);
|
||||||
|
border: 2px solid #00ff88;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin: -8px 0;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#volume-slider::handle:horizontal:hover {
|
||||||
|
background: #00c46a;
|
||||||
|
box-shadow: 0 0 8px rgba(0, 255, 136, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
#volume-slider::sub-page:horizontal {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,
|
||||||
|
stop:0 #00ff88, stop:1 #00a8ff);
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 动画效果 */
|
||||||
|
#FunctionBtn, #RightDeviceCard, #ModuleCard {
|
||||||
|
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 按钮按下效果 */
|
||||||
|
#FunctionBtn:pressed {
|
||||||
|
transform: scale(0.98);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 设备卡片激活效果 */
|
||||||
|
#RightDeviceCard[active="true"] {
|
||||||
|
animation: glow-pulse 2s ease-in-out infinite alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 发光脉冲动画 */
|
||||||
|
@keyframes glow-pulse {
|
||||||
|
from {
|
||||||
|
box-shadow: 0 0 10px rgba(0, 255, 136, 0.3);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
box-shadow: 0 0 20px rgba(0, 255, 136, 0.6);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 加载状态旋转动画 */
|
||||||
|
#FunctionBtn[class="loading"]::after {
|
||||||
|
content: "";
|
||||||
|
width: 16px;
|
||||||
|
height: 16px;
|
||||||
|
border: 2px solid transparent;
|
||||||
|
border-top: 2px solid currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
animation: spin 1s linear infinite;
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes spin {
|
||||||
|
0% { transform: rotate(0deg); }
|
||||||
|
100% { transform: rotate(360deg); }
|
||||||
|
}
|
||||||
@ -0,0 +1,326 @@
|
|||||||
|
/* ===============================================
|
||||||
|
战场探索系统 - 蓝色军事主题样式表
|
||||||
|
版本: 2.1 蓝色配色版
|
||||||
|
=============================================== */
|
||||||
|
|
||||||
|
/* 全局字体和基础样式 */
|
||||||
|
QWidget {
|
||||||
|
font-family: "Microsoft YaHei", "SimHei", sans-serif;
|
||||||
|
color: #ffffff;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 主面板样式 */
|
||||||
|
#rightFunctionPanel {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #0f1419, stop:1 #1a252f);
|
||||||
|
border-left: 3px solid #00a8ff;
|
||||||
|
border-radius: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 面板标题 */
|
||||||
|
#PanelTitle {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,
|
||||||
|
stop:0 #00a8ff, stop:1 #0078d4);
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: bold;
|
||||||
|
padding: 16px 20px;
|
||||||
|
border-radius: 10px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
text-align: center;
|
||||||
|
border: 2px solid #00a8ff;
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 模块卡片 */
|
||||||
|
#ModuleCard {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #1e2832, stop:1 #2a3441);
|
||||||
|
border-radius: 12px;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
border-left: 4px solid #00a8ff;
|
||||||
|
padding: 0px;
|
||||||
|
margin-bottom: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#ModuleCard:hover {
|
||||||
|
border-color: #00a8ff;
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #243340, stop:1 #304050);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 模块标题 */
|
||||||
|
#ModuleTitle {
|
||||||
|
color: #00a8ff;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 700;
|
||||||
|
text-shadow: 0 0 5px rgba(0, 168, 255, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
#ModuleIcon {
|
||||||
|
color: #00a8ff;
|
||||||
|
font-size: 20px;
|
||||||
|
text-shadow: 0 0 8px rgba(0, 168, 255, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 模块分隔线 */
|
||||||
|
#ModuleSeparator {
|
||||||
|
border: none;
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,
|
||||||
|
stop:0 transparent, stop:0.5 #3c4a59, stop:1 transparent);
|
||||||
|
height: 1px;
|
||||||
|
margin: 8px 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 设备选择器 */
|
||||||
|
#device-selector {
|
||||||
|
background: #2a3441;
|
||||||
|
border: 1px solid #3c4a59;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 设备卡片 */
|
||||||
|
#RightDeviceCard {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #2a3441, stop:1 #34404f);
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
padding: 12px;
|
||||||
|
margin: 4px;
|
||||||
|
min-height: 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#RightDeviceCard:hover {
|
||||||
|
border-color: #66d6ff;
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #34404f, stop:1 #3e4a5f);
|
||||||
|
}
|
||||||
|
|
||||||
|
#RightDeviceCard[active="true"] {
|
||||||
|
border-color: #00a8ff;
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 rgba(0, 168, 255, 0.1), stop:1 rgba(0, 168, 255, 0.05));
|
||||||
|
box-shadow: 0 0 15px rgba(0, 168, 255, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
#DeviceName {
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
#DeviceStatus {
|
||||||
|
color: #a4b0be;
|
||||||
|
font-size: 11px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 功能按钮基础样式 */
|
||||||
|
#FunctionBtn {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #2a3441, stop:1 #34404f);
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
padding: 12px 16px;
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
margin: 4px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn:hover {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #34404f, stop:1 #3e4a5f);
|
||||||
|
border-color: #66d6ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn:pressed {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #1e2a36, stop:1 #283341);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 主要按钮样式 */
|
||||||
|
#FunctionBtn[class="primary-large"] {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #00a8ff, stop:1 #0078d4);
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
border: 2px solid #00a8ff;
|
||||||
|
text-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="primary-large"]:hover {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #0078d4, stop:1 #005a9e);
|
||||||
|
box-shadow: 0 4px 15px rgba(0, 168, 255, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="primary-medium"] {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #00a8ff, stop:1 #0078d4);
|
||||||
|
color: #ffffff;
|
||||||
|
font-weight: 700;
|
||||||
|
border: 2px solid #00a8ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="primary-medium"]:hover {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #0078d4, stop:1 #005a9e);
|
||||||
|
box-shadow: 0 3px 12px rgba(0, 168, 255, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 次要按钮样式 */
|
||||||
|
#FunctionBtn[class="secondary-medium"] {
|
||||||
|
background: #2a3441;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="secondary-medium"]:hover {
|
||||||
|
border-color: #66d6ff;
|
||||||
|
background: #34404f;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="secondary-small"] {
|
||||||
|
background: #2a3441;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 8px 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="secondary-small"]:hover {
|
||||||
|
border-color: #66d6ff;
|
||||||
|
background: #34404f;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 危险按钮样式 */
|
||||||
|
#FunctionBtn[class="danger"] {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #ff3838, stop:1 #c44569);
|
||||||
|
border: 2px solid #ff3838;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn[class="danger"]:hover {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #e53e3e, stop:1 #b83b5e);
|
||||||
|
box-shadow: 0 4px 15px rgba(255, 56, 56, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 加载状态按钮 */
|
||||||
|
#FunctionBtn[class="loading"] {
|
||||||
|
background: #34404f;
|
||||||
|
border-color: #3c4a59;
|
||||||
|
color: #a4b0be;
|
||||||
|
}
|
||||||
|
|
||||||
|
#FunctionBtn:disabled {
|
||||||
|
background: #1e2832;
|
||||||
|
color: #556983;
|
||||||
|
border-color: #2a3441;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 统计显示区域 */
|
||||||
|
#stats-display {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #2a3441, stop:1 #34404f);
|
||||||
|
border-radius: 8px;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
border-left: 4px solid #00a8ff;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#stat-label {
|
||||||
|
color: #a4b0be;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
#stat-value {
|
||||||
|
color: #00a8ff;
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: bold;
|
||||||
|
text-shadow: 0 0 8px rgba(0, 168, 255, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
#threat-level {
|
||||||
|
color: #ffa502;
|
||||||
|
font-size: 15px;
|
||||||
|
font-weight: 700;
|
||||||
|
text-shadow: 0 0 5px rgba(255, 165, 2, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 通话状态 */
|
||||||
|
#call-status {
|
||||||
|
background: #2a3441;
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
border-radius: 6px;
|
||||||
|
padding: 12px 16px;
|
||||||
|
color: #a4b0be;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
|
margin-top: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 音量控制 */
|
||||||
|
#volume-label {
|
||||||
|
color: #a4b0be;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
#volume-percent {
|
||||||
|
color: #00a8ff;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 音量滑块样式 */
|
||||||
|
#volume-slider::groove:horizontal {
|
||||||
|
border: 2px solid #3c4a59;
|
||||||
|
height: 8px;
|
||||||
|
background: #2a3441;
|
||||||
|
border-radius: 4px;
|
||||||
|
margin: 2px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#volume-slider::handle:horizontal {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:1,
|
||||||
|
stop:0 #00a8ff, stop:1 #0078d4);
|
||||||
|
border: 2px solid #00a8ff;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin: -8px 0;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#volume-slider::handle:horizontal:hover {
|
||||||
|
background: #0078d4;
|
||||||
|
box-shadow: 0 0 8px rgba(0, 168, 255, 0.5);
|
||||||
|
}
|
||||||
|
|
||||||
|
#volume-slider::sub-page:horizontal {
|
||||||
|
background: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0,
|
||||||
|
stop:0 #00a8ff, stop:1 #66d6ff);
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 设备卡片激活效果 */
|
||||||
|
#RightDeviceCard[active="true"] {
|
||||||
|
animation: glow-pulse 2s ease-in-out infinite alternate;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 发光脉冲动画 - 蓝色版 */
|
||||||
|
@keyframes glow-pulse {
|
||||||
|
from {
|
||||||
|
box-shadow: 0 0 10px rgba(0, 168, 255, 0.3);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
box-shadow: 0 0 20px rgba(0, 168, 255, 0.6);
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in new issue