* {
box-sizing: border-box;
}
html,
body,
#app {
height: 100%;
margin: 0;
}
body {
font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
background: #14161a;
color: #d6dbe2;
overflow: hidden;
font-size: 13px;
}
.app {
display: flex;
flex-direction: column;
height: 100vh;
}
/* 悬浮卡片(黑底 70% 透明、圆角 10px) */
.glass {
background: rgba(0, 0, 0, 0.7);
border: 1px solid #333a45;
border-radius: 10px;
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
}
/* 右侧扩展区域 */
.ext-panel {
position: absolute;
right: 20px;
top: 20px;
bottom: 20px;
width: 300px;
display: flex;
flex-direction: column;
gap: 12px;
overflow-y: auto;
pointer-events: none;
z-index: 8;
}
.ext-panel > * {
pointer-events: auto;
flex: 0 0 auto;
}
/* 底部居中:场景位置卡片(由顶部勾选控制显示) */
.scene-overlay {
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: 20px;
width: 300px;
z-index: 9;
pointer-events: auto;
}
/* 让 antd 组件使用与页面一致的字体(含中文 PingFang SC),避免中文回退字形偏大 */
.ant-select,
.ant-select *,
.ant-select-dropdown,
.ant-select-dropdown *,
.ant-btn,
.ant-tag,
.ant-modal,
.ant-table {
font-family: inherit;
}
/* 顶部下拉:与其它元素统一 12px */
.topbar .ant-select,
.topbar .ant-select .ant-select-selector,
.topbar .ant-select .ant-select-selection-item,
.topbar .ant-select .ant-select-selection-placeholder,
.topbar .ant-select .ant-select-selection-search-input {
font-size: 12px !important;
}
.ant-select-dropdown {
font-size: 12px;
}
.data-panel .ant-select,
.data-panel .ant-select * {
font-size: 12px !important;
}
/* 文本型(链接)按钮:亮蓝色,暗底上更清晰 */
.ant-btn-link {
color: #69c0ff;
}
.ant-btn-link:hover {
color: #91d5ff;
}
/* 查询部件弹窗:白底黑字 */
.part-query-modal .ant-modal-content {
background: #fff;
color: #1a1a1a;
}
.part-query-modal .ant-modal-header {
background: #fff;
border-bottom: none;
margin-bottom: 12px;
}
.part-query-modal .ant-modal-title {
color: #111;
font-weight: 600;
}
.part-query-modal .ant-modal-close {
color: #888;
}
.part-query-modal .ant-modal-close:hover {
color: #222;
}
.part-query-modal .ant-modal-body {
color: #1a1a1a;
}
/* 故障详细内容弹窗:白底黑字,固定高度 */
.fault-detail-modal .ant-modal-content {
background: #fff;
color: #1a1a1a;
}
.fault-detail-modal .ant-modal-header {
background: #fff;
border-bottom: none;
margin-bottom: 8px;
}
.fault-detail-modal .ant-modal-title {
color: #111;
font-weight: 600;
}
.fault-detail-modal .ant-modal-close {
color: #888;
}
.fault-detail-modal .ant-modal-close:hover {
color: #222;
}
.fault-detail-modal .ant-modal-body {
color: #1a1a1a;
height: 620px;
overflow-y: auto;
}