:root { --el-color-white: #fff; --blue: #324157; --light-blue: #3A71A8; --red: #C03639; --pink: #E65D6E; --green: #30B08F; --tiffany: #4AB7BD; --yellow: #FEC171; --pan-green: #30B08F; --menu-text: #bfcbd9; --menu-active-text: #409EFF; --sub-menu-active-text: #f4f4f5; --menu-bg: #304156; --menu-hover: #263445; --sub-menu-bg: #1f2d3d; --sub-menu-hover: #001528; --side-bar-width: 210px; } #app .main-container { min-height: 100%; transition: margin-left 0.28s; position: relative; } #app .sidebar-container { transition: width 0.28s; background-color: var(--menu-bg); width: 100%; height: 100%; font-size: 0; overflow: hidden; } #app .sidebar-container .horizontal-collapse-transition { transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out; } #app .sidebar-container .scrollbar-wrapper { overflow-x: hidden !important; } #app .sidebar-container .el-scrollbar__bar.is-vertical { right: 0px; } #app .sidebar-container .el-scrollbar { height: 100%; } #app .sidebar-container.has-logo .el-scrollbar { height: calc(100% - 50px); } #app .sidebar-container .is-horizontal { display: none; } #app .sidebar-container a.link { display: inline-block; width: 100%; overflow: hidden; } #app .sidebar-container .svg-icon { flex-shrink: 0; margin-right: 16px; } #app .sidebar-container .sub-el-icon { margin-right: 12px; margin-left: -2px; } #app .sidebar-container .el-menu { border: none; height: 100%; width: 100% !important; } #app .sidebar-container .submenu-title-noDropdown:hover, #app .sidebar-container .el-sub-menu__title:hover { background-color: var(--menu-hover) !important; } #app .sidebar-container .is-active > .el-sub-menu__title { color: var(--sub-menu-active-text) !important; } #app .sidebar-container .nest-menu .el-sub-menu > .el-sub-menu__title, #app .sidebar-container .el-sub-menu .el-menu-item { min-width: var(--side-bar-width) !important; background-color: var(--sub-menu-bg) !important; } #app .sidebar-container .nest-menu .el-sub-menu > .el-sub-menu__title:hover, #app .sidebar-container .el-sub-menu .el-menu-item:hover { background-color: var(--sub-menu-hover) !important; } #app .hideSidebar .submenu-title-noDropdown { padding: 0 !important; position: relative; } #app .hideSidebar .submenu-title-noDropdown .text-one-added { display: none; } #app .hideSidebar .submenu-title-noDropdown .el-tooltip { padding: 0 !important; } #app .hideSidebar .submenu-title-noDropdown .svg-icon { margin-left: 20px; } #app .hideSidebar .submenu-title-noDropdown .sub-el-icon { margin-left: 19px; } #app .hideSidebar .el-sub-menu { overflow: hidden; } #app .hideSidebar .el-sub-menu > .el-sub-menu__title { padding: 0 !important; } #app .hideSidebar .el-sub-menu > .el-sub-menu__title .svg-icon { margin-left: 20px; } #app .hideSidebar .el-sub-menu > .el-sub-menu__title .sub-el-icon { margin-left: 19px; } #app .hideSidebar .el-sub-menu > .el-sub-menu__title .el-sub-menu__icon-arrow { display: none; } #app .hideSidebar .el-menu--collapse .el-sub-menu > .el-sub-menu__title > span { height: 0; width: 0; overflow: hidden; visibility: hidden; display: inline-block; } #app .el-menu--collapse .el-menu .el-sub-menu { min-width: var(--side-bar-width) !important; } #app .mobile .main-container { margin-left: 0; } #app .mobile .sidebar-container { transition: transform 0.28s; } #app .mobile.hideSidebar .sidebar-container { pointer-events: none; transition-duration: 0.3s; transform: translate3d(calc(0% - var(--side-bar-width)), 0, 0); } #app .withoutAnimation .main-container, #app .withoutAnimation .sidebar-container { transition: none; } .el-menu--vertical > .el-menu .svg-icon { margin-right: 16px; } .el-menu--vertical > .el-menu .sub-el-icon { margin-right: 12px; margin-left: -2px; } .el-menu--vertical .nest-menu .el-sub-menu > .el-sub-menu__title .text, .el-menu--vertical .el-menu-item .text { overflow: hidden; text-overflow: ellipsis; } .el-menu--vertical .nest-menu .el-sub-menu > .el-sub-menu__title:hover, .el-menu--vertical .el-menu-item:hover { background-color: var(--menu-hover) !important; } .el-menu--vertical > .el-menu--popup { max-height: 100vh; overflow-y: auto; } .el-menu--vertical > .el-menu--popup::-webkit-scrollbar-track-piece { background: #d3dce6; } .el-menu--vertical > .el-menu--popup::-webkit-scrollbar { width: 6px; } .el-menu--vertical > .el-menu--popup::-webkit-scrollbar-thumb { background: #99a9bf; border-radius: 20px; } html.blue-theme #app { --base-color: #4ba1fa; --light-color: #00feff; --bg-color: #072d44; --el-text-color-placeholder: #4ba1fa; --el-fill-color-lighter: #1f3c64; --border-light-color: #143a92; --filter-input-border-color: rgba(255, 227, 41, 0.2); --el-dialog-bg-color: var(--bg-color); } html.blue-theme #app .el-drawer__body { padding: 0; } html.blue-theme #app .app-wrapper { background: #071426; } html.blue-theme #app .scroll-container .el-scrollbar__wrap { height: auto; } html.blue-theme #app .app-breadcrumb.el-breadcrumb .no-redirect { color: #4ba1fa; } html.blue-theme #app .tags-view-container { box-sizing: border-box; border-top: 2px solid #2f517f; border-bottom: 2px solid #2f517f; height: auto; } html.blue-theme #app .tags-view-container .tags-view-wrapper .tags-view-item { color: #ffffff; height: 32px; line-height: 32px; padding: 0 16px; border: 0; margin-left: 0; margin-top: 0; background: none; } html.blue-theme #app .tags-view-container .tags-view-wrapper .tags-view-item:first-of-type { margin-left: 0; } html.blue-theme #app .tags-view-container .tags-view-wrapper .tags-view-item.router-link-exact-active { background-color: #004986; border-color: #004986; color: #fff; } html.blue-theme #app .hdw-card { box-sizing: border-box; color: #ffffff; } html.blue-theme .el-tree { --el-tree-node-content-height: 26px; --el-tree-node-hover-bg-color: #214865; --el-tree-text-color: var(--el-text-color-regular); --el-tree-expand-icon-color: #1fcbe1; background: none; color: #ffffff; cursor: default; font-size: var(--el-font-size-base); position: relative; } html.blue-theme .el-tree .is-current > .el-tree-node__content.el-tree-node__content { background: #214865; } html.blue-theme .el-tree .is-current > .el-tree-node__content.el-tree-node__content .el-text { color: #fff; } html.blue-theme .el-tree .is-current > .el-tree-node__content.el-tree-node__content:hover .el-text { color: #fff; } html.blue-theme .el-table { --el-table-border-color: none; --el-table-border: 0; --el-table-text-color: var(--el-text-color-regular); --el-table-header-text-color: #fff; --el-table-row-hover-bg-color: #1a5a8b; --el-table-current-row-bg-color: var(--el-color-primary-light-9); --el-table-header-bg-color: #1f3c64; --el-table-fixed-box-shadow: var(--el-box-shadow-light); --el-table-bg-color: var(--bg-color); --el-table-tr-bg-color: #0d2b4d; --el-table-expanded-cell-bg-color: var(--el-fill-color-blank); --el-table-index: var(--el-index-normal); background-color: var(--bg-color); color: #ffffff; } html.blue-theme .tools-filter .el-input { --el-input-text-color: #ffe329; --el-input-border: var(--el-border); --el-input-hover-border: var(--el-border-color-hover); --el-input-focus-border: var(--el-color-primary); --el-input-transparent-border: 0 0 0 1px transparent inset; --el-input-border-color: var(--filter-input-border-color); --el-input-border-radius: var(--el-border-radius-base); --el-input-bg-color: var(--filter-input-border-color); --el-input-icon-color: var(--el-text-color-placeholder); --el-input-placeholder-color: #ffe32990; --el-input-hover-border-color: var(--el-border-color-hover); --el-input-clear-hover-color: var(--el-text-color-secondary); --el-input-focus-border-color: var(--el-color-primary); } html.blue-theme .tools-filter .el-select { --el-select-border-color-hover: var(--el-border-color-hover); --el-select-disabled-color: var(--el-disabled-text-color); --el-select-disabled-border: var(--el-disabled-border-color); --el-select-font-size: var(--el-font-size-base); --el-select-close-hover-color: var(--el-text-color-secondary); --el-select-input-color: #ffe329; --el-select-multiple-input-color: var(--el-text-color-regular); --el-select-input-focus-border-color: var(--el-color-primary); } html.blue-theme .tools-filter .el-select .el-select__wrapper { background-color: var(--filter-input-border-color); box-shadow: 0 0 0 1px var(--filter-input-border-color) inset; } html.blue-theme .tools-filter .el-select .el-select__wrapper .el-select__placeholder { color: #ffe329; } html.blue-theme .page-content { padding-bottom: 20px; } html.blue-theme .page-content .el-table { background: transparent; } html.blue-theme .ys-title { font-family: "YouSheBiaoTiHei"; } html.blue-theme .panel-title { font-family: "YouSheBiaoTiHei"; font-size: 24px; padding-left: 1.4em; background: url("@/assets/images/tb1.png") 6px center / auto 82% no-repeat; } .el-tree.el-tree.el-tree { color: #1fcbe1; } .el-tabs--border-card > .el-tabs__header.el-tabs__header { border-bottom: 1px solid #1c4975; background-color: #00243e; } .el-tabs--border-card > .el-tabs__header.el-tabs__header .el-tabs__item { color: #fff; } .el-tabs--border-card > .el-tabs__header.el-tabs__header .el-tabs__item.is-active { background-color: #014886; border-color: #014886; color: #fff; } .el-pagination__sizes.el-pagination__sizes, .el-pagination__total.el-pagination__total { color: #fff; font-size: 16px; } .el-pagination .el-select__wrapper.el-select__wrapper { background-color: #134ba8; color: #fff; box-shadow: 0 0 0 1px #436da8 inset; } .el-pagination .el-select__wrapper.el-select__wrapper .el-select__placeholder, .el-pagination .el-select__wrapper.el-select__wrapper .el-select__input { color: #fff; } .el-pagination.el-pagination.el-pagination button { background: transparent; color: #fff; } .el-pagination.el-pagination.el-pagination button.is-disabled, .el-pagination.el-pagination.el-pagination button:disabled { background-color: transparent; color: #fff; cursor: not-allowed; } .el-pagination .el-pager.el-pager.el-pager li { background: transparent; color: #fff; } .el-pagination .el-pager.el-pager.el-pager li.is-active, .el-pagination .el-pager.el-pager.el-pager li:hover { color: #529ac1; } .el-pagination__jump.el-pagination__jump { color: #fff; } .el-pagination__jump.el-pagination__jump .el-input__wrapper { background-color: #134ba8; box-shadow: 0 0 0 1px #436da8 inset; } .el-pagination__jump.el-pagination__jump .el-input__wrapper .el-input__inner { color: #fff; } .el-tree-node:focus > .el-tree-node__content.el-tree-node__content { background: transparent; } .el-tabs--border-card.el-tabs--border-card { background: transparent; border: 0 none; } .el-button.el-button:focus-visible { outline: none; } .el-tooltip__popper.el-tooltip__popper { z-index: 9999; /* 设置较高的 z-index */ } .el-transfer .el-checkbox__input.is-indeterminate .el-checkbox__inner, .el-transfer .el-checkbox__input.is-checked .el-checkbox__inner { background-color: #46cafe; border-color: #46cafe; } .el-transfer .el-checkbox__input.is-indeterminate .el-checkbox__inner::before, .el-transfer .el-checkbox__input.is-checked .el-checkbox__inner::before { background-color: #333; } .el-transfer .el-checkbox__input.is-indeterminate .el-checkbox__inner::after, .el-transfer .el-checkbox__input.is-checked .el-checkbox__inner::after { border-color: #333; } .page-filter { display: table; border-bottom: 1px solid #304a75; margin-top: 8px; padding: 6px; margin-bottom: 6px; } .page-filter .el-select__wrapper.el-select__wrapper { background-color: #103047; color: #48a5d0; box-shadow: 0 0 0 1px #103047 inset; } .page-filter .el-select__placeholder { color: #48a5d0; } .page-filter .table-row { display: table-row; table-layout: fixed; } .page-filter .table-row .table-cell { display: table-cell; white-space: nowrap; color: #48a5d0; font-size: 16px; } .page-filter .table-cell.text-right { text-align: right; padding-right: 10px; } .page-filter .el-date-editor .el-input__wrapper { align-items: center; background-color: #103047; background-image: none; border-radius: var(--el-input-border-radius, var(--el-border-radius-base)); box-shadow: 0 0 0 1px #103047 inset; cursor: text; display: inline-flex; flex-grow: 1; justify-content: center; padding: 1px 11px; } .page-filter .el-date-editor .el-input__wrapper .el-input__inner { color: #48a5d0; } .page-filter .grid-container { display: grid; grid-template-columns: repeat(var(--counter), auto 1fr); gap: 12px; /* 列之间的间距 */ padding: 10px; } .page-filter .grid-container .grid-item { color: #48a5d0; display: contents; /* 使项目内容直接参与网格布局 */ } .page-filter .grid-container .grid-item .label { white-space: nowrap; margin-right: -6px; margin-left: 1em; color: #48a5d0; font-size: 16px; text-align: right; } .page-filter .grid-container .grid-item .label::after { content: ":"; } .pos-r { position: relative; } .pos-full.pos-full.pos-full { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .page-contain { height: 100%; } .page-contain.bg-footer { background: url("@/assets/images/bg_bottom.png") center calc(100% - 20px) / 100% auto no-repeat; } .page-contain .page-main { padding-left: 20px; padding-right: 20px; } @font-face { font-family: "YouSheBiaoTiHei"; src: url(YouSheBiaoTiHei-2.ttf) format("truetype"); } body { height: 100%; font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; margin: 0; color: #ffffff; overflow: hidden; } label { font-weight: 700; } html { height: 100%; box-sizing: border-box; } #app { height: 100%; } *, *:before, *:after { box-sizing: inherit; } .no-padding { padding: 0px !important; } .padding-content { padding: 4px 0; } a { color: var(--ep-color-primary); } code { border-radius: 2px; padding: 2px 4px; background-color: var(--ep-color-primary-light-9); color: var(--ep-color-primary); } a:focus, a:active { outline: none; } a, a:focus, a:hover { cursor: pointer; color: inherit; text-decoration: none; } div:focus { outline: none; } .fr { float: right; } .fl { float: left; } .pr-5 { padding-right: 5px; } .pl-5 { padding-left: 5px; } .block { display: block; } .pointer { cursor: pointer; } .inlineBlock { display: block; } .clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } aside { background: #eef1f6; padding: 8px 24px; margin-bottom: 20px; border-radius: 2px; display: block; line-height: 32px; font-size: 16px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; color: #2c3e50; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } aside a { color: #337ab7; cursor: pointer; } aside a:hover { color: #20a0ff; } .app-container { padding: 20px; } .components-container { margin: 30px 50px; position: relative; } .pagination-container { margin-top: 30px; } .text-center { text-align: center; } .sub-navbar { height: 50px; line-height: 50px; position: relative; width: 100%; text-align: right; padding-right: 20px; transition: 600ms ease position; background: linear-gradient(90deg, #20b6f9 0%, #20b6f9 0%, #2178f1 100%, #2178f1 100%); } .sub-navbar .subtitle { font-size: 20px; color: #fff; } .sub-navbar.draft { background: #d0d0d0; } .sub-navbar.deleted { background: #d0d0d0; } .link-type, .link-type:focus { color: #337ab7; cursor: pointer; } .link-type:hover, .link-type:focus:hover { color: #20a0ff; } .filter-container { padding-bottom: 10px; } .filter-container .filter-item { display: inline-block; vertical-align: middle; margin-bottom: 10px; } .multiselect { line-height: 16px; } .multiselect--active { z-index: 1000 !important; } .e-chart-root { position: relative; height: 100%; /* export chart wrapper css */ } .e-chart-root.full-screen .e-chart-container { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: #071426; background-repeat: no-repeat; background-size: 100% 100%; z-index: 9999; } .e-chart-root .e-chart { height: 100%; } .e-chart-root .e-chart-container { position: absolute; top: 0; left: 0; right: 0; bottom: 0; box-sizing: border-box; } .e-chart-root .export-chart-wrapper { position: relative; width: 0; height: 0; overflow: hidden; } .e-chart-root .export-chart { position: absolute; width: 600px; height: 400px; } ul, ol { list-style: none; margin: 0; padding: 0; } ::-webkit-scrollbar { width: 4px; height: 8px; } ::-webkit-scrollbar-thumb { border-radius: 8px; -webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2); background: #02b0bd; } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.2); border-radius: 8px; background: #003d64; } .el-drawer { background: #0D2B4D; }