首页美化一下

This commit is contained in:
liuwei
2026-02-27 11:27:26 +08:00
parent 2482972a9c
commit fe99c51d9b

View File

@@ -13,6 +13,18 @@
/* ------------------------------
GLOBAL RESET
------------------------------ */
:root {
--tech-bg: #0b1d33;
--tech-bg-2: #0f2545;
--tech-accent: #5bd3ff;
--tech-accent-2: #41bff0;
--tech-panel: #f9fbff;
--tech-panel-2: #f2f7ff;
--tech-border: #d6e6ff;
--tech-text: #22324a;
--tech-text-muted: #6b86a8;
--tech-shadow: 0 6px 16px rgba(11, 29, 51, 0.06);
}
body {
margin: 0;
padding: 0;
@@ -205,6 +217,126 @@
margin-right: 8px !important;
margin-bottom: 8px !important;
}
/* ------------------------------
TECH THEME OVERRIDES
------------------------------ */
a {
color: var(--tech-accent);
}
a:hover {
color: var(--tech-accent-2);
}
.el-card__header {
background: var(--tech-panel-2) !important;
border-bottom: 1px solid var(--tech-border) !important;
color: var(--tech-text) !important;
}
.el-button--primary {
background: var(--tech-accent) !important;
border-color: var(--tech-accent) !important;
color: #0b1d33 !important;
}
.el-button--primary:hover,
.el-button--primary:focus {
background: var(--tech-accent-2) !important;
border-color: var(--tech-accent-2) !important;
}
.el-button--default {
background: #ffffff !important;
border-color: var(--tech-border) !important;
color: #2a3b55 !important;
}
.el-button--default:hover,
.el-button--default:focus {
border-color: var(--tech-accent) !important;
color: var(--tech-accent) !important;
}
.el-button--text {
color: var(--tech-accent) !important;
}
.el-input__inner,
.el-textarea__inner {
background: #f7faff !important;
border-color: var(--tech-border) !important;
color: var(--tech-text) !important;
}
.el-input__inner:focus,
.el-textarea__inner:focus {
border-color: var(--tech-accent) !important;
box-shadow: 0 0 0 2px rgba(91, 211, 255, 0.15) !important;
}
.el-table {
color: var(--tech-text) !important;
}
.el-table th {
background: var(--tech-panel-2) !important;
color: var(--tech-text) !important;
}
.el-table td,
.el-table th.is-leaf {
border-bottom: 1px solid var(--tech-border) !important;
}
.el-table--border,
.el-table--group {
border: 1px solid var(--tech-border) !important;
}
.el-table--border th,
.el-table--border td {
border-right: 1px solid var(--tech-border) !important;
}
.el-table__row:hover > td {
background: #eef6ff !important;
}
.el-pagination .el-pager li.active {
background: var(--tech-accent) !important;
color: #0b1d33 !important;
}
.el-pagination .el-pager li:hover {
color: var(--tech-accent) !important;
}
.el-pagination button,
.el-pagination span {
color: var(--tech-text-muted) !important;
}
.el-tabs__item {
color: var(--tech-text-muted) !important;
}
.el-tabs__item.is-active {
color: var(--tech-accent) !important;
}
.el-tabs__item:hover {
color: var(--tech-accent) !important;
}
.el-tabs__active-bar {
background: var(--tech-accent) !important;
}
.el-tag {
background: var(--tech-panel-2) !important;
border-color: var(--tech-border) !important;
color: var(--tech-text) !important;
}
.el-dialog,
.el-message-box {
border: 1px solid var(--tech-border) !important;
}
.el-dialog__header,
.el-message-box__header {
background: var(--tech-panel-2) !important;
border-bottom: 1px solid var(--tech-border) !important;
}
.el-dialog__title,
.el-message-box__title {
color: var(--tech-text) !important;
}
</style>
<!-- Element UI CSS -->