首页美化一下
This commit is contained in:
@@ -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 -->
|
||||
|
||||
Reference in New Issue
Block a user