feat(ui): 优化控制台响应式布局与视觉体验
前端验证 / verify (push) Failing after 15m3s

- 统一页面标题、圆角、字体和响应式断点,调整暗色主题及图表配色
- 新增表格列标签插件,在窄屏下将表格转换为卡片布局,优化实例、订单、工单等列表展示
- 支持移动端点击订单行进入详情,并完善订单凭据的打印布局
- 在财务中心展示本月及累计消费,补充充值关闭时的提示
- 优化工单详情布局,将附件上传入口整合至富文本编辑器工具栏
- 调整实例操作按钮、SSH 密钥操作及安全菜单图标
- 为多个页面显式导入 definePageMeta,完善页面元数据声明
This commit is contained in:
cneicy committed 2026-11-07 00:09:57 +08:00
1 parent 5d080cacec
commit 42dfead9cd
145 files changed
+1762 -599

No files matched your search

+7 -7
View File
@@ -28,7 +28,7 @@
width: 176px;
height: 176px;
color: var(--p-text-muted-color);
border-radius: 12px;
border-radius: var(--radius-lg);
margin-bottom: 20px;
}
.provider-qr-placeholder .pi[data-v-9d0ee2f9] {
@@ -52,7 +52,7 @@
var(--p-text-color) 6%,
var(--p-content-background)
);
border-radius: 10px;
border-radius: var(--radius-lg);
grid-template-columns: repeat(2, minmax(0, 1fr));
padding: 4px;
display: grid;
@@ -61,7 +61,7 @@
.provider-tab-indicator[data-v-9d0ee2f9] {
background: var(--p-content-background);
pointer-events: none;
border-radius: 7px;
border-radius: var(--radius-md);
width: calc(50% - 4px);
transition: transform 0.2s;
position: absolute;
@@ -77,7 +77,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 7px;
border-radius: var(--radius-md);
padding: 8px;
font-weight: 500;
position: relative;
@@ -101,8 +101,8 @@
min-height: 44px;
font-size: 1em;
}
/* 视口条件 (width<=760px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=760px) {
/* 视口条件 (width<=768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=768px) {
.auth-providers[data-v-9d0ee2f9] {
border-left: 0;
border-top: 1px solid var(--p-content-border-color);
@@ -166,7 +166,7 @@
.qr-box[data-v-9d0ee2f9] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 12px;
border-radius: var(--radius-lg);
justify-content: center;
align-items: center;
width: 200px;
@@ -16,7 +16,7 @@
}
.nav-placeholder span[data-v-02b58e93] {
background: var(--p-content-hover-background);
border-radius: 4px;
border-radius: var(--radius-sm);
width: 78%;
height: 20px;
display: block;
@@ -4,7 +4,7 @@
z-index: 1100;
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 12px;
border-radius: var(--radius-lg);
flex-direction: column;
gap: 12px;
max-width: 420px;
@@ -24,8 +24,8 @@
gap: 8px;
display: flex;
}
/* 视口条件 (width<=500px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=500px) {
/* 视口条件 (width<=480px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=480px) {
.build-notice[data-v-fc2ba853] {
bottom: 12px;
left: 12px;
+1 -1
View File
@@ -23,7 +23,7 @@
width: 110px;
height: 40px;
color: var(--p-text-muted-color, #94a3b8);
border-radius: 6px;
border-radius: var(--radius-md);
flex-shrink: 0;
justify-content: center;
align-items: center;
@@ -15,7 +15,7 @@
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
background: var(--console-panel-bg);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.kv[data-v-94e7f654] {
@@ -45,7 +45,7 @@
text-align: left;
cursor: pointer;
overflow-wrap: anywhere;
border-radius: 5px;
border-radius: var(--radius-md);
flex-direction: column;
gap: 10px;
padding: 17px 14px;
@@ -102,7 +102,7 @@
color: var(--p-text-muted-color);
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 5px;
border-radius: var(--radius-md);
padding: 28px;
}
.catalog-empty i[data-v-a438862d] {
@@ -112,8 +112,8 @@
color: var(--p-primary-color);
text-decoration: none;
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.product-options[data-v-a438862d],
.zone-options[data-v-a438862d] {
grid-template-columns: repeat(2, minmax(0, 1fr));
+2 -2
View File
@@ -41,8 +41,8 @@
gap: 16px;
display: grid;
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.storage-grid[data-v-bc59a2b1] {
grid-template-columns: minmax(0, 1fr);
}
+4 -4
View File
@@ -3,7 +3,7 @@
.common-manage[data-v-34fd3c5d] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 12px;
border-radius: var(--radius-lg);
overflow: hidden;
}
.common-tabs[data-v-34fd3c5d] {
@@ -20,7 +20,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 6px;
border-radius: var(--radius-md);
padding: 10px 14px;
}
.common-tabs button.active[data-v-34fd3c5d] {
@@ -77,8 +77,8 @@
.common-body[data-v-34fd3c5d] .p-datatable {
max-width: 100%;
}
/* 视口条件 (width<=600px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=600px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.common-body[data-v-34fd3c5d] {
padding: 16px;
}
@@ -40,7 +40,7 @@
.bandwidth-capacity[data-v-45a9c613] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 6px;
border-radius: var(--radius-md);
width: 100%;
min-width: 0;
display: flex;
@@ -82,7 +82,7 @@
background: var(--p-content-border-color);
cursor: pointer;
border: 0;
border-radius: 4px;
border-radius: var(--radius-sm);
width: calc(100% - 14px);
height: 3px;
margin: 16px 7px 9px;
@@ -117,8 +117,8 @@
.bandwidth-capacity.is-disabled[data-v-45a9c613] {
opacity: 0.6;
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.bandwidth-field[data-v-45a9c613] {
max-width: none;
}
+3 -3
View File
@@ -8,7 +8,7 @@
font: inherit;
cursor: pointer;
background: 0 0;
border-radius: 8px;
border-radius: var(--radius-md);
flex-direction: column;
justify-content: center;
align-items: center;
@@ -41,8 +41,8 @@
cursor: not-allowed;
opacity: 0.55;
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.storage-add[data-v-68361f8e] {
min-height: 170px;
}
@@ -16,7 +16,7 @@
min-width: 0;
box-shadow: 0 2px 5px
color-mix(in srgb, var(--p-primary-color) 15%, transparent);
border-radius: 8px;
border-radius: var(--radius-md);
flex-direction: column;
gap: 20px;
padding: 16px;
@@ -40,7 +40,7 @@
.storage-capacity[data-v-83c644c5] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 6px;
border-radius: var(--radius-md);
width: 100%;
min-width: 0;
display: flex;
@@ -82,7 +82,7 @@
background: var(--p-content-border-color);
cursor: pointer;
border: 0;
border-radius: 4px;
border-radius: var(--radius-sm);
width: 100%;
height: 3px;
margin: 9px 0;
@@ -128,7 +128,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 4px;
border-radius: var(--radius-sm);
flex-shrink: 0;
justify-content: center;
align-items: center;
@@ -148,8 +148,8 @@
opacity: 0.5;
cursor: not-allowed;
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.storage-card[data-v-83c644c5] {
gap: 20px;
padding: 16px;
@@ -35,12 +35,12 @@
}
.legal-footer-inner a[data-v-81b185f4]:focus-visible,
.legal-footer-inner a[data-v-81b185f4]:hover {
color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
text-underline-offset: 3px;
text-decoration: underline;
}
/* 视口条件 (width<=1023px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1023px) {
/* 视口条件 (width<1024px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1024px) {
.main:has(.config-mobile-total) .console-legal-footer {
margin-bottom: calc(84px + env(safe-area-inset-bottom, 0px));
}
+4 -4
View File
@@ -13,7 +13,7 @@
border: 1px solid var(--console-panel-border);
background: var(--console-panel-bg);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
margin: 0;
overflow: hidden;
}
@@ -52,7 +52,7 @@ dd small[data-v-9a8e05c2] {
border: 1px solid var(--console-panel-border);
background: var(--console-panel-bg);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
gap: 28px;
padding: 14px;
display: flex;
@@ -72,8 +72,8 @@ dd small[data-v-9a8e05c2] {
.form p[data-v-9a8e05c2] {
margin: 0;
}
/* 视口条件 (width<=600px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=600px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.rows > div[data-v-9a8e05c2] {
grid-template-columns: 95px minmax(0, 1fr);
gap: 10px;
+4 -4
View File
@@ -22,7 +22,7 @@
.rows[data-v-2f38c55b] {
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
margin: 0;
overflow: hidden;
}
@@ -51,7 +51,7 @@ dd[data-v-2f38c55b] {
border: 1px solid var(--console-panel-border);
background: var(--console-panel-bg);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
margin: 0;
padding: 28px;
}
@@ -68,8 +68,8 @@ dd[data-v-2f38c55b] {
gap: 7px;
display: flex;
}
/* 视口条件 (width<=600px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=600px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.rows > div[data-v-2f38c55b] {
grid-template-columns: 100px 1fr;
}
+1 -1
View File
@@ -18,7 +18,7 @@
.domains[data-v-6c2c5ee1] .p-datatable {
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.empty[data-v-6c2c5ee1] {
+10 -10
View File
@@ -39,7 +39,7 @@
border: 1px solid var(--console-panel-border);
background: var(--console-panel-bg);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
min-width: 0;
padding: 14px;
}
@@ -132,7 +132,7 @@
.resource-list > div[data-v-e2d08c68] {
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
justify-content: space-between;
align-items: center;
gap: 14px;
@@ -251,7 +251,7 @@
background: var(--console-panel-bg);
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
margin: 0;
overflow: hidden;
}
@@ -313,7 +313,7 @@
border: 1px solid var(--console-panel-border);
width: 100%;
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.ip-table-cell[data-v-e2d08c68] > .p-button {
@@ -346,7 +346,7 @@
.records-table[data-v-e2d08c68] {
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.empty[data-v-e2d08c68] {
@@ -365,10 +365,10 @@
padding-top: 14px;
}
.mono[data-v-e2d08c68] {
font-family: var(--font-mono, monospace);
font-variant-numeric: tabular-nums;
}
/* 视口条件 (width<=1199px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1199px) {
/* 视口条件 (width<1200px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1200px) {
.overview[data-v-e2d08c68],
.stack[data-v-e2d08c68] {
gap: 14px;
@@ -391,8 +391,8 @@
display: grid;
}
}
/* 视口条件 (width<=600px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=600px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.overview[data-v-e2d08c68] {
grid-template-columns: 1fr;
}
+1 -1
View File
@@ -23,7 +23,7 @@
border: 1px solid var(--console-panel-border);
background: var(--console-panel-bg);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 14px;
}
.range[data-v-eb47944f] {
@@ -14,8 +14,8 @@
color: var(--p-red-600);
overflow: hidden;
}
/* 视口条件 (width<=600px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=600px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.task-status[data-v-d99d9473] {
align-content: center;
min-height: 70px;
+1 -1
View File
@@ -10,7 +10,7 @@
}
.dcim-upgrade fieldset[data-v-790898bc] {
border: 1px solid var(--p-content-border-color);
border-radius: 6px;
border-radius: var(--radius-md);
gap: 12px;
display: grid;
}
+2 -2
View File
@@ -30,8 +30,8 @@
color: var(--p-text-muted-color);
font-size: 1rem;
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.storage-grid[data-v-1ac7876b] {
grid-template-columns: minmax(0, 1fr);
}
@@ -21,7 +21,7 @@
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
background: var(--console-panel-bg);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.kv[data-v-ca0029df] {
@@ -65,8 +65,8 @@
padding: 0;
font-size: 1rem;
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.kv[data-v-ca0029df] {
grid-template-columns: 100px minmax(0, 1fr);
}
@@ -104,7 +104,7 @@
.pk-card[data-v-ca0029df] {
border: 1px solid var(--p-content-border-color, #e2e8f0);
text-align: center;
border-radius: 12px;
border-radius: var(--radius-lg);
flex-direction: column;
align-items: center;
gap: 6px;
@@ -20,5 +20,5 @@
}
.oauth-providers a[data-v-45e5a5aa] {
color: var(--p-primary-color);
font-size: 13px;
font-size: 1rem;
}
+3 -3
View File
@@ -10,7 +10,7 @@
width: 220px;
height: 32px;
color: var(--p-text-muted-color, #94a3b8);
border-radius: 8px;
border-radius: var(--radius-md);
align-items: center;
gap: 6px;
padding: 0 10px;
@@ -34,7 +34,7 @@
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
z-index: 200;
border-radius: 10px;
border-radius: var(--radius-lg);
width: min(320px, 100vw - 32px);
max-height: 380px;
padding: 6px;
@@ -87,7 +87,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 6px;
border-radius: var(--radius-md);
flex-direction: column;
gap: 2px;
width: 100%;
@@ -30,13 +30,13 @@
border-bottom: none;
}
.notice-row:hover .notice-title[data-v-a93c47c1] {
color: var(--p-primary-color, #0052d9);
color: var(--p-primary-color);
}
/* 键盘操作的可见焦点:不要只保留鼠标 hover 效果而移除此反馈。 */
.notice-row[data-v-a93c47c1]:focus-visible {
outline: 2px solid var(--p-primary-color, #0052d9);
outline: 2px solid var(--p-primary-color);
outline-offset: -2px;
border-radius: 4px;
border-radius: var(--radius-sm);
}
.detail-time[data-v-a93c47c1] {
color: var(--p-text-muted-color, #94a3b8);
@@ -18,7 +18,7 @@
white-space: nowrap;
background: 0 0;
border: none;
border-radius: 4px;
border-radius: var(--radius-sm);
flex: 1;
padding: 7px 10px;
font-size: 1rem;
@@ -78,8 +78,8 @@
.server-pagination[data-v-7ce76df7] .p-paginator {
background: 0 0;
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.server-head[data-v-7ce76df7] {
flex-wrap: wrap;
gap: 2px;
@@ -10,7 +10,7 @@
border: 1px solid var(--p-content-border-color, #e2e8f0);
background: var(--p-content-background);
border-left-width: 3px;
border-radius: 8px;
border-radius: var(--radius-md);
align-items: baseline;
gap: 8px;
padding: 10px 12px;
+10 -3
View File
@@ -14,7 +14,8 @@
color: var(--p-text-color);
margin-top: 7px;
font-size: 1.75rem;
font-weight: 400;
font-weight: 600;
font-variant-numeric: tabular-nums;
line-height: 2.571rem;
}
.wallet-actions[data-v-0dbd1f86] {
@@ -30,8 +31,14 @@
.wallet-actions[data-v-0dbd1f86] .p-button {
min-height: 36px;
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
.wallet-hint[data-v-0dbd1f86] {
color: var(--p-text-muted-color);
margin-top: 8px;
font-size: 0.8125rem;
text-align: center;
}
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.wallet-body[data-v-0dbd1f86] {
padding-top: 28px;
}
+145 -3
View File
@@ -11,7 +11,7 @@
background: var(--p-primary-color);
min-height: 36px;
color: var(--p-primary-contrast-color);
border-radius: 5px;
border-radius: var(--radius-md);
justify-content: center;
align-items: center;
gap: 8px;
@@ -57,7 +57,7 @@
}
/* 键盘操作的可见焦点:不要只保留鼠标 hover 效果而移除此反馈。 */
.host-detail-link[data-v-e23fddb0]:focus-visible {
outline: 2px solid var(--p-primary-color, #0052d9);
outline: 2px solid var(--p-primary-color);
outline-offset: 4px;
}
.host-name[data-v-e23fddb0] {
@@ -182,7 +182,7 @@
width: 36px;
height: 36px;
color: var(--traffic-accent);
border-radius: 8px;
border-radius: var(--radius-md);
flex-shrink: 0;
place-items: center;
font-size: 1.75rem;
@@ -334,3 +334,145 @@
min-width: 0;
}
}
@media (width<640px) {
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message) {
grid-template-columns: 20px minmax(0, 1fr) auto;
grid-template-areas: "check name status" "check prod os" "check flow flow" "check ip due";
align-items: center;
gap: 6px 10px;
padding: 14px 16px;
display: grid;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td {
text-align: left;
justify-content: flex-start;
gap: 4px;
padding: 0 !important;
font-size: 0.875rem;
display: none;
position: static;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td::before {
display: none;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td:first-child {
grid-area: check;
display: flex;
align-self: start;
margin-top: 2px;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="操作系统"] {
grid-area: os;
display: flex;
justify-content: flex-end;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="产品编号"] {
grid-area: name;
display: flex;
color: var(--p-text-color);
font-size: 1rem;
font-weight: 600;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="产品状态"] {
grid-area: status;
display: flex;
justify-content: flex-end;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="名称"] {
grid-area: prod;
display: flex;
color: var(--p-text-muted-color);
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="流量"] {
grid-area: flow;
display: flex;
margin: 4px 0;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="ID"] {
grid-area: id;
display: none;
color: var(--p-text-muted-color);
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="IP"] {
grid-area: ip;
display: flex;
color: var(--p-text-muted-color);
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="到期时间"] {
grid-area: due;
display: flex;
color: var(--p-text-muted-color);
justify-content: flex-end;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="到期时间"]::before {
content: "到期 ";
color: var(--p-text-muted-color);
font-size: 0.875rem;
display: inline;
}
.list-table[data-v-e23fddb0] td[data-label="流量"] > * {
flex: 1;
}
.list-table[data-v-e23fddb0] td[data-label="名称"] > * {
align-items: flex-start;
text-align: left;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="到期时间"] {
white-space: nowrap !important;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="ID"]
* {
color: var(--p-text-muted-color);
font-weight: 400;
}
.list-table[data-v-e23fddb0]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="流量"]:has(> .host-traffic > .traffic-note:only-child) {
display: none;
}
}
@@ -27,7 +27,7 @@
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
background: var(--console-panel-bg);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.kv[data-v-cd28d8b4] {
@@ -74,7 +74,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 4px;
border-radius: var(--radius-sm);
flex-shrink: 0;
justify-content: center;
align-items: center;
@@ -98,7 +98,7 @@
}
.repair-item[data-v-cd28d8b4] {
border: 1px solid var(--p-content-border-color, #e2e8f0);
border-radius: 10px;
border-radius: var(--radius-lg);
flex-direction: column;
gap: 8px;
padding: 14px 16px;
@@ -130,7 +130,7 @@
var(--console-panel-bg)
);
color: var(--p-primary-color);
border-radius: 6px;
border-radius: var(--radius-md);
margin-bottom: 14px;
padding: 14px;
font-size: 1rem;
@@ -20,7 +20,7 @@
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
background: var(--console-panel-bg);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.kv[data-v-4e83e0f6] {
@@ -79,11 +79,11 @@
background: var(--console-panel-bg);
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 14px;
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.kv[data-v-4e83e0f6] {
grid-template-columns: 100px minmax(0, 1fr);
}
@@ -128,7 +128,7 @@
}
.refund-state[data-v-4e83e0f6] {
background: var(--p-content-hover-background);
border-radius: 8px;
border-radius: var(--radius-md);
flex-direction: column;
gap: 10px;
padding: 12px 14px;
+1 -1
View File
@@ -90,7 +90,7 @@
background: var(--console-panel-bg);
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
}
.grp[data-v-22ec0282] .p-datatable-thead > tr > th {
background: var(--console-page-bg);
@@ -31,7 +31,7 @@
background: var(--console-panel-bg);
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
gap: 12px;
padding: 14px;
}
@@ -46,15 +46,15 @@
.shell-secondary[data-v-f12d9300] {
min-height: 230px;
}
/* 视口条件 (width<=1199px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1199px) {
/* 视口条件 (width<1200px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1200px) {
.dcim .shell-column[data-v-f12d9300],
.dcim .shell-grid[data-v-f12d9300] {
gap: 14px;
}
}
/* 视口条件 (width<=1023px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1023px) {
/* 视口条件 (width<1024px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1024px) {
.instance-loading-shell:not(.dcim) .shell-grid[data-v-f12d9300] {
grid-template-columns: 1fr;
}
@@ -70,8 +70,8 @@
display: grid;
}
}
/* 视口条件 (width<=600px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=600px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.dcim .shell-grid[data-v-f12d9300] {
grid-template-columns: 1fr;
padding-top: 14px;
@@ -22,14 +22,14 @@
border: 1px solid var(--p-content-border-color, #e2e8f0);
min-width: 0;
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 14px;
}
.chart-title[data-v-6a900feb] {
border-bottom: 1px solid var(--console-panel-border);
min-height: 24px;
margin-bottom: 21px;
padding-bottom: 21px;
margin-bottom: 14px;
padding-bottom: 12px;
font-size: 1rem;
font-weight: 600;
}
@@ -64,3 +64,8 @@
color: var(--p-text-muted-color, #94a3b8);
font-size: 0.875rem;
}
@media (width>=1280px) {
.charts[data-v-6a900feb] {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@@ -28,7 +28,7 @@
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
background: var(--console-panel-bg);
border-radius: 6px;
border-radius: var(--radius-md);
min-width: 0;
padding: 14px;
}
@@ -45,7 +45,7 @@
.nw[data-v-aa906366] .network-table {
border: 1px solid var(--console-panel-border);
background: var(--console-panel-bg);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.nw[data-v-aa906366] .network-table.p-datatable .p-datatable-tbody > tr > td,
@@ -67,8 +67,8 @@
.nw[data-v-aa906366] .network-table .empty {
padding: 0;
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.nw[data-v-aa906366] .network-head {
align-items: flex-start;
}
@@ -136,7 +136,7 @@
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
background: var(--console-panel-bg);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.info-table .kv[data-v-aa906366] {
@@ -157,8 +157,8 @@
.info-table .kv > span[data-v-aa906366] {
font-weight: 600;
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.info-table .kv[data-v-aa906366] {
grid-template-columns: 100px minmax(0, 1fr);
}
@@ -2,7 +2,7 @@
/* 导入方:app/components/instance/InstanceOnDemand.vue。 */
.on-demand[data-v-2710106c] {
gap: 12px;
font-size: 13px;
font-size: 1rem;
display: grid;
}
.on-demand h4[data-v-2710106c],
@@ -11,7 +11,7 @@
}
.on-demand small[data-v-2710106c] {
color: var(--p-text-muted-color);
font-size: 12px;
font-size: 0.9375rem;
}
.actions[data-v-2710106c] {
flex-wrap: wrap;
@@ -22,6 +22,6 @@
align-items: center;
gap: 8px;
margin-top: 12px;
font-size: 13px;
font-size: 1rem;
display: flex;
}
@@ -24,7 +24,7 @@
background: var(--console-panel-bg);
border: 1px solid var(--p-content-border-color, #e2e8f0);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
gap: 12px;
padding: 14px;
}
@@ -41,7 +41,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 4px;
border-radius: var(--radius-sm);
width: 100%;
padding: 0;
}
@@ -84,7 +84,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 4px;
border-radius: var(--radius-sm);
flex-shrink: 0;
justify-content: center;
padding: 0;
@@ -131,7 +131,7 @@
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
color: var(--p-text-muted-color, #64748b);
border-radius: 6px;
border-radius: var(--radius-md);
align-items: center;
padding: 14px;
font-size: 1rem;
@@ -193,7 +193,7 @@
.disk-row[data-v-fe24aa37] {
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
align-items: center;
gap: 10px;
padding: 14px;
@@ -237,8 +237,8 @@
margin: 0;
font-size: 0.875rem;
}
/* 视口条件 (width<=1023px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1023px) {
/* 视口条件 (width<1024px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1024px) {
.grid[data-v-fe24aa37] {
grid-template-columns: 1fr;
}
@@ -60,10 +60,10 @@
.rd-code[data-v-01429388] {
overflow-wrap: anywhere;
background: var(--p-content-hover-background);
border-radius: 6px;
border-radius: var(--radius-md);
min-width: 0;
padding: 4px 10px;
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
font-family: var(--font-mono);
font-size: 0.9375rem;
}
.rd-hint[data-v-01429388] {
@@ -3,7 +3,7 @@
.service-info[data-v-0ff5d554] {
background: var(--console-panel-bg);
border: 1px solid var(--console-panel-border);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 21px;
}
.service-heading[data-v-0ff5d554] {
@@ -56,8 +56,8 @@ dd[data-v-0ff5d554] {
margin: 0;
line-height: 1.7;
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.service-rows[data-v-0ff5d554] {
grid-template-columns: 1fr;
}
@@ -51,7 +51,7 @@
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
background: var(--console-panel-bg);
border-radius: 6px;
border-radius: var(--radius-md);
gap: 0;
overflow: hidden;
}
@@ -90,8 +90,8 @@
.traffic-table .traffic-error[data-v-484c7b21] {
flex-wrap: wrap;
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.traffic-table .traffic-row[data-v-484c7b21] {
grid-template-columns: 100px minmax(0, 1fr);
}
+6 -6
View File
@@ -59,7 +59,7 @@
.jy-model-table-wrap[data-v-7837d303] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 4px;
border-radius: var(--radius-sm);
width: 100%;
overflow-x: auto;
}
@@ -182,7 +182,7 @@
border-radius: 0 4px 4px 0;
}
.jy-defense-options button[data-v-7837d303]:only-child {
border-radius: 4px;
border-radius: var(--radius-sm);
}
.jy-defense-options button.active[data-v-7837d303] {
z-index: 1;
@@ -204,8 +204,8 @@
.jy-dcim-config .image-groups[data-v-7837d303] {
max-width: 960px;
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.jy-config-row[data-v-7837d303] {
grid-template-columns: 1fr;
gap: 8px;
@@ -225,8 +225,8 @@
gap: 5px 12px;
}
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.storage-system[data-v-7837d303] {
width: 100%;
}
+3 -3
View File
@@ -22,7 +22,7 @@
width: 196px;
min-height: 44px;
color: var(--p-text-color);
border-radius: 6px;
border-radius: var(--radius-md);
align-items: center;
padding: 8px 14px;
display: flex;
@@ -31,8 +31,8 @@
font-size: 1rem;
font-weight: 500;
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.storage-system[data-v-e8ce6418] {
width: 100%;
}
+11 -11
View File
@@ -7,7 +7,7 @@
}
.current[data-v-625e699a] {
background: var(--p-content-hover-background);
border-radius: 8px;
border-radius: var(--radius-md);
align-items: center;
gap: 10px;
padding: 10px 14px;
@@ -30,7 +30,7 @@
background: var(--p-content-background);
color: var(--p-text-muted-color, #64748b);
cursor: pointer;
border-radius: 8px;
border-radius: var(--radius-md);
align-items: center;
gap: 6px;
padding: 7px 14px;
@@ -46,11 +46,11 @@
}
.seg-item.active[data-v-625e699a],
.seg-item[data-v-625e699a]:hover {
border-color: var(--p-primary-color, #0052d9);
border-color: var(--p-primary-color);
}
.seg-item.active[data-v-625e699a] {
background: var(--p-highlight-background);
color: var(--p-primary-color, #0052d9);
color: var(--p-primary-color);
font-weight: 500;
}
.sk[data-v-625e699a] {
@@ -66,7 +66,7 @@
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
cursor: pointer;
border-radius: 10px;
border-radius: var(--radius-lg);
flex-direction: column;
gap: 8px;
padding: 14px 16px;
@@ -77,7 +77,7 @@
}
.plan.active[data-v-625e699a],
.plan[data-v-625e699a]:hover:not(:disabled) {
border-color: var(--p-primary-color, #0052d9);
border-color: var(--p-primary-color);
}
.plan.active[data-v-625e699a] {
background: var(--p-highlight-background);
@@ -97,7 +97,7 @@
font-weight: 600;
}
.plan-check[data-v-625e699a] {
color: var(--p-primary-color, #0052d9);
color: var(--p-primary-color);
}
.plan-desc[data-v-625e699a] {
color: var(--p-text-muted-color, #64748b);
@@ -131,7 +131,7 @@
}
.sub[data-v-625e699a] {
background: var(--p-content-hover-background);
border-radius: 8px;
border-radius: var(--radius-md);
align-self: flex-start;
gap: 4px;
padding: 3px;
@@ -142,7 +142,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 6px;
border-radius: var(--radius-md);
padding: 5px 14px;
font-size: 0.9375rem;
}
@@ -161,7 +161,7 @@
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
cursor: pointer;
border-radius: 10px;
border-radius: var(--radius-lg);
align-items: center;
gap: 8px;
padding: 12px 14px;
@@ -173,7 +173,7 @@
}
.disk.active[data-v-625e699a],
.disk[data-v-625e699a]:hover {
border-color: var(--p-primary-color, #0052d9);
border-color: var(--p-primary-color);
}
.disk.active[data-v-625e699a] {
background: var(--p-highlight-background);
@@ -25,7 +25,7 @@
background: var(--console-panel-bg);
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
min-width: 0;
padding: 21px;
}
@@ -95,7 +95,7 @@
}
.resource-list > div[data-v-f40d7201] {
border: 1px solid var(--console-panel-border);
border-radius: 6px;
border-radius: var(--radius-md);
justify-content: space-between;
align-items: center;
gap: 14px;
@@ -146,7 +146,7 @@
background: var(--console-panel-bg);
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
margin: 0;
overflow: hidden;
}
@@ -194,10 +194,10 @@
min-width: 100px;
}
.mono[data-v-f40d7201] {
font-family: var(--font-mono, monospace);
font-variant-numeric: tabular-nums;
}
/* 视口条件 (width<=1199px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1199px) {
/* 视口条件 (width<1200px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1200px) {
.overview[data-v-f40d7201],
.stack[data-v-f40d7201] {
gap: 14px;
@@ -220,8 +220,8 @@
display: grid;
}
}
/* 视口条件 (width<=600px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=600px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.overview[data-v-f40d7201] {
grid-template-columns: 1fr;
}
@@ -4,7 +4,7 @@
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
background: var(--console-panel-bg);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.info-table[data-v-a7ffe460] .p-datatable-thead > tr > th {
@@ -37,7 +37,7 @@
}
.bs-guide[data-v-a7ffe460] {
border: 1px dashed var(--p-content-border-color, #e2e8f0);
border-radius: 10px;
border-radius: var(--radius-lg);
flex-direction: column;
align-items: flex-start;
gap: 10px;
+2 -2
View File
@@ -22,8 +22,8 @@
font-size: 0.875rem;
line-height: 1.429rem;
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.storage-system[data-v-8ba1c9ae] {
width: 100%;
}
+1 -1
View File
@@ -32,7 +32,7 @@
}
.logs-table[data-v-c4521240] {
border: 1px solid var(--console-panel-border);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
/* 允许连续长文本换行,防止IP、密钥或用户输入撑破当前容器;不会修改原始数据。 */
+1 -1
View File
@@ -13,5 +13,5 @@
line-height: 1.7;
}
.form label[data-v-1ff078ab] {
font-size: 13px;
font-size: 1rem;
}
@@ -14,7 +14,7 @@
}
.choices[data-v-c9212028] {
border: 1px solid var(--p-content-border-color);
border-radius: 6px;
border-radius: var(--radius-md);
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
gap: 0;
display: grid;
@@ -7,7 +7,7 @@
}
.current[data-v-b98b2e63] {
background: var(--p-content-hover-background);
border-radius: 8px;
border-radius: var(--radius-md);
align-items: center;
gap: 10px;
padding: 10px 14px;
@@ -30,7 +30,7 @@
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
cursor: pointer;
border-radius: 10px;
border-radius: var(--radius-lg);
flex-direction: column;
gap: 8px;
padding: 14px 16px;
+1 -1
View File
@@ -13,5 +13,5 @@
line-height: 1.7;
}
.form label[data-v-1d12fc4b] {
font-size: 13px;
font-size: 1rem;
}
+5 -5
View File
@@ -25,8 +25,8 @@
width: 0;
min-width: 0;
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.storage-grid[data-v-b5ff32bb] {
grid-template-columns: 1fr;
}
@@ -34,7 +34,7 @@
.dcim-base[data-v-b5ff32bb] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 6px;
border-radius: var(--radius-md);
margin-bottom: 21px;
padding: 21px;
box-shadow: 0 1px 3px #0000001a;
@@ -153,8 +153,8 @@
.config-change-fields .form-row[data-v-b5ff32bb] {
margin-bottom: 0;
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.config-change-fields[data-v-b5ff32bb] {
grid-template-columns: 1fr;
gap: 14px;
@@ -3,7 +3,7 @@
.notification-preferences[data-v-f4132ec8] {
border: 1px solid var(--console-panel-border);
background: var(--console-panel-bg);
border-radius: 8px;
border-radius: var(--radius-md);
padding: 16px 20px;
}
.preferences-heading[data-v-f4132ec8] {
@@ -11,7 +11,7 @@
border: 1px solid var(--p-content-border-color);
-webkit-backdrop-filter: none;
backdrop-filter: none;
border-radius: 10px;
border-radius: var(--radius-lg);
box-shadow: 0 8px 28px #0f172a1f;
}
.operation-toasts .p-toast-message-content {
@@ -61,8 +61,8 @@
.operation-toast-results li + li {
margin-top: 6px;
}
/* 视口条件 (width<=600px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=600px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.operation-toasts.p-toast {
top: calc(var(--console-top-offset, 56px) + 12px) !important;
right: 12px !important;
@@ -3,7 +3,7 @@
.page-info-notice[data-v-8f81f268] {
min-width: 0;
box-shadow: none;
border-radius: 6px;
border-radius: var(--radius-md);
}
.page-info-notice[data-v-8f81f268] .p-message-content {
align-items: flex-start;
@@ -15,7 +15,7 @@
align-items: center;
width: 14px;
height: 1.6rem;
font-size: 14px;
font-size: 1.0625rem;
display: inline-flex;
}
/* 允许连续长文本换行,防止IP、密钥或用户输入撑破当前容器;不会修改原始数据。 */
+5 -5
View File
@@ -22,7 +22,7 @@
border: 1px solid var(--p-content-border-color, #e2e8f0);
background: var(--p-content-background);
cursor: pointer;
border-radius: 10px;
border-radius: var(--radius-lg);
align-items: center;
gap: 10px;
padding: 12px 14px;
@@ -33,7 +33,7 @@
}
.gateway-item.active[data-v-4931e21e],
.gateway-item[data-v-4931e21e]:hover {
border-color: var(--p-primary-color, #3b82f6);
border-color: var(--p-primary-color);
}
.gateway-item.active[data-v-4931e21e] {
background: var(--p-highlight-background);
@@ -66,7 +66,7 @@
padding: 20px 0;
}
.paid i[data-v-4931e21e] {
color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
font-size: 2.75rem;
}
.paid p[data-v-4931e21e] {
@@ -80,7 +80,7 @@
/* 代金券选项及反馈;无可用券和加载状态应与已选中状态清晰区分。 */
.voucher-row[data-v-4931e21e] {
border: 1px solid var(--p-content-border-color);
border-radius: 6px;
border-radius: var(--radius-md);
flex-direction: column;
gap: 10px;
min-width: 0;
@@ -193,7 +193,7 @@
border-radius: 0 0 6px 6px;
}
.gateway-list > .gateway-item[data-v-4931e21e]:only-of-type {
border-radius: 6px;
border-radius: var(--radius-md);
}
.balance-icon[data-v-4931e21e] {
text-align: center;
@@ -14,7 +14,7 @@
);
min-width: 0;
color: var(--p-text-color);
border-radius: 8px;
border-radius: var(--radius-md);
align-items: flex-start;
gap: 12px;
padding: 16px 20px;
@@ -111,8 +111,8 @@
.category-notice-content[data-v-faa6a7a3] > :last-child {
margin-bottom: 0;
}
/* 视口条件 (width<=760px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=760px) {
/* 视口条件 (width<=768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=768px) {
.category-notice[data-v-faa6a7a3] {
gap: 10px;
padding: 14px 16px;
@@ -199,7 +199,7 @@
text-decoration: underline;
}
.description-rich[data-v-8a6cfb44] img {
border-radius: 4px;
border-radius: var(--radius-sm);
max-width: 100%;
height: auto;
display: block;
@@ -231,7 +231,7 @@
.description-rich[data-v-8a6cfb44] pre {
white-space: pre-wrap;
background: var(--p-content-hover-background);
border-radius: 4px;
border-radius: var(--radius-sm);
max-width: 100%;
padding: 12px;
overflow-x: auto;
@@ -253,8 +253,8 @@
.description-rich[data-v-8a6cfb44] > :last-child {
margin-bottom: 0;
}
/* 视口条件 (width<=760px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=760px) {
/* 视口条件 (width<=768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=768px) {
.description-header[data-v-8a6cfb44] {
padding: 10px 20px;
}
@@ -271,10 +271,10 @@
}
.description-field dt[data-v-8a6cfb44] {
gap: 8px;
font-size: 14px;
font-size: 1.0625rem;
}
.description-field dt i[data-v-8a6cfb44] {
font-size: 14px;
font-size: 1.0625rem;
}
.description-field dd[data-v-8a6cfb44] {
font-size: 15px;
@@ -27,7 +27,7 @@
max-width: 100%;
color: var(--p-primary-700);
overflow-wrap: anywhere;
border-radius: 5px;
border-radius: var(--radius-md);
padding: 1px 7px;
font-size: 0.8125rem;
font-weight: 600;
@@ -21,7 +21,7 @@
color: var(--p-text-color);
cursor: pointer;
background: 0 0;
border-radius: 5px;
border-radius: var(--radius-md);
font-size: 1.0625rem;
}
.recharge-option.active[data-v-c038cb91] {
+3 -3
View File
@@ -15,7 +15,7 @@
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
background: var(--console-panel-bg);
border-radius: 6px;
border-radius: var(--radius-md);
overflow: hidden;
}
.kv[data-v-7efd9d4d] {
@@ -57,8 +57,8 @@
.action-cell[data-v-7efd9d4d] .p-button {
max-width: 100%;
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.kv[data-v-7efd9d4d] {
grid-template-columns: 100px minmax(0, 1fr);
}
+3 -3
View File
@@ -19,9 +19,9 @@
display: flex;
}
.console-mark[data-v-e696489e] {
color: #0052d9;
color: var(--p-primary-color);
background: #edf4ff;
border-radius: 10px;
border-radius: var(--radius-lg);
flex: 0 0 40px;
place-items: center;
width: 40px;
@@ -87,7 +87,7 @@
}
.state-connecting[data-v-e696489e],
.state-creating[data-v-e696489e] {
color: #0052d9;
color: var(--p-primary-color);
}
.console-toolbar[data-v-e696489e] {
background: #f8fafc;
@@ -3,7 +3,7 @@
.rich-editor[data-v-858a2ddd] {
border: 1px solid var(--p-form-field-border-color);
background: var(--p-form-field-background);
border-radius: 4px;
border-radius: var(--radius-sm);
overflow: hidden;
}
.rich-editor[data-v-858a2ddd]:focus-within {
+3 -3
View File
@@ -415,7 +415,7 @@
.roxy-staff[data-v-65169a82] {
background: #b38c69;
border: 1px solid #624d44;
border-radius: 6px;
border-radius: var(--radius-md);
width: 182px;
height: 5px;
top: 144px;
@@ -462,8 +462,8 @@
scale: 1 0.08;
}
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.roxy-eye[data-v-65169a82],
.roxy-head[data-v-65169a82] {
animation: none;
@@ -2,13 +2,13 @@
/* 导入方:app/components/SecurityVerificationDialog.vue、app/components/instance/DcimBilling.vue、app/components/instance/InstanceBilling.vue、app/pages/account/index.vue、app/pages/login.vue、app/pages/transfer/index.vue。 */
.security-verify[data-v-ff4061ec] {
gap: 8px;
font-size: 13px;
font-size: 1rem;
display: grid;
}
.security-verify label[data-v-ff4061ec],
.tip[data-v-ff4061ec] {
color: var(--p-text-muted-color);
font-size: 12px;
font-size: 0.9375rem;
}
.verify-input[data-v-ff4061ec] {
gap: 8px;
@@ -20,7 +20,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 4px;
border-radius: var(--radius-sm);
flex: none;
justify-content: center;
align-items: center;
@@ -20,7 +20,7 @@
color: var(--p-text-color);
text-align: left;
cursor: pointer;
border-radius: 8px;
border-radius: var(--radius-md);
align-items: center;
gap: 12px;
padding: 8px;
@@ -34,7 +34,7 @@
background: var(--p-content-hover-background);
}
.thumbnail[data-v-77cd676b] {
border-radius: 4px;
border-radius: var(--radius-sm);
flex: 0 0 112px;
justify-content: center;
align-items: center;
@@ -99,7 +99,7 @@
/* 图片预览区域与下载操作分开,加载失败时保留可理解的错误反馈。 */
.image-preview[data-v-77cd676b] {
background: var(--p-content-hover-background);
border-radius: 6px;
border-radius: var(--radius-md);
justify-content: center;
align-items: center;
min-height: 120px;
@@ -132,7 +132,7 @@
.download-image[data-v-77cd676b] {
color: var(--p-primary-contrast-color);
background: var(--p-primary-color);
border-radius: 6px;
border-radius: var(--radius-md);
justify-content: center;
align-items: center;
gap: 8px;
@@ -11,7 +11,7 @@
.notice[data-v-e4be3b52] {
border: 1px solid var(--p-content-border-color, #e2e8f0);
background: var(--p-content-hover-background);
border-radius: 8px;
border-radius: var(--radius-md);
padding: 12px 16px;
}
.notice-title[data-v-e4be3b52] {
@@ -67,7 +67,7 @@
.notice[data-v-e4be3b52] {
background: var(--p-blue-50, #eff6ff);
border-color: var(--p-blue-200, #bfdbfe);
border-radius: 5px;
border-radius: var(--radius-md);
padding: 14px;
}
.notice ul[data-v-e4be3b52],
+97 -7
View File
@@ -52,7 +52,7 @@
.message[data-v-3743a20f] {
background: var(--p-highlight-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
border-radius: 10px;
border-radius: var(--radius-lg);
padding: 14px 16px;
}
.message.admin[data-v-3743a20f] {
@@ -122,8 +122,8 @@
.list-head h2[data-v-3743a20f],
.page-head h2[data-v-3743a20f] {
margin: 0;
font-size: 1.125rem;
font-weight: 700;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 24.5px;
}
.list-toolbar[data-v-3743a20f],
@@ -136,7 +136,7 @@
width: 280px;
}
.list-table[data-v-3743a20f] {
border-radius: 6px;
border-radius: var(--radius-md);
box-shadow: 0 1px 3px #0f172a12;
}
.list-foot[data-v-3743a20f] {
@@ -202,7 +202,8 @@
}
.head-panel[data-v-3743a20f] {
border-bottom: 1px solid var(--p-content-border-color);
padding-bottom: 14px;
gap: 6px;
padding-bottom: 16px;
}
.ticket-head[data-v-3743a20f] {
flex-wrap: wrap;
@@ -210,11 +211,22 @@
gap: 14px;
}
.ticket-title[data-v-3743a20f] {
flex-wrap: wrap;
flex: 1;
align-items: center;
gap: 10px;
min-width: 0;
display: flex;
}
.ticket-title h2[data-v-3743a20f] {
overflow-wrap: anywhere;
margin: 0;
font-size: 1.125rem;
font-size: 1.25rem;
line-height: 1.4;
}
.ticket-title .status-tag[data-v-3743a20f] {
padding: 1px 10px;
font-size: 0.8125rem;
}
.ticket-meta[data-v-3743a20f],
.ticket-num[data-v-3743a20f] {
@@ -231,7 +243,7 @@
.message.admin[data-v-3743a20f] {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 0;
position: relative;
box-shadow: 0 1px 3px #0f172a0a;
@@ -289,3 +301,81 @@
flex-wrap: wrap;
}
}
.reply-attachments[data-v-3743a20f] {
flex-wrap: wrap;
align-items: center;
gap: 10px;
margin-top: 12px;
display: flex;
}
.reply-attachments[data-v-3743a20f]:empty {
display: none;
}
.reply-upload[data-v-3743a20f] {
color: var(--p-text-muted-color);
cursor: pointer;
border-radius: 3px;
align-self: center;
align-items: center;
gap: 5px;
height: 28px;
margin-left: auto;
padding: 0 8px;
font-size: 0.875rem;
display: inline-flex;
position: relative;
}
.reply-upload[data-v-3743a20f]:hover {
background: var(--p-content-hover-background);
color: var(--p-primary-color);
}
.reply-upload input[data-v-3743a20f] {
opacity: 0;
clip: rect(0 0 0 0);
width: 1px;
height: 1px;
position: absolute;
overflow: hidden;
}
.reply-upload[data-v-3743a20f]:has(input:focus-visible) {
outline: 2px solid var(--p-primary-color);
outline-offset: 2px;
}
.reply-upload[data-v-3743a20f]:has(input:disabled) {
opacity: 0.55;
cursor: not-allowed;
pointer-events: none;
}
.reply-file-list[data-v-3743a20f] {
flex-wrap: wrap;
gap: 8px;
margin: 0;
padding: 0;
list-style: none;
display: flex;
}
.reply-file-list li[data-v-3743a20f] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-hover-background);
border-radius: var(--radius-md);
align-items: center;
gap: 2px;
max-width: 260px;
padding: 0 2px 0 10px;
font-size: 0.875rem;
display: inline-flex;
}
.reply-file-list li > span[data-v-3743a20f] {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.reply-upload i[data-v-3743a20f] {
font-size: 0.875rem;
}
@media (width<640px) {
.reply-upload[data-v-3743a20f] {
font-size: 0;
gap: 0;
}
}
+2 -2
View File
@@ -48,8 +48,8 @@
.cart-link[data-v-49461ec8]:hover {
color: var(--p-primary-color);
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.product-head[data-v-49461ec8] {
flex-wrap: wrap;
gap: 8px;
+65 -7
View File
@@ -41,7 +41,7 @@
.receipt[data-v-b3b3cd9c] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 10px;
border-radius: var(--radius-lg);
gap: 56px;
min-width: 0;
padding: 70px 21px 84px;
@@ -70,7 +70,7 @@
.receipt-icon[data-v-b3b3cd9c] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-hover-background);
border-radius: 7px;
border-radius: var(--radius-md);
flex-shrink: 0;
place-items: center;
width: 49px;
@@ -193,7 +193,7 @@
.bank-transfer-panel[data-v-b3b3cd9c] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-hover-background);
border-radius: 8px;
border-radius: var(--radius-md);
flex-direction: column;
gap: 14px;
margin-top: -21px;
@@ -241,7 +241,7 @@
.bank-voucher-list li[data-v-b3b3cd9c] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 4px;
border-radius: var(--radius-sm);
justify-content: space-between;
align-items: center;
gap: 10px;
@@ -364,8 +364,8 @@
margin-bottom: 28px;
}
}
/* 视口条件 (width<=600px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=600px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.receipt[data-v-b3b3cd9c] {
gap: 35px;
padding: 28px 14px 35px;
@@ -416,7 +416,22 @@
}
}
/* 打印介质覆盖:独立处理纸张上的显隐和排版,不直接沿用屏幕布局。 */
.receipt-print-head[data-v-b3b3cd9c] {
display: none;
}
@page {
margin: 16mm 14mm;
}
@media print {
.receipt-page[data-v-b3b3cd9c] {
--p-text-color: #0f172a;
--p-text-muted-color: #64748b;
--p-content-border-color: #e2e8f0;
--p-content-background: #fff;
--p-content-hover-background: #f8fafc;
color: #0f172a;
print-color-adjust: exact;
}
.receipt-actions[data-v-b3b3cd9c],
.receipt-feedback[data-v-b3b3cd9c],
.receipt-nav[data-v-b3b3cd9c],
@@ -425,12 +440,55 @@
}
.receipt[data-v-b3b3cd9c] {
box-shadow: none;
background: #fff;
border: 0;
border-radius: 0;
gap: 28px;
padding: 0;
-moz-column-break-inside: avoid;
break-inside: avoid;
}
.receipt-print-head[data-v-b3b3cd9c] {
border-bottom: 2px solid #0f172a;
justify-content: space-between;
align-items: center;
gap: 16px;
padding-bottom: 12px;
display: flex;
}
.receipt-print-logo[data-v-b3b3cd9c] {
width: auto;
height: 38px;
display: block;
}
.receipt-print-meta[data-v-b3b3cd9c] {
text-align: right;
color: #64748b;
flex-direction: column;
gap: 2px;
font-size: 0.875rem;
line-height: 1.3;
display: flex;
}
.receipt-print-meta strong[data-v-b3b3cd9c] {
color: #0f172a;
font-size: 1.25rem;
font-weight: 600;
}
.receipt-header[data-v-b3b3cd9c] {
padding: 0;
}
.receipt-icon[data-v-b3b3cd9c] {
display: none;
}
.receipt-status[data-v-b3b3cd9c] {
color: #0f172a;
background: none;
border: 1px solid #cbd5e1;
}
.payment-page[data-v-b3b3cd9c],
.receipt-page[data-v-b3b3cd9c] {
max-width: 700px;
max-width: none;
}
.payment-page .receipt-layout[data-v-b3b3cd9c] {
grid-template-columns: minmax(0, 1fr);
+4 -3
View File
@@ -45,7 +45,8 @@
}
.page-head h2[data-v-8ca4eb3d] {
margin: 0;
font-size: 1.375rem;
font-size: var(--page-title-size);
font-weight: 600;
}
.level-badge[data-v-8ca4eb3d] {
font: inherit;
@@ -83,8 +84,8 @@
color: var(--p-text-color, #334155);
}
.tab.active[data-v-8ca4eb3d] {
color: var(--p-primary-color, #3b82f6);
border-bottom-color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
border-bottom-color: var(--p-primary-color);
font-weight: 500;
}
.panel[data-v-8ca4eb3d] {
+1 -1
View File
@@ -42,7 +42,7 @@ legend[data-v-146faed1] {
border: 1px solid var(--p-form-field-border-color);
color: var(--p-text-color);
border-right: 0;
border-radius: 6px;
border-radius: var(--radius-md);
align-items: center;
padding: 8px;
display: flex;
+7 -7
View File
@@ -121,7 +121,7 @@
}
.auth-card .seg {
background: var(--p-content-hover-background);
border-radius: 10px;
border-radius: var(--radius-lg);
gap: 4px;
padding: 4px;
display: flex;
@@ -132,7 +132,7 @@
cursor: pointer;
background: 0 0;
border: 1px solid #0000;
border-radius: 7px;
border-radius: var(--radius-md);
flex: 1;
padding: 8px;
font-size: 1em;
@@ -163,8 +163,8 @@
.auth-card .req {
color: var(--p-red-600, #dc2626);
}
/* 视口条件 (width<=760px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=760px) {
/* 视口条件 (width<=768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=768px) {
.auth-shell {
grid-template-columns: minmax(0, 1fr);
width: min(480px, 100%);
@@ -247,7 +247,7 @@
.auth-login[data-v-69ca9392] {
color: #fff;
background: var(--p-primary-color);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 7px 10.5px;
text-decoration: none;
}
@@ -258,8 +258,8 @@
padding: 28px 14px;
display: flex;
}
/* 视口条件 (width<=600px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=600px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.auth-logo img[data-v-69ca9392] {
width: 144px;
}
+8 -8
View File
@@ -17,8 +17,8 @@
}
.page-head h2[data-v-11d8a39a] {
margin: 0;
font-size: 1.25rem;
font-weight: 650;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 2rem;
}
.page-heading p[data-v-11d8a39a] {
@@ -36,7 +36,7 @@
.panel[data-v-11d8a39a] {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color);
border-radius: 8px;
border-radius: var(--radius-md);
min-width: 0;
padding: 20px;
}
@@ -142,7 +142,7 @@
}
.item-qty[data-v-11d8a39a] {
border: 1px solid var(--p-content-border-color);
border-radius: 4px;
border-radius: var(--radius-sm);
align-items: center;
gap: 0;
display: flex;
@@ -258,8 +258,8 @@
.empty-panel[data-v-11d8a39a] .p-button {
margin-top: 8px;
}
/* 视口条件 (width<=1023px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1023px) {
/* 视口条件 (width<1024px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1024px) {
.cart-layout[data-v-11d8a39a] {
grid-template-columns: 1fr;
}
@@ -267,8 +267,8 @@
position: static;
}
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.page[data-v-11d8a39a] {
gap: 18px;
}
+8 -7
View File
@@ -7,7 +7,8 @@
}
.page-head h2[data-v-710c7c49] {
margin: 10px 0 0;
font-size: 1.375rem;
font-size: var(--page-title-size);
font-weight: 600;
}
.back[data-v-710c7c49] {
color: var(--p-text-muted-color, #94a3b8);
@@ -23,7 +24,7 @@
.panel[data-v-710c7c49] {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
border-radius: 12px;
border-radius: var(--radius-lg);
max-width: 760px;
padding: 24px;
}
@@ -83,7 +84,7 @@
}
.files li[data-v-710c7c49] {
background: var(--p-content-hover-background);
border-radius: 6px;
border-radius: var(--radius-md);
align-items: center;
gap: 8px;
padding: 6px 10px;
@@ -132,8 +133,8 @@
.list-head h2[data-v-710c7c49],
.page-head h2[data-v-710c7c49] {
margin: 0;
font-size: 1.125rem;
font-weight: 700;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 24.5px;
}
.list-toolbar[data-v-710c7c49],
@@ -146,7 +147,7 @@
width: 280px;
}
.list-table[data-v-710c7c49] {
border-radius: 6px;
border-radius: var(--radius-md);
box-shadow: 0 1px 3px #0f172a12;
}
.list-foot[data-v-710c7c49] {
@@ -248,7 +249,7 @@
.upload-drop[data-v-710c7c49] {
border: 1px dashed var(--p-content-border-color);
cursor: pointer;
border-radius: 6px;
border-radius: var(--radius-md);
flex-direction: column;
justify-content: center;
align-items: center;
+2 -2
View File
@@ -36,8 +36,8 @@
.product-links a[data-v-5618b27d]:hover {
color: var(--p-primary-color);
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.dedicated-customize header[data-v-5618b27d] {
flex-wrap: wrap;
gap: 8px;
@@ -44,7 +44,7 @@ h2[data-v-e16eb167] {
.hardware-card[data-v-e16eb167] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 6px;
border-radius: var(--radius-md);
box-shadow: 0 1px 3px #0000001a;
}
.filter-panel[data-v-e16eb167] {
@@ -103,7 +103,7 @@ details[open] > summary > i[data-v-e16eb167] {
color: var(--p-text-color);
cursor: pointer;
background: 0 0;
border-radius: 4px;
border-radius: var(--radius-sm);
padding: 4px 7px;
font-size: 0.875rem;
}
@@ -170,7 +170,7 @@ details[open] > summary > i[data-v-e16eb167] {
}
.hardware-buy[data-v-e16eb167] {
background: var(--p-content-hover-background);
border-radius: 6px;
border-radius: var(--radius-md);
align-items: center;
gap: 10px;
padding: 4px;
@@ -215,7 +215,7 @@ details[open] > summary > i[data-v-e16eb167] {
text-align: center;
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 6px;
border-radius: var(--radius-md);
flex-direction: column;
align-items: center;
gap: 14px;
@@ -252,7 +252,7 @@ details[open] > summary > i[data-v-e16eb167] {
.line-panel[data-v-e16eb167] {
border: 1px solid var(--p-content-border-color);
background: var(--p-highlight-background);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 0 17px;
}
.line-card[data-v-e16eb167] {
@@ -329,8 +329,8 @@ summary[data-v-e16eb167]:focus-visible {
top: calc(var(--console-top-offset, 56px) + 20px);
}
}
/* 视口条件 (width<=1199px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1199px) {
/* 视口条件 (width<1200px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1200px) {
.catalog-layout[data-v-e16eb167] {
grid-template-columns: 240px minmax(0, 1fr);
}
@@ -355,8 +355,8 @@ summary[data-v-e16eb167]:focus-visible {
grid-row: 1 / span 2;
}
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.catalog-head[data-v-e16eb167] {
margin-bottom: 28px;
}
+39 -19
View File
@@ -73,7 +73,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 6px;
border-radius: var(--radius-md);
align-items: center;
gap: 10.5px;
padding: 8.75px 14px;
@@ -145,7 +145,7 @@
}
.nav[data-v-1a9c3b51] .sub-item {
color: inherit;
border-radius: 6px;
border-radius: var(--radius-md);
padding: 8.75px 14px 8.75px 35px;
text-decoration: none;
display: block;
@@ -157,6 +157,24 @@
margin-left: 210px;
display: flex;
}
@media print {
.console-layout[data-v-1a9c3b51] {
background: #fff;
min-height: 0;
padding-top: 0;
}
.topbar[data-v-1a9c3b51],
.sidebar[data-v-1a9c3b51],
.nav-backdrop[data-v-1a9c3b51],
.maintenance-banner[data-v-1a9c3b51],
.skip-link[data-v-1a9c3b51] {
display: none !important;
}
.main[data-v-1a9c3b51] {
min-height: 0;
margin-left: 0;
}
}
/* 顶栏与维护提示、主内容定位配合,避免固定元素遮挡可操作内容。 */
.topbar[data-v-1a9c3b51] {
z-index: 35;
@@ -193,13 +211,13 @@
-o-object-fit: contain;
object-fit: contain;
flex-shrink: 0;
width: 176px;
width: 148px;
height: auto;
max-height: 40px;
max-height: 32px;
display: block;
}
.brand-icon[data-v-1a9c3b51] {
color: #0052d9;
color: var(--p-primary-color);
flex-shrink: 0;
width: 35px;
height: 35px;
@@ -210,11 +228,11 @@
}
.crumbs[data-v-1a9c3b51] {
align-items: center;
gap: 12px;
gap: 10px;
min-width: 0;
height: 100%;
padding-left: 8px;
font-size: 1.125rem;
padding-left: 4px;
font-size: 1rem;
line-height: 1.4;
display: flex;
overflow: hidden;
@@ -228,22 +246,24 @@
display: inline-flex;
}
.crumb-home[data-v-1a9c3b51] {
width: 44px;
height: 44px;
width: 32px;
height: 32px;
border-radius: var(--radius-md);
color: var(--p-text-muted-color);
text-decoration: none;
}
.crumb-home > i[data-v-1a9c3b51] {
justify-content: center;
align-items: center;
width: 24px;
height: 24px;
font-size: 22px;
width: 18px;
height: 18px;
font-size: 17px;
line-height: 1;
display: inline-flex;
}
.crumb-sep[data-v-1a9c3b51] {
font-size: 14px;
opacity: 0.6;
font-size: 0.875rem;
}
.crumb[data-v-1a9c3b51],
.crumb-sep[data-v-1a9c3b51] {
@@ -429,7 +449,7 @@
z-index: 200;
background: var(--p-primary-color);
color: #fff;
border-radius: 6px;
border-radius: var(--radius-md);
padding: 12px 18px;
text-decoration: none;
position: fixed;
@@ -466,8 +486,8 @@
flex: none;
}
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.crumbs[data-v-1a9c3b51] {
display: none;
}
@@ -499,8 +519,8 @@
flex-basis: auto;
}
}
/* 视口条件 (width<=359px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=359px) {
/* 视口条件 (width<360px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<360px) {
.brand[data-v-1a9c3b51] {
gap: 5px;
padding: 0 4px 0 8px;
+4 -4
View File
@@ -25,7 +25,7 @@
font-size: 1rem;
}
.cert-link[data-v-0a28aca5] {
color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
text-decoration: none;
}
.list-page[data-v-0a28aca5] {
@@ -34,8 +34,8 @@
.list-head h2[data-v-0a28aca5],
.page-head h2[data-v-0a28aca5] {
margin: 0;
font-size: 1.125rem;
font-weight: 700;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 24.5px;
}
.list-toolbar[data-v-0a28aca5],
@@ -48,7 +48,7 @@
width: 280px;
}
.list-table[data-v-0a28aca5] {
border-radius: 6px;
border-radius: var(--radius-md);
box-shadow: 0 1px 3px #0f172a12;
}
.list-foot[data-v-0a28aca5] {
+188 -35
View File
@@ -1139,6 +1139,13 @@
--console-panel-bg: #fff;
--console-panel-border: #e2e8f0;
--console-panel-shadow: 0 1px 2px #0000001a, 0 1px 3px #0000001a;
--page-title-size: 1.25rem;
--font-mono:
ui-monospace, "Cascadia Mono", Consolas, "SF Mono", Menlo,
"HarmonyOS Sans SC", monospace;
--radius-sm: 4px;
--radius-md: 6px;
--radius-lg: 10px;
color: var(--p-text-color, #23324d);
background: var(--p-content-background, #fff);
font-synthesis: none;
@@ -1198,7 +1205,7 @@ textarea {
[tabindex]:focus-visible,
a:focus-visible,
button:focus-visible {
outline: 2px solid var(--p-primary-color, #0052d9);
outline: 2px solid var(--p-primary-color);
outline-offset: 3px;
}
img,
@@ -1223,6 +1230,13 @@ video {
white-space: nowrap;
flex-shrink: 0;
}
.p-tabs .p-tablist,
.p-tabs .p-tablist-tab-list,
.p-tabs .p-tab,
.p-tabs .p-tab:not(.p-disabled):hover,
.p-tabs .p-tabpanels {
background: transparent;
}
.p-datatable {
min-width: 0;
max-width: 100%;
@@ -1256,9 +1270,17 @@ video {
}
}
.app-dark {
--console-page-bg: #0f172a;
--console-panel-bg: #020617;
--console-panel-border: #334155;
--console-page-bg: #09090b;
--console-panel-bg: #18181b;
--console-panel-border: #3f3f46;
}
.app-dark img[src$="/images/brand/logo.png"] {
filter: brightness(2.5);
}
@media print {
.app-dark img[src$="/images/brand/logo.png"] {
filter: none;
}
}
.instance-product-status.p-tag-warn {
background: var(--p-yellow-100);
@@ -1351,7 +1373,7 @@ video {
text-align: left;
cursor: pointer;
overflow-wrap: anywhere;
border-radius: 5px;
border-radius: var(--radius-md);
flex-direction: column;
justify-content: center;
align-items: flex-start;
@@ -1377,6 +1399,13 @@ video {
.config-choice:hover {
border-color: var(--p-primary-color);
}
.config-choice.active:only-child {
outline: 0;
border-color: var(--p-content-border-color);
background: var(--p-content-hover-background);
color: var(--p-text-color);
cursor: default;
}
.config-choice:focus-visible,
.image-group:focus-visible {
outline: 2px solid var(--p-primary-color);
@@ -1410,7 +1439,7 @@ video {
border-radius: 0 5px 5px 0;
}
.compact .config-choice:only-child {
border-radius: 5px;
border-radius: var(--radius-md);
}
.compact .config-choice.active {
z-index: 1;
@@ -1433,7 +1462,7 @@ video {
color: var(--p-text-color);
text-align: left;
cursor: pointer;
border-radius: 5px;
border-radius: var(--radius-md);
align-items: center;
gap: 14px;
padding: 14px;
@@ -1468,7 +1497,7 @@ video {
.config-page .config-checkout {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color);
border-radius: 5px;
border-radius: var(--radius-md);
min-width: 0;
max-width: 100%;
padding: 16px 14px;
@@ -1578,7 +1607,7 @@ video {
.config-page .quote-status {
background: var(--p-content-hover-background);
color: var(--p-text-muted-color);
border-radius: 4px;
border-radius: var(--radius-sm);
flex-direction: column;
align-items: flex-start;
gap: 10px;
@@ -1606,7 +1635,7 @@ video {
.config-page .cart-confirmation {
background: var(--p-content-hover-background);
color: var(--p-text-color);
border-radius: 5px;
border-radius: var(--radius-md);
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
@@ -1670,7 +1699,7 @@ video {
.product-order-page > .config-loading {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 5px;
border-radius: var(--radius-md);
width: 100%;
padding: 24px;
}
@@ -1693,15 +1722,15 @@ video {
top: calc(var(--console-top-offset, 56px) + 20px);
}
}
/* 视口条件 (width<=1199px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1199px) {
/* 视口条件 (width<1200px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1200px) {
.config-choices,
.config-page .image-groups {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
/* 视口条件 (width<=1023px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1023px) {
/* 视口条件 (width<1024px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1024px) {
.config-layout {
grid-template-columns: minmax(0, 1fr);
gap: 32px;
@@ -1771,8 +1800,8 @@ video {
flex-shrink: 0;
}
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.config-choices,
.config-page .image-groups {
grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -1847,7 +1876,7 @@ video {
.list-head h2 {
color: var(--p-text-color);
margin: 0;
font-size: 1rem;
font-size: var(--page-title-size);
font-weight: 600;
}
.list-head-actions {
@@ -1878,7 +1907,7 @@ video {
var(--p-content-hover-background) 60%,
transparent
);
border-radius: 4px;
border-radius: var(--radius-sm);
align-items: center;
gap: 2px;
max-width: 100%;
@@ -1893,7 +1922,7 @@ video {
cursor: pointer;
background: 0 0;
border: 1px solid #0000;
border-radius: 4px;
border-radius: var(--radius-sm);
padding: 4px 10px;
font-size: 1rem;
line-height: 1.5;
@@ -1920,7 +1949,7 @@ video {
.list-table {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color);
border-radius: 5px;
border-radius: var(--radius-md);
min-width: 0;
max-width: 100%;
overflow: hidden;
@@ -2120,7 +2149,7 @@ video {
color: var(--p-text-color);
white-space: nowrap;
background: 0 0;
border-radius: 4px;
border-radius: var(--radius-sm);
align-items: center;
gap: 7px;
padding: 7px 12px;
@@ -2219,21 +2248,21 @@ video {
.home-expiring,
.home-tickets {
grid-column: span 1;
min-height: 442px;
min-height: 360px;
}
.home-servers {
grid-column: span 2;
min-height: 442px;
min-height: 360px;
}
.home-notices,
.home-referral {
grid-column: span 2;
min-height: 316px;
min-height: 272px;
}
.home-card {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
border-radius: 5px;
border-radius: var(--radius-md);
flex-direction: column;
min-width: 0;
display: flex;
@@ -2291,7 +2320,7 @@ video {
background: var(--p-primary-color);
min-height: 36px;
color: var(--p-primary-contrast-color, #fff);
border-radius: 4px;
border-radius: var(--radius-sm);
justify-content: center;
align-items: center;
gap: 6px;
@@ -2383,13 +2412,18 @@ button.home-row:hover {
font-size: 1.125rem;
font-weight: 600;
}
.home-card .list-empty {
flex: 1;
justify-content: center;
padding: 32px 20px;
}
.home-page a:focus-visible,
.home-page button:focus-visible {
outline: 2px solid var(--p-primary-color);
outline-offset: 2px;
}
/* 视口条件 (width<=1023px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1023px) {
/* 视口条件 (width<1024px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1024px) {
.home-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
@@ -2409,8 +2443,8 @@ button.home-row:hover {
grid-column: span 1;
}
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.home-grid {
flex-direction: column;
gap: 21px;
@@ -2420,15 +2454,134 @@ button.home-row:hover {
min-height: 0;
}
.home-wallet {
min-height: 214px;
min-height: 180px;
}
.home-expiring,
.home-servers,
.home-tickets {
min-height: 330px;
min-height: 240px;
}
.home-expiring {
min-height: 0;
}
.home-notices,
.home-referral {
min-height: 280px;
min-height: 200px;
}
}
@media (width<640px) {
.list-toolbar-right {
grid-template-columns: repeat(2, minmax(0, 1fr));
grid-auto-flow: row dense;
gap: 8px;
display: grid;
}
.list-toolbar-right > .list-search,
.list-toolbar-right > .p-iconfield,
.list-toolbar-right > form {
order: -1;
grid-column: 1 / -1;
}
.list-toolbar-right > .p-button-text {
justify-self: start;
}
.p-datatable:not(.no-stack) .p-datatable-table-container {
overflow: visible;
}
.p-datatable:not(.no-stack) .p-datatable-table,
.p-datatable:not(.no-stack) .p-datatable-tbody {
width: 100%;
min-width: 0 !important;
display: block;
}
.list-table:has(.p-datatable:not(.no-stack)) {
overflow-x: visible;
}
.p-datatable:not(.no-stack) .p-datatable-thead {
display: none;
}
.p-datatable:not(.no-stack) .p-datatable-tbody > tr {
border-bottom: 1px solid var(--p-content-border-color);
padding: 10px 14px;
display: block;
position: relative;
}
.p-datatable:not(.no-stack) .p-datatable-tbody > tr:last-child {
border-bottom: 0;
}
.p-datatable:not(.no-stack) .p-datatable-tbody > tr > td {
text-align: right;
overflow-wrap: anywhere;
white-space: normal !important;
border: 0 !important;
justify-content: space-between;
align-items: center;
gap: 16px;
width: auto !important;
min-width: 0 !important;
padding: 5px 0 !important;
display: flex;
}
.p-datatable:not(.no-stack) .p-datatable-tbody > tr > td::before {
content: attr(data-label);
color: var(--p-text-muted-color);
text-align: left;
white-space: nowrap;
flex-shrink: 0;
font-size: 0.875rem;
}
.p-datatable:not(.no-stack)
.p-datatable-tbody
> tr
> td[data-label=""]::before,
.p-datatable:not(.no-stack)
.p-datatable-tbody
> tr
> td:not([data-label])::before {
display: none;
}
.p-datatable:not(.no-stack) .p-datatable-tbody > tr > td[data-label=""] {
justify-content: flex-end;
}
.p-datatable:not(.no-stack)
.p-datatable-tbody
> tr
> td:first-child:has(> .p-checkbox) {
padding: 0 !important;
position: absolute;
top: 13px;
right: 14px;
}
.p-datatable:not(.no-stack)
.p-datatable-tbody
> tr:has(> td:first-child > .p-checkbox)
> td:nth-child(2) {
padding-right: 32px !important;
}
.p-datatable:not(.no-stack) .p-datatable-tbody > tr > td > * {
min-width: 0;
max-width: 100%;
}
.p-datatable:not(.no-stack) .p-datatable-tbody > tr > td > div {
flex-wrap: wrap;
justify-content: flex-end;
}
.p-datatable:not(.no-stack) .p-datatable-empty-message > td {
text-align: center;
padding: 0 !important;
display: block;
}
.table-scroll-hint {
display: none !important;
}
}
@media (width<640px) {
.list-toolbar:not(:has(> .list-toolbar-right)) {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px;
display: grid;
}
.list-toolbar:not(:has(> .list-toolbar-right)) > .list-search {
grid-column: 1 / -1;
width: 100%;
}
}
+66 -17
View File
@@ -16,7 +16,8 @@
}
.page-head h2[data-v-18fe1f08] {
margin: 0 0 6px;
font-size: 1.375rem;
font-size: var(--page-title-size);
font-weight: 600;
}
.page-head p[data-v-18fe1f08] {
color: var(--p-text-muted-color, #94a3b8);
@@ -31,7 +32,7 @@
.summary-card[data-v-18fe1f08] {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
border-radius: 12px;
border-radius: var(--radius-lg);
flex-direction: column;
gap: 8px;
padding: 18px;
@@ -67,7 +68,7 @@
.panel[data-v-18fe1f08] {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
border-radius: 12px;
border-radius: var(--radius-lg);
padding: 8px 20px 20px;
}
.credit-summary[data-v-18fe1f08] {
@@ -76,7 +77,7 @@
font-size: 0.9375rem;
}
.link[data-v-18fe1f08] {
color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
font-weight: 500;
text-decoration: none;
}
@@ -100,35 +101,53 @@
.wallet-card[data-v-18fe1f08] {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color);
border-radius: 7px;
justify-content: space-between;
border-radius: var(--radius-md);
justify-content: flex-start;
align-items: center;
gap: 21px;
min-height: 91px;
padding: 14px;
gap: 0;
min-height: 96px;
padding: 20px 24px;
display: flex;
box-shadow: 0 1px 2px #00000014;
}
.wallet-card > div[data-v-18fe1f08]:first-child {
padding-right: 36px;
}
.wallet-stat[data-v-18fe1f08],
.wallet-pending-refund[data-v-18fe1f08] {
border-left: 1px solid var(--p-content-border-color);
padding: 2px 36px;
}
.wallet-stat-value[data-v-18fe1f08] {
font-variant-numeric: tabular-nums;
font-size: 1.125rem;
font-weight: 600;
line-height: 1.6;
}
.summary-label[data-v-18fe1f08] {
color: var(--p-text-muted-color);
margin-bottom: 10px;
font-size: 1rem;
margin-bottom: 6px;
font-size: 0.9375rem;
}
.summary-value[data-v-18fe1f08] {
font-variant-numeric: tabular-nums;
font-size: 1.75rem;
font-weight: 400;
font-weight: 600;
line-height: 1.2;
}
.summary-value small[data-v-18fe1f08] {
font-size: 1.5rem;
}
.wallet-pending-refund[data-v-18fe1f08] {
min-width: 130px;
}
.pending-refund-value[data-v-18fe1f08] {
color: var(--p-orange-600, #ea580c);
font-variant-numeric: tabular-nums;
font-size: 1.125rem;
font-weight: 600;
line-height: 1.6;
}
.summary-actions[data-v-18fe1f08] {
align-items: center;
margin-left: auto;
}
.reminder-panel[data-v-18fe1f08] {
flex-wrap: wrap;
@@ -163,6 +182,10 @@
width: 150px;
min-width: 0;
}
.reminder-form[data-v-18fe1f08] .p-inputnumber-input {
width: 100%;
min-width: 0;
}
.reminder-form[data-v-18fe1f08] .p-button,
.reminder-form[data-v-18fe1f08] > :first-child,
.reminder-form > label[data-v-18fe1f08] {
@@ -184,7 +207,13 @@
}
.wallet-tabs[data-v-18fe1f08] .p-tabpanels {
background: 0 0;
padding: 0;
padding: 24px 0 0;
}
.wallet-tabs[data-v-18fe1f08] .list-head h2 {
display: none;
}
.wallet-tabs[data-v-18fe1f08] .list-head:not(:has(.list-head-actions)) {
display: none;
}
.wallet-tabs[data-v-18fe1f08] .p-tablist-tab-list {
background: 0 0;
@@ -218,7 +247,7 @@
}
.wallet-tabs[data-v-18fe1f08] .p-datatable-table-container {
border: 1px solid var(--p-content-border-color);
border-radius: 6px;
border-radius: var(--radius-md);
box-shadow: 0 2px 3px #0000000f;
}
.wallet-tabs[data-v-18fe1f08] .p-datatable-table {
@@ -252,9 +281,29 @@
margin-top: 21px;
}
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=900px) {
.wallet-card[data-v-18fe1f08] {
flex-wrap: wrap;
row-gap: 16px;
}
.summary-actions[data-v-18fe1f08] {
justify-content: flex-end;
width: 100%;
}
}
@media (width<=640px) {
.wallet-card[data-v-18fe1f08] {
flex-wrap: wrap;
padding: 16px;
}
.wallet-card > div[data-v-18fe1f08]:first-child {
flex-basis: 100%;
padding-right: 0;
}
.wallet-stat[data-v-18fe1f08],
.wallet-pending-refund[data-v-18fe1f08] {
border-left: 0;
padding: 0 24px 0 0;
}
.reminder-copy[data-v-18fe1f08] {
flex: 100%;
+9 -9
View File
@@ -26,7 +26,7 @@
}
.dlg-tabs[data-v-fe145bae] {
background: var(--p-content-hover-background);
border-radius: 8px;
border-radius: var(--radius-md);
align-self: flex-start;
gap: 4px;
padding: 3px;
@@ -37,7 +37,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 6px;
border-radius: var(--radius-md);
padding: 6px 18px;
font-size: 0.9375rem;
}
@@ -59,7 +59,7 @@
}
.batch-hint code[data-v-fe145bae] {
background: var(--p-content-hover-background);
border-radius: 4px;
border-radius: var(--radius-sm);
padding: 1px 5px;
font-size: 0.875rem;
}
@@ -71,7 +71,7 @@
}
.rule-add[data-v-fe145bae] {
border: 1px dashed var(--p-content-border-color, #e2e8f0);
border-radius: 10px;
border-radius: var(--radius-lg);
padding: 12px;
}
.rule-form[data-v-fe145bae] {
@@ -99,7 +99,7 @@
min-width: 140px;
}
.mono[data-v-fe145bae] {
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
font-family: var(--font-mono);
font-size: 0.875rem;
}
.empty-rule[data-v-fe145bae] {
@@ -114,8 +114,8 @@
.list-head h2[data-v-fe145bae],
.page-head h2[data-v-fe145bae] {
margin: 0;
font-size: 1.125rem;
font-weight: 700;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 24.5px;
}
.list-toolbar[data-v-fe145bae],
@@ -128,7 +128,7 @@
width: 280px;
}
.list-table[data-v-fe145bae] {
border-radius: 6px;
border-radius: var(--radius-md);
box-shadow: 0 1px 3px #0f172a12;
}
.list-foot[data-v-fe145bae] {
@@ -277,7 +277,7 @@
.group-detail[data-v-fe145bae] .p-datatable {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 6px;
border-radius: var(--radius-md);
}
/* 视口条件 (width<=768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=768px) {
+5 -5
View File
@@ -14,8 +14,8 @@
}
.page-heading h2[data-v-2e1fbf8d] {
margin: 0;
font-size: 1.25rem;
font-weight: 650;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 2rem;
}
.page-heading p[data-v-2e1fbf8d] {
@@ -33,7 +33,7 @@
.help-nav[data-v-2e1fbf8d] {
background: var(--console-panel-bg);
border: 1px solid var(--console-panel-border);
border-radius: 8px;
border-radius: var(--radius-md);
min-width: 0;
}
/* 滚动时保持此区域可见;定位偏移需与页面固定顶栏及父级滚动容器一起核对。 */
@@ -98,7 +98,7 @@
cursor: pointer;
background: 0 0;
border: 0;
border-radius: 5px;
border-radius: var(--radius-md);
align-items: flex-start;
gap: 10px;
padding: 10px;
@@ -198,7 +198,7 @@
}
.content-html[data-v-2e1fbf8d] pre {
background: var(--p-content-hover-background);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 16px;
overflow-x: auto;
}
+3 -3
View File
@@ -39,7 +39,7 @@
}
.order-list[data-v-86fc6dc2] {
border: 1px solid var(--p-content-border-color, #e2e8f0);
border-radius: 10px;
border-radius: var(--radius-lg);
flex-direction: column;
max-height: 220px;
display: flex;
@@ -87,7 +87,7 @@
text-align: center;
color: var(--p-text-muted-color, #94a3b8);
border: 1px dashed var(--p-content-border-color, #e2e8f0);
border-radius: 10px;
border-radius: var(--radius-lg);
padding: 20px;
font-size: 0.9375rem;
}
@@ -106,7 +106,7 @@
font-size: 0.9375rem;
}
.field-tip[data-v-86fc6dc2] {
color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
font-size: 0.875rem;
text-decoration: none;
}
+67 -3
View File
@@ -6,8 +6,8 @@
.list-head h2[data-v-0e32233b],
.page-head h2[data-v-0e32233b] {
margin: 0;
font-size: 1.125rem;
font-weight: 700;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 24.5px;
}
.list-toolbar[data-v-0e32233b],
@@ -20,7 +20,7 @@
width: 280px;
}
.list-table[data-v-0e32233b] {
border-radius: 6px;
border-radius: var(--radius-md);
box-shadow: 0 1px 3px #0f172a12;
}
.list-foot[data-v-0e32233b] {
@@ -72,3 +72,67 @@
width: 100%;
}
}
@media (width<640px) {
.list-table[data-v-0e32233b]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message) {
grid-template-columns: auto auto minmax(0, 1fr) auto;
grid-template-areas: "content content content content" "time ip . id";
align-items: center;
gap: 6px 10px;
padding: 14px 16px;
display: grid;
}
.list-table[data-v-0e32233b]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td {
text-align: left;
justify-content: flex-start;
gap: 4px;
padding: 0 !important;
font-size: 0.875rem;
display: none;
position: static;
}
.list-table[data-v-0e32233b]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td::before {
display: none;
}
.list-table[data-v-0e32233b]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="操作内容"] {
grid-area: content;
display: flex;
color: var(--p-text-color);
font-size: 0.9375rem;
}
.list-table[data-v-0e32233b]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="创建时间"] {
grid-area: time;
display: flex;
color: var(--p-text-muted-color);
}
.list-table[data-v-0e32233b]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="IP"] {
grid-area: ip;
display: flex;
color: var(--p-text-muted-color);
}
.list-table[data-v-0e32233b]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="ID"] {
grid-area: id;
display: flex;
color: var(--p-text-muted-color);
justify-content: flex-end;
}
}
+3 -3
View File
@@ -5,8 +5,8 @@
}
.page-heading h2[data-v-e9dbafec] {
margin: 0;
font-size: 1.25rem;
font-weight: 650;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 2rem;
}
.page-heading p[data-v-e9dbafec] {
@@ -17,7 +17,7 @@
.message-panel[data-v-e9dbafec] {
border: 1px solid var(--console-panel-border);
background: var(--console-panel-bg);
border-radius: 8px;
border-radius: var(--radius-md);
min-width: 0;
overflow: hidden;
}
+7 -7
View File
@@ -10,7 +10,7 @@
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
cursor: pointer;
border-radius: 10px;
border-radius: var(--radius-lg);
gap: 14px;
width: 100%;
padding: 16px 18px;
@@ -18,12 +18,12 @@
display: flex;
}
.news-card[data-v-0f61b69d]:hover {
border-color: var(--p-primary-color, #0052d9);
border-color: var(--p-primary-color);
}
.news-img[data-v-0f61b69d] {
-o-object-fit: cover;
object-fit: cover;
border-radius: 8px;
border-radius: var(--radius-md);
flex-shrink: 0;
width: 120px;
height: 76px;
@@ -100,8 +100,8 @@
.list-head h2[data-v-0f61b69d],
.page-head h2[data-v-0f61b69d] {
margin: 0;
font-size: 1.125rem;
font-weight: 700;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 24.5px;
}
.list-toolbar[data-v-0f61b69d],
@@ -114,7 +114,7 @@
width: 280px;
}
.list-table[data-v-0f61b69d] {
border-radius: 6px;
border-radius: var(--radius-md);
box-shadow: 0 1px 3px #0f172a12;
}
.list-foot[data-v-0f61b69d] {
@@ -167,7 +167,7 @@
}
}
.news-card[data-v-0f61b69d] {
border-radius: 6px;
border-radius: var(--radius-md);
padding: 14px;
box-shadow: 0 1px 3px #0f172a0a;
}
+4 -4
View File
@@ -51,8 +51,8 @@
.list-head h2[data-v-4ba0157b],
.page-head h2[data-v-4ba0157b] {
margin: 0;
font-size: 1.125rem;
font-weight: 700;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 24.5px;
}
.list-toolbar[data-v-4ba0157b],
@@ -65,7 +65,7 @@
width: 280px;
}
.list-table[data-v-4ba0157b] {
border-radius: 6px;
border-radius: var(--radius-md);
box-shadow: 0 1px 3px #0f172a12;
}
.list-foot[data-v-4ba0157b] {
@@ -144,7 +144,7 @@
.notice-item[data-v-4ba0157b] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 14px;
box-shadow: 0 1px 3px #0f172a0a;
}
+45 -45
View File
@@ -4,7 +4,7 @@
min-height: 100vh;
color: var(--p-text-color, #334155);
background: var(--console-page-bg, #f8fafc);
--official-primary: var(--p-primary-color, #0052d9);
--official-primary: var(--p-primary-color);
--official-accent: #eff6ff;
}
.official-site a {
@@ -45,7 +45,7 @@
var(--official-primary) 11%,
var(--p-content-background)
);
border-radius: 5px;
border-radius: var(--radius-md);
justify-content: center;
align-items: flex-end;
gap: 2px;
@@ -108,7 +108,7 @@
.official-mobile-nav a,
.official-nav a {
color: var(--p-text-muted-color);
font-size: 0.92rem;
font-size: 0.9375rem;
transition: color 0.18s;
}
.official-mobile-nav a:hover,
@@ -125,11 +125,11 @@
background: var(--p-content-background);
color: var(--p-text-color);
white-space: nowrap;
border-radius: 4px;
border-radius: var(--radius-sm);
align-items: center;
gap: 7px;
padding: 9px 13px;
font-size: 0.88rem;
font-size: 0.875rem;
transition:
border-color 0.18s,
color 0.18s;
@@ -137,7 +137,7 @@
}
.official-header-login i {
color: var(--official-primary);
font-size: 0.78rem;
font-size: 0.8125rem;
}
.official-header-login:hover {
border-color: var(--official-primary);
@@ -150,7 +150,7 @@
height: 38px;
color: var(--p-text-color);
cursor: pointer;
border-radius: 4px;
border-radius: var(--radius-sm);
display: none;
}
.official-mobile-nav {
@@ -234,12 +234,12 @@
color: var(--p-text-color);
align-items: center;
gap: 7px;
font-size: 0.88rem;
font-size: 0.875rem;
display: inline-flex;
}
.official-hero-features i {
color: var(--official-primary);
font-size: 0.82rem;
font-size: 0.8125rem;
}
.official-contact-actions,
.official-hero-actions {
@@ -250,7 +250,7 @@
}
.official-button {
border: 1px solid #0000;
border-radius: 4px;
border-radius: var(--radius-sm);
justify-content: center;
align-items: center;
gap: 9px;
@@ -292,7 +292,7 @@
color: var(--official-primary);
}
.official-button i {
font-size: 0.8rem;
font-size: 0.8125rem;
}
/* 首屏装饰性网络图由CSS元素组成,与真实资源监控数据无关。 */
.official-hero-visual {
@@ -308,7 +308,7 @@
);
min-height: 315px;
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
position: relative;
overflow: hidden;
}
@@ -426,7 +426,7 @@
}
.official-stat-kicker {
color: var(--p-text-muted-color);
font-size: 0.82rem;
font-size: 0.8125rem;
}
.official-stat-value {
color: var(--p-text-color);
@@ -453,7 +453,7 @@
.official-hero-stat p {
color: var(--p-text-muted-color);
margin: 6px 0 0;
font-size: 0.82rem;
font-size: 0.8125rem;
line-height: 1.55;
}
.official-floating-label {
@@ -461,7 +461,7 @@
background: var(--p-content-background);
color: var(--p-text-color);
box-shadow: var(--console-panel-shadow);
border-radius: 4px;
border-radius: var(--radius-sm);
align-items: center;
gap: 8px;
padding: 9px 12px;
@@ -473,7 +473,7 @@
}
.official-floating-label i {
color: var(--official-primary);
font-size: 0.82rem;
font-size: 0.8125rem;
}
.official-section {
margin-top: 52px;
@@ -516,16 +516,16 @@
background: var(--p-content-background);
color: var(--p-text-muted-color);
white-space: nowrap;
border-radius: 4px;
border-radius: var(--radius-sm);
align-items: center;
gap: 6px;
padding: 6px 9px;
font-size: 0.8rem;
font-size: 0.8125rem;
display: inline-flex;
}
.official-section-badges i {
color: var(--official-primary);
font-size: 0.72rem;
font-size: 0.75rem;
}
/* 官网产品卡片网格,不改变商品接口或库存判定。 */
.official-product-grid {
@@ -562,7 +562,7 @@
width: 38px;
height: 38px;
color: var(--official-primary);
border-radius: 4px;
border-radius: var(--radius-sm);
place-items: center;
font-size: 1.2rem;
display: grid;
@@ -584,13 +584,13 @@
color: var(--p-text-muted-color);
letter-spacing: 0.08em;
margin-top: 3px;
font-size: 0.72rem;
font-size: 0.75rem;
display: block;
}
.official-product-title-row > i {
color: var(--p-text-muted-color);
margin-top: 3px;
font-size: 0.88rem;
font-size: 0.875rem;
}
.official-product-description {
min-height: 42px;
@@ -626,17 +626,17 @@
justify-content: space-between;
align-items: center;
gap: 12px;
font-size: 0.83rem;
font-size: 0.8125rem;
display: flex;
}
.official-product-features i {
color: var(--official-primary);
font-size: 0.72rem;
font-size: 0.75rem;
}
.official-product-link {
align-items: center;
gap: 7px;
font-size: 0.88rem;
font-size: 0.875rem;
font-weight: 600;
display: inline-flex;
color: var(--official-primary) !important;
@@ -685,7 +685,7 @@
}
.official-infra-stats dt {
color: var(--p-text-muted-color);
font-size: 0.8rem;
font-size: 0.8125rem;
}
.official-infra-stats dd {
color: var(--p-text-color);
@@ -696,7 +696,7 @@
.official-infra-stats dd small {
color: var(--p-text-muted-color);
margin-left: 4px;
font-size: 0.78rem;
font-size: 0.8125rem;
font-weight: 400;
}
.official-infra-visual {
@@ -707,7 +707,7 @@
color-mix(in srgb, var(--official-accent) 70%, var(--p-content-background)),
var(--p-content-background)
);
border-radius: 5px;
border-radius: var(--radius-md);
min-height: 285px;
position: relative;
overflow: hidden;
@@ -772,7 +772,7 @@
.official-infra-card-kicker {
color: var(--official-primary);
letter-spacing: 0.09em;
font-size: 0.72rem;
font-size: 0.75rem;
font-weight: 600;
display: block;
}
@@ -785,7 +785,7 @@
.official-infra-card > p {
color: var(--p-text-muted-color);
margin: 4px 0 14px;
font-size: 0.78rem;
font-size: 0.8125rem;
}
.official-resource-row {
color: var(--p-text-muted-color);
@@ -802,7 +802,7 @@
var(--official-primary) 10%,
var(--console-panel-border)
);
border-radius: 5px;
border-radius: var(--radius-md);
height: 5px;
overflow: hidden;
}
@@ -840,7 +840,7 @@
min-height: 52px;
color: var(--p-text-color);
margin: 10px 0 18px;
font-size: 0.92rem;
font-size: 0.9375rem;
line-height: 1.65;
}
.official-review-person {
@@ -873,7 +873,7 @@
}
.official-review-person strong {
color: var(--p-text-color);
font-size: 0.83rem;
font-size: 0.8125rem;
font-weight: 600;
}
.official-review-person small {
@@ -915,7 +915,7 @@
max-width: 300px;
color: var(--p-text-muted-color);
margin: 15px 0 0;
font-size: 0.83rem;
font-size: 0.8125rem;
line-height: 1.65;
}
.official-footer-groups {
@@ -934,7 +934,7 @@
.official-footer-group h2 {
color: var(--p-text-color);
margin: 2px 0 4px;
font-size: 0.88rem;
font-size: 0.875rem;
font-weight: 600;
}
.official-footer-contact a,
@@ -942,7 +942,7 @@
.official-footer-group a {
color: var(--p-text-muted-color);
margin: 0;
font-size: 0.82rem;
font-size: 0.8125rem;
line-height: 1.5;
}
.official-footer-contact a:hover,
@@ -958,20 +958,20 @@
.official-footer-contact i {
color: var(--official-primary);
margin-top: 2px;
font-size: 0.78rem;
font-size: 0.8125rem;
}
.official-footer-qr {
color: var(--p-text-muted-color);
align-items: center;
gap: 10px;
font-size: 0.76rem;
font-size: 0.75rem;
display: flex;
}
.official-footer-qr img {
border: 1px solid var(--console-panel-border);
-o-object-fit: contain;
object-fit: contain;
border-radius: 4px;
border-radius: var(--radius-sm);
width: 56px;
height: 56px;
}
@@ -984,7 +984,7 @@
align-items: center;
gap: 12px;
margin: 0 auto;
font-size: 0.76rem;
font-size: 0.75rem;
display: flex;
}
.official-footer-bottom > div {
@@ -1032,8 +1032,8 @@
grid-column: 2;
}
}
/* 视口条件 (width<=680px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=680px) {
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.official-footer-bottom,
.official-footer-main,
.official-header-inner,
@@ -1049,7 +1049,7 @@
}
.official-header-login {
padding: 8px 9px;
font-size: 0.8rem;
font-size: 0.8125rem;
}
.official-menu-toggle {
place-items: center;
@@ -1080,7 +1080,7 @@
}
.official-hero-intro > p {
margin-bottom: 13px;
font-size: 0.92rem;
font-size: 0.9375rem;
}
.official-hero-features {
margin-bottom: 16px;
@@ -1101,7 +1101,7 @@
}
.official-floating-label {
max-width: 48%;
font-size: 0.76rem;
font-size: 0.75rem;
bottom: 17px;
left: 12px;
}
+140 -1
View File
@@ -6,7 +6,7 @@
font-size: 0.9375rem;
}
.order-link[data-v-d87be2e3] {
color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
font-weight: 500;
text-decoration: none;
}
@@ -56,6 +56,22 @@
.list-foot[data-v-d87be2e3] {
justify-content: center;
}
.list-table[data-v-d87be2e3] .amount-cell {
text-align: right;
font-variant-numeric: tabular-nums;
font-weight: 500;
}
.list-table[data-v-d87be2e3]
.amount-heading
.p-datatable-column-header-content {
justify-content: flex-end;
}
.list-table[data-v-d87be2e3] .action-cell {
text-align: right;
}
.list-table[data-v-d87be2e3] .action-cell a {
text-decoration: none;
}
/* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=640px) {
.list-toolbar-right > .p-iconfield[data-v-d87be2e3] {
@@ -65,3 +81,126 @@
width: 100%;
}
}
@media (width<640px) {
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message) {
grid-template-columns: 22px auto auto minmax(0, 1fr) auto;
grid-template-areas: "check title title title price" "check type id time status" "check pay pay pay pay";
align-items: center;
gap: 6px 10px;
padding: 14px 16px;
display: grid;
cursor: pointer;
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td {
text-align: left;
justify-content: flex-start;
gap: 4px;
padding: 0 !important;
font-size: 0.875rem;
display: none;
position: static;
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td::before {
display: none;
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td:first-child {
grid-area: check;
display: flex;
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="商品"] {
grid-area: title;
display: flex;
color: var(--p-text-color);
font-size: 1rem;
font-weight: 600;
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="总价"] {
grid-area: price;
display: flex;
color: var(--p-text-color);
font-size: 1rem;
font-weight: 600;
justify-content: flex-end;
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="类型"] {
grid-area: type;
display: flex;
color: var(--p-text-muted-color);
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="ID"] {
grid-area: id;
display: flex;
color: var(--p-text-muted-color);
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="下单时间"] {
grid-area: time;
display: flex;
color: var(--p-text-muted-color);
white-space: nowrap !important;
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="状态"] {
grid-area: status;
display: flex;
justify-content: flex-end;
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="支付方式"] {
grid-area: pay;
display: flex;
color: var(--p-text-muted-color);
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td:last-child {
display: none;
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="支付方式"]::before {
content: "支付方式 ";
color: var(--p-text-muted-color);
font-size: 0.875rem;
display: inline;
}
.list-table[data-v-d87be2e3]
.p-datatable-tbody
> tr:not(.p-datatable-empty-message)
> td[data-label="ID"]
.order-link {
color: var(--p-text-muted-color);
font-weight: 400;
}
}
+66 -13
View File
@@ -5,7 +5,7 @@
--welcome-tile-bg: #fff;
background: #f7faff;
border-color: #cbdcf0;
border-radius: 6px;
border-radius: var(--radius-md);
position: relative;
}
.welcome-head[data-v-b43b228e] {
@@ -100,7 +100,7 @@
min-width: 38px;
min-height: 38px;
color: var(--p-text-muted-color);
border-radius: 5px;
border-radius: var(--radius-md);
transition:
border-color 0.2s,
color 0.2s;
@@ -135,7 +135,7 @@
letter-spacing: inherit;
vertical-align: baseline;
cursor: pointer;
border-radius: 4px;
border-radius: var(--radius-sm);
align-items: center;
gap: 8px;
margin-left: 6px;
@@ -194,13 +194,21 @@
font-size: 0.9375rem;
}
.app-dark .welcome-card[data-v-b43b228e] {
--welcome-line: #263b56;
--welcome-tile-bg: #101e31;
background: #12233b;
border-color: #304766;
--welcome-line: var(--p-content-border-color);
--welcome-tile-bg: var(--p-content-background);
background: color-mix(
in srgb,
var(--p-primary-color) 7%,
var(--p-content-background)
);
border-color: color-mix(
in srgb,
var(--p-primary-color) 22%,
var(--p-content-border-color)
);
}
/* 视口条件 (width<=1023px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1023px) {
/* 视口条件 (width<1024px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1024px) {
.tiles[data-v-b43b228e] {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
@@ -211,8 +219,8 @@
border-top: 1px solid var(--welcome-line);
}
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.welcome-head[data-v-b43b228e] {
align-items: flex-start;
gap: 12px;
@@ -236,8 +244,8 @@
gap: 5px;
}
}
/* 视口条件 (width<=639px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=639px) {
/* 视口条件 (width<640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<640px) {
.welcome-title[data-v-b43b228e] {
font-size: 1.5rem;
}
@@ -269,3 +277,48 @@
font-size: 1rem;
}
}
@media (width<640px) {
.welcome-head[data-v-b43b228e] {
gap: 8px;
min-height: 0;
padding: 16px;
}
.welcome-heading[data-v-b43b228e] {
min-height: 0;
}
.welcome-title[data-v-b43b228e] {
font-size: 1.25rem;
}
.welcome-message[data-v-b43b228e] {
min-height: 0;
font-size: 0.9375rem;
}
.welcome-meta[data-v-b43b228e] {
flex-flow: wrap;
gap: 4px 14px;
font-size: 0.875rem;
}
.welcome-icon[data-v-b43b228e] {
flex-basis: 24px;
}
.welcome-icon[data-v-b43b228e],
.welcome-icon .iconify[data-v-b43b228e] {
width: 24px;
height: 24px;
}
.welcome-settings[data-v-b43b228e] {
top: 12px;
right: 12px;
}
.tile[data-v-b43b228e] {
min-height: 0;
padding: 12px 16px;
}
.tile-label[data-v-b43b228e] {
font-size: 0.875rem;
}
.tile-value[data-v-b43b228e] {
margin-top: 2px;
font-size: 1rem;
}
}
+27 -20
View File
@@ -33,7 +33,7 @@
background: var(--p-content-background);
color: var(--p-text-color);
white-space: nowrap;
border-radius: 6px;
border-radius: var(--radius-md);
align-items: center;
gap: 9px;
padding: 10px 16px;
@@ -48,7 +48,7 @@
.catalog-categories[data-v-a6c63d86] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 8px;
border-radius: var(--radius-md);
padding: 20px 24px;
}
.catalog-categories h2[data-v-a6c63d86] {
@@ -70,7 +70,7 @@
font: inherit;
cursor: pointer;
overflow-wrap: anywhere;
border-radius: 6px;
border-radius: var(--radius-md);
max-width: 100%;
padding: 10px 18px;
font-size: 1rem;
@@ -113,7 +113,7 @@
.catalog-panel[data-v-a6c63d86] {
border: 1px solid var(--p-content-border-color);
background: var(--p-content-background);
border-radius: 8px;
border-radius: var(--radius-md);
min-width: 0;
overflow: hidden;
}
@@ -183,9 +183,9 @@
}
.product-columns[data-v-a6c63d86],
.product-row[data-v-a6c63d86] {
grid-template-columns: minmax(180px, 1fr) minmax(200px, 1.4fr) 190px;
grid-template-columns: minmax(220px, 1fr) minmax(240px, 1.5fr) auto;
align-items: center;
gap: 28px;
gap: 32px;
padding-inline: 24px;
display: grid;
}
@@ -203,8 +203,8 @@
.product-row[data-v-a6c63d86] {
border-bottom: 1px solid var(--p-content-border-color);
min-width: 0;
min-height: 143px;
padding-block: 26px;
min-height: 96px;
padding-block: 20px;
}
.product-row[data-v-a6c63d86]:last-child {
border-bottom: 0;
@@ -223,7 +223,7 @@
width: 42px;
height: 42px;
color: var(--p-primary-color);
border-radius: 7px;
border-radius: var(--radius-md);
flex-shrink: 0;
place-items: center;
font-size: 1.375rem;
@@ -231,7 +231,7 @@
}
.product-heading h2[data-v-a6c63d86] {
overflow-wrap: anywhere;
margin: 0 0 9px;
margin: 0 0 6px;
font-size: 1.125rem;
font-weight: 600;
line-height: 1.714rem;
@@ -250,9 +250,10 @@
color: var(--p-primary-color);
}
.product-purchase[data-v-a6c63d86] {
flex-direction: column;
align-items: flex-end;
gap: 14px;
flex-direction: row;
justify-content: flex-end;
align-items: center;
gap: 20px;
min-width: 0;
display: flex;
}
@@ -265,7 +266,7 @@
.product-price strong[data-v-a6c63d86] {
color: var(--p-text-color);
font-variant-numeric: tabular-nums;
font-size: 1.5rem;
font-size: 1.375rem;
font-weight: 600;
line-height: 2rem;
}
@@ -273,10 +274,11 @@
min-height: 36px;
color: var(--p-primary-contrast-color);
background: var(--p-primary-color);
border-radius: 5px;
border-radius: var(--radius-md);
white-space: nowrap;
justify-content: center;
align-items: center;
gap: 20px;
gap: 8px;
padding: 8px 16px;
font-size: 0.9375rem;
text-decoration: none;
@@ -293,7 +295,7 @@
background: var(--p-content-hover-background);
}
.product-skeleton[data-v-a6c63d86] {
min-height: 143px;
min-height: 96px;
}
.catalog-footer[data-v-a6c63d86] {
border-top: 1px solid var(--p-content-border-color);
@@ -340,15 +342,20 @@ button[data-v-a6c63d86]:focus-visible {
@media (width<=1100px) {
.product-columns[data-v-a6c63d86],
.product-row[data-v-a6c63d86] {
grid-template-columns: minmax(150px, 1fr) minmax(160px, 1.1fr) 160px;
grid-template-columns: minmax(150px, 1fr) minmax(160px, 1.1fr) auto;
gap: 20px;
}
.product-purchase[data-v-a6c63d86] {
flex-direction: column;
align-items: flex-end;
gap: 10px;
}
.product-icon[data-v-a6c63d86] {
display: none;
}
}
/* 视口条件 (width<=760px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=760px) {
/* 视口条件 (width<=768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=768px) {
.catalog-categories[data-v-a6c63d86] {
padding: 16px;
}
+3 -3
View File
@@ -14,7 +14,7 @@
align-items: center;
gap: 24px;
min-height: 72px;
padding: 16px max(24px, 50vw - 690px);
padding: 16px max(24px, 50vw - 666px);
display: flex;
}
.public-order-brand[data-v-f882e304] {
@@ -32,7 +32,7 @@
}
.public-order-header a[data-v-f882e304] {
color: inherit;
font-size: 0.9375rem;
font-size: 1rem;
text-decoration: none;
}
.public-order-header a[data-v-f882e304]:hover,
@@ -54,7 +54,7 @@
}
.public-order-login[data-v-f882e304] {
border: 1px solid var(--console-panel-border);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 9px 18px;
}
.public-order-content[data-v-f882e304] {
+8 -8
View File
@@ -31,7 +31,7 @@
display: inline-flex;
}
.back[data-v-ed164766]:hover {
color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
}
.page-head h2[data-v-ed164766] {
margin: 10px 0 0;
@@ -40,7 +40,7 @@
.panel[data-v-ed164766] {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
border-radius: 12px;
border-radius: var(--radius-lg);
padding: 20px 22px;
}
.steps-panel[data-v-ed164766] {
@@ -52,7 +52,7 @@
display: flex;
}
.certified i[data-v-ed164766] {
color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
flex-shrink: 0;
font-size: 2.125rem;
}
@@ -70,7 +70,7 @@
/* 允许连续长文本换行,防止IP、密钥或用户输入撑破当前容器;不会修改原始数据。 */
.certify-id[data-v-ed164766] {
overflow-wrap: anywhere;
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
font-family: var(--font-mono);
}
.certified > div[data-v-ed164766] {
min-width: 0;
@@ -120,7 +120,7 @@
.error-copy[data-v-ed164766] {
color: var(--p-red-500, #dc2626);
margin: 0;
font-size: 12px;
font-size: 0.9375rem;
}
.load-error[data-v-ed164766] {
gap: 12px;
@@ -128,7 +128,7 @@
}
.field-tip[data-v-ed164766] {
color: var(--p-text-muted-color);
font-size: 12px;
font-size: 0.9375rem;
}
.channel-fields[data-v-ed164766] {
gap: 12px;
@@ -156,7 +156,7 @@
.channel-option[data-v-ed164766] {
border: 1px solid var(--p-content-border-color);
cursor: pointer;
border-radius: 8px;
border-radius: var(--radius-md);
align-items: center;
gap: 12px;
min-height: 70px;
@@ -238,7 +238,7 @@
font-weight: 400;
}
.panel[data-v-ed164766] {
border-radius: 6px;
border-radius: var(--radius-md);
padding: 21px;
}
.form[data-v-ed164766] {
+1 -1
View File
@@ -12,7 +12,7 @@
padding: var(--recommend-gap);
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color);
border-radius: 7px;
border-radius: var(--radius-md);
box-shadow: 0 1px 2px #00000014;
}
.error-panel[data-v-78278278],
@@ -49,7 +49,7 @@
margin: auto;
}
.intro-icon[data-v-5f7e2625] {
color: #0052d9;
color: var(--p-primary-color);
margin-bottom: 8px;
font-size: 2rem;
display: inline-block;
@@ -67,7 +67,7 @@
line-height: 1.8;
}
.console-return[data-v-5f7e2625] {
color: #0052d9;
color: var(--p-primary-color);
justify-content: center;
align-items: center;
gap: 8px;
+2 -2
View File
@@ -15,8 +15,8 @@
}
.page-heading h2[data-v-7390ef3e] {
margin: 0;
font-size: 1.25rem;
font-weight: 650;
font-size: var(--page-title-size);
font-weight: 600;
line-height: 2rem;
}
.page-heading p[data-v-7390ef3e] {
+36 -5
View File
@@ -9,7 +9,7 @@
background: var(--console-panel-bg);
border: 1px solid var(--console-panel-border);
box-shadow: var(--console-panel-shadow);
border-radius: 6px;
border-radius: var(--radius-md);
padding: 14px;
}
.host-panel[data-v-b18590a1] {
@@ -232,8 +232,8 @@
margin-bottom: 7px;
display: block;
}
/* 视口条件 (width<=1199px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=1199px) {
/* 视口条件 (width<1200px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<1200px) {
.host-head[data-v-b18590a1] {
flex-wrap: wrap;
}
@@ -244,8 +244,8 @@
grid-template-columns: minmax(160px, 2fr) repeat(3, minmax(90px, 1fr));
}
}
/* 视口条件 (width<=767px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<=767px) {
/* 视口条件 (width<768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */
@media (width<768px) {
.host-panel[data-v-b18590a1] {
padding-top: 7px;
}
@@ -296,3 +296,34 @@
gap: 21px;
}
}
@media (width<768px) {
.host-ident[data-v-b18590a1] {
display: block;
position: relative;
}
.host-avatar[data-v-b18590a1] {
width: 52px;
height: 52px;
position: absolute;
top: 0;
right: 0;
}
.host-avatar img[data-v-b18590a1] {
width: 52px;
height: 52px;
}
.host-avatar .dot[data-v-b18590a1] {
width: 10px;
height: 10px;
bottom: 2px;
left: 40px;
box-shadow: 0 0 0 2px #dcfce7;
}
.host-id[data-v-b18590a1] {
min-width: 0;
}
.host-title[data-v-b18590a1],
.host-sub[data-v-b18590a1] {
padding-right: 64px;
}
}
+8 -7
View File
@@ -14,16 +14,17 @@
display: inline-flex;
}
.back[data-v-4a007273]:hover {
color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
}
.page-head h2[data-v-4a007273] {
margin: 10px 0 0;
font-size: 1.375rem;
font-size: var(--page-title-size);
font-weight: 600;
}
.panel[data-v-4a007273] {
background: var(--p-content-background);
border: 1px solid var(--p-content-border-color, #e2e8f0);
border-radius: 12px;
border-radius: var(--radius-lg);
padding: 8px 20px 20px;
}
.tab-head[data-v-4a007273] {
@@ -43,7 +44,7 @@
}
.info-card[data-v-4a007273] {
border: 1px solid var(--p-content-border-color, #e2e8f0);
border-radius: 10px;
border-radius: var(--radius-lg);
align-items: center;
gap: 12px;
padding: 12px 16px;
@@ -73,7 +74,7 @@
border-color: #fecaca;
}
.badge.default[data-v-4a007273] {
color: var(--p-primary-color, #3b82f6);
color: var(--p-primary-color);
border-color: #a7f3d0;
}
.card-sub[data-v-4a007273] {
@@ -130,7 +131,7 @@
}
.page-head h2[data-v-4a007273] {
margin: 0;
font-size: 1.25rem;
font-size: var(--page-title-size);
font-weight: 600;
}
.settings-section[data-v-4a007273] {
@@ -160,7 +161,7 @@
}
.settings-table[data-v-4a007273] {
border: 1px solid var(--p-content-border-color);
border-radius: 5px;
border-radius: var(--radius-md);
width: 100%;
overflow: hidden;
box-shadow: 0 2px 3px #0000000f;
Loaded 100 of 145 files, more files were not shown because too many files have changed in this diff. Show more