@bordercolor : rgb(98,133,151); @headercolor : #ffffff; @backcolor : #ffffff; @inpuitbordercolor: rgb(45,103,132); @inpuitbackcolor : rgb(4,27,43); @labelDeaultColor : rgb(98,133,151); @defaultWhiteColor: rgb(98,133,151); @fontfamily : 'MyCustomFont3', sans-serif; @tableheadColor : #E5E8EB; @tableheadBgColor : linear-gradient(180deg, rgb(20,108,173),rgb(11,57,90)); @tableColor : rgb(98,133,151); @font-face { font-family: 'MyCustomFont1'; src: url('~@/assets/less/Acens-1.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'MyCustomFont2'; src: url('~@/assets/less/锐字潮牌真言简2.0免费 特粗(REEJI-ZhenyanGB2.0-Black).ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family: 'MyCustomFont3'; src: url('~@/assets/less/锐字潮牌真言简2.0免费 常规(REEJI-ZhenyanGB2.0-Regular).ttf') format('truetype'); font-weight: normal; font-style: normal; } body{ font-family: 'MyCustomFont3', sans-serif !important; } .datanum{ font-family: 'MyCustomFont2', sans-serif; } .analysisBG .num{ font-family: 'MyCustomFont1', sans-serif; } .echartsTitle{ height: 36px; background: linear-gradient(90deg, rgb(9,62,81),rgb(9,62,81),rgb(8,43,62)); color: #ffffff; font-size: 16px; line-height: 34px; .ecicon{ margin-top: 2px; width:30px; height: 30px; float: left; background: url('~@/assets/img/echartsTitlebg.png') no-repeat; } } .linese{ width: 100%; height: 2px; margin: 10px 0; background: linear-gradient(90deg, rgb(49,112,157) 20px,rgb(26,63,86) 20px,rgb(26,63,86) calc(100% - 20px),rgb(49,112,157) calc(100% - 20px)); } /* 滚动条优化 start */ ::-webkit-scrollbar { width : 10px; height: 8px; } ::-webkit-scrollbar-track { background : #C8C8C8; border-radius: 2px; } ::-webkit-scrollbar-thumb { background : #fafafa; border-radius: 10px; } ::-webkit-scrollbar-thumb:hover { background: #fafafa; } ::-webkit-scrollbar-corner { background: #C8C8C8; } /* 滚动条优化 end */ .ant-col { margin-bottom: 6px; } body { // 打开滚动条固定显示 overflow: hidden; &.colorWeak { filter: invert(80%); } } .logoLabel { font-size : 36px !important; color : @defaultWhiteColor !important; font-family : @fontfamily; letter-spacing: 20px; } .ant-select-selection--multiple .ant-select-selection__choice { background-color: #3f4354 !important; border : 1px solid #3f4354 !important; } .ant-select-selection--multiple .ant-select-selection__choice__remove { color: #8a8e9e !important; } .ant-pagination-item-active { color: @headercolor !important; } .ant-layout { background-image: url('~@/assets/img/layoutbg.png') !important; background-size: 100% 100%; // background-color: #fff !important; overflow: hidden; } .ant-layout-header { // background-image: url('~@/assets/img/header_bg.png') !important; // background-size: 100% 100%; background: transparent !important; height: 130px !important; } .signdiv, .ant-card-head, .ant-form-item label, .ant-form-item label:hover, .ant-breadcrumb, .ant-breadcrumb-separator, .border-card, .ant-tabs-tab { font-weight: 400 !important; font-size : 16px !important; color : @labelDeaultColor !important; } .ant-radio-disabled+span { color: @labelDeaultColor !important; } /* tab背景 */ .ant-tabs-bar { border-bottom: 1px solid #336591 !important; margin: 0px 0 5px 0 !important; } .ant-tabs-tab { border-bottom: 2px solid #336591 !important; text-align : center; width : 178px; height : 40px !important; padding : 6px 16px !important; margin : 0 -8px 0 0px !important; background : url('~@/assets/img/tab_bg_default.png') no-repeat; } .ant-tabs-tab-active { z-index : 200 !important; border-bottom: 0px !important; background : url('~@/assets/img/tab_bg_active.png') no-repeat; color: @headercolor !important; } .ant-tabs-tab:first-child { width : 172px; background: url('~@/assets/img/tab_bg_1_default.png') no-repeat; } .ant-tabs-tab-active:first-child { background: url('~@/assets/img/tab_bg_1_active.png') no-repeat; } .ant-tabs-tab:nth-child(1) { z-index: 100; } .ant-tabs-tab:nth-child(2) { z-index: 90; } .ant-tabs-tab:nth-child(3) { z-index: 80; } .ant-tabs-tab:nth-child(4) { z-index: 70; } .ant-tabs-tab:nth-child(5) { z-index: 60; } .ant-tabs-tab:nth-child(6) { z-index: 50; } .ant-tabs-tab:nth-child(7) { z-index: 40; } .ant-tabs-tab:nth-child(8) { z-index: 30; } .ant-tabs-tab:nth-child(9) { z-index: 20; } .ant-tabs-tab:nth-child(10) { z-index: 10; } input { border-radius: 0px; } .ant-form-item { margin-bottom: 0px !important; } .ant-form-item-label { text-align : left !important; line-height: 32px !important; } .ant-form-item-control { line-height: 32px; } .ant-input-number { border: none; height: 30px; } ul { list-style : none; padding-left: 0; } ul li { line-height: 32px; font-family: @fontfamily; font-weight: 400; font-size : 16px !important; color : @tableColor !important; } .table-page-search-wrapper { padding: 30px 10px 10px 20px; } .ant-menu-horizontal, .ant-menu-dark { background: none !important; } .libraryConfiguration .border-card { height: 670px !important; } .border-card, .border-card img { height : 655px; overflow-y: auto; } .ant-pagination-item, .ant-pagination-item-active, .ant-pagination-prev .ant-pagination-item-link, .ant-pagination-next .ant-pagination-item-link, .ant-table-placeholder, .ant-checkbox-inner, .ant-radio-inner, .ant-table-tbody .ant-table-row-cell-break-word, .ant-dropdown-menu-item-active, .ant-menu.ant-menu-dark .ant-menu-item-selected, .ant-layout-sider-children { background-color: transparent !important; } .ant-radio-inner, .ant-checkbox-inner { border-color: @bordercolor !important; } .ant-card-bordered, .ant-pagination-item, .ant-pagination-item-active, .ant-pagination-prev .ant-pagination-item-link, .ant-pagination-next .ant-pagination-item-link, .ant-table-placeholder { border: none !important; } .ant-pagination-item-active a, .ant-pagination-item a:hover{ background-color: #2989CC !important; border-radius: 30px; } .ant-pagination-prev .ant-pagination-item-link, .ant-pagination-next .ant-pagination-item-link { color: #40a9ff; } .ant-radio-wrapper, .ant-input-affix-wrapper .ant-input-prefix, .ant-input-affix-wrapper .ant-input-suffix, .ant-pagination-disabled .ant-pagination-item-link, .ant-pagination-item a, .ant-empty-normal, .border-card:hover, .ant-tabs-tab:hover, .ant-form-item, .ant-select-arrow, .ant-calendar-picker-icon, .ant-input-password-icon, .ant-dropdown-menu-item>a, .ant-dropdown-menu-submenu-title>a { color: @defaultWhiteColor !important; } .ant-breadcrumb { font-size : 16px; font-family: @fontfamily; } .ant-breadcrumb>span:last-child { color: #00c3ff !important; } .ant-layout-content { padding : 0 20px !important; // background : url(~@/assets/img/layoutcontentTop.png) 0 0 no-repeat, url(~@/assets/img/layoutcontentMiddle.png) 0 24px no-repeat, url(~@/assets/img/layoutcontentBottom.png) 0 calc(100vh - 182px) no-repeat; // background-size: calc(100vw - 80px) 24px, calc(100vw - 80px) calc(100vh - 206px), calc(100vw - 80px) 24px; height : calc(100vh - 130px) !important; margin-top: -2px; overflow: hidden; } .layout { min-height: 100vh !important; overflow-x: hidden; &.ant-layout-has-sider { flex-direction: row; } .trigger { font-size : 22px; line-height: 42px; padding : 0 18px; cursor : pointer; transition : color 300ms, background 300ms; &:hover { background: rgba(255, 255, 255, 0.3); } } .topmenu { .ant-header-fixedHeader { position : fixed; top : 0; right : 0; z-index : 9; width : 100%; transition: width 0.2s; &.ant-header-side-opened { width: 100%; } &.ant-header-side-closed { width: 100%; } } /* 必须为 topmenu 才能启用流式布局 */ &.content-width-Fluid { .header-index-wide { max-width : unset; margin-left: 24px; } .page-header-index-wide { max-width: unset; } } } .header { height : 80px; padding : 0 12px 0 0; background: @defaultWhiteColor; box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08); position : relative; } .header, .top-nav-header-index { .user-wrapper { float : right; height: 100%; .action { cursor : pointer; padding : 0 14px; display : inline-block; transition: all 0.3s; height : 70%; line-height: 46px; &.action-full { height: 100%; } &:hover { background: rgba(255, 255, 255, 0.3); } .avatar { margin : 20px 10px 20px 0; color : #1890ff; background : hsla(0, 0%, 100%, 0.85); vertical-align: middle; } .icon { font-size: 16px; padding : 4px; } .anticon { color: inherit; } } } &.dark { .user-wrapper { .action { color: black; &:hover { background: rgba(0, 0, 0, 0.05); } .anticon { color: inherit; } } } } } &.tablet { // overflow: hidden; text-overflow:ellipsis; white-space: nowrap; .top-nav-header-index { .header-index-wide { .header-index-left { .logo>a { overflow : hidden; text-overflow: ellipsis; white-space : nowrap; } } } } } .top-nav-header-index { box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08); position : relative; transition: background 0.3s, width 0.2s; .header-index-wide { width : 100%; margin : auto; padding: 0 20px 0 0; display: flex; height : 64px; .ant-menu.ant-menu-horizontal { border : none; height : 64px; line-height: 64px; } .header-index-left { display: block; .logo.top-nav-header { width : 165px; height : 64px; position : relative; line-height: 64px; transition : all 0.3s; overflow : hidden; img { display : inline-block; vertical-align: middle; height : 32px; } h1 { color : @defaultWhiteColor; display : inline-block; vertical-align: top; font-size : 16px; margin : 0 0 0 12px; font-weight : 400; } } } .header-index-right { float : right; height : 64px; overflow: hidden; .action:hover { background-color: rgba(0, 0, 0, 0.05); } } } &.dark { .user-wrapper { .action { color: white; &:hover { background: rgba(255, 255, 255, 0.3); } } } .header-index-wide .header-index-left .trigger:hover { background: rgba(255, 255, 255, 0.3); } } } // 内容区 .layout-content { margin : 24px 24px 0px; height : 64px; padding: 0 12px 0 0; } } .ant-btn-background-ghost{ display: none !important; } .ant-popover-inner { background: @inpuitbackcolor !important; } input:not(.ant-calendar-input):not(.ant-select-search__field):not(.ant-input-lg), textarea, // .ant-modal-confirm-title, // .ant-modal-confirm-content, .ant-select-selection, .ant-calendar-picker-input, .ant-input-number-handler-wrap, .ant-input-number-handler-up-inner, .ant-input-number-handler-down-inner, .ant-select-tree-dropdown, .ant-select-dropdown-menu-item, .ant-select-dropdown-menu-item-selected, .ant-select-dropdown-content { background: @inpuitbackcolor !important; } .ant-popover-message, input:not(.ant-calendar-input):not(.ant-select-search__field):not(.ant-input-lg), textarea, .ant-modal-confirm-title, .ant-modal-confirm-content, .ant-select-selection, .ant-calendar-picker-input, .ant-input-number-handler-wrap, .ant-input-number-handler-up-inner, .ant-input-number-handler-down-inner, .ant-select-tree-dropdown, .ant-select-dropdown-menu-item, .ant-select-dropdown-menu-item-selected, .ant-select-dropdown-content, .ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item-selected .ant-select-selected-icon, .ant-select-dropdown.ant-select-dropdown--multiple .ant-select-dropdown-menu-item:hover .ant-select-selected-icon { color: @defaultWhiteColor !important; min-height: 38px; } input:not(.ant-calendar-input):not(.ant-calendar-range-picker-input):not(.ant-select-search__field):not(.ant-input-lg), textarea, .ant-select-selection, .ant-calendar-picker-input, .ant-input-number-handler-wrap, .ant-select-dropdown-content { border : 1px solid @inpuitbordercolor !important; border-radius: 3px; } .ant-input-number-handler-down { border-top: 1px solid @inpuitbordercolor !important; } .ant-dropdown-menu, .ant-drawer-content { overflow : hidden !important; background: @backcolor !important; border : 1px solid #5a91c7 !important; .ant-drawer-header { border-bottom: 0; background : @headercolor !important; padding : 10px 24px; } .ant-modal-close-x { width : 36px; height : 36px; line-height: 36px; right : 30px !important; } .ant-modal-title, .ant-modal-close, .ant-drawer-title, .ant-drawer-close { color: #919499 !important; } .ant-modal-body, .ant-drawer-body { .drawer-bootom-button { background-color: @backcolor !important; border-top : 1px solid @backcolor; } .ant-table-tbody tr th, .ant-table-tbody tr td { color : @tableheadColor; font-family: 'MyCustomFont3', sans-serif; // height: 50px; a { color: @defaultWhiteColor !important; } } .ant-table-bordered .ant-table-thead>tr>th, .ant-table-bordered .ant-table-tbody>tr>td, .ant-table-content .ant-table-thead>tr>th, .ant-table-content .ant-table-tbody>tr>td { border-right : 0 !important; border-bottom: 1px solid #31343d !important; line-height : 22px; background: @tableheadBgColor; } } .ant-modal-footer { border-top: 1px solid @backcolor; } } .ant-checkbox-disabled+span { color: @labelDeaultColor !important; } .ant-btn { min-width : 60px !important; height : 36px !important; font-family: @fontfamily; //color : @defaultWhiteColor !important; } .ant-btn, .ant-input-search-button { // background : url('~@/assets/img/buttonDefault.png') !important; border : none !important; border-radius: 0 !important; } .ant-input-search-button { margin-left: 10px; } .ant-btn:hover, .ant-btn:active, .ant-btn:focus { //background: url('~@/assets/img/buttonSelect.png') !important; } .ant-menu-light { height : 100%; padding-bottom: 0; overflow-y : none; } .ant-layout-sider { margin-left : 50px; min-width : 286px !important; background-color: transparent !important; } .ant-tree li .ant-tree-node-content-wrapper { height : 32px !important; line-height: 32px !important; } .ant-tree-node-content-wrapper { color: @labelDeaultColor !important; } .ant-tree li .ant-tree-node-content-wrapper.ant-tree-node-selected, .ant-tree li .ant-tree-node-content-wrapper:hover { color: rgba(0, 0, 0, 0.65) !important; } .ant-notification-notice-icon-error { color: #f5222d !important; } .ant-notification-notice-icon-success { color: #52c41a !important; } .ant-notification-notice-icon-info { color: #1890ff !important; } .ant-notification-notice-icon-warning { color: #faad14 !important; } .ant-notification-notice-icon-error { color: #f5222d !important; } .userrolemodel { .ant-tree-node-content-wrapper, .anticon { color: @labelDeaultColor !important; } } .ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::before, .ant-menu-submenu-inline>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::before, .ant-menu-submenu-inline>.ant-menu-submenu-title .ant-menu-submenu-arrow::after, .ant-menu-submenu-inline>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::after { background: linear-gradient(to right, @bordercolor, @bordercolor) !important; } .ant-menu-submenu-open>.ant-menu-submenu-title .ant-menu-submenu-arrow::before, .ant-menu-submenu-open>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::before, .ant-menu-submenu-open>.ant-menu-submenu-title .ant-menu-submenu-arrow::after, .ant-menu-submenu-open>.ant-menu-submenu-title:hover .ant-menu-submenu-arrow::after { background: linear-gradient(to right, #04DEFF, #04DEFF) !important; } .ant-menu-inline .ant-menu-item::after { border: 0px !important; } .ant-menu-horizontal .ant-menu-item, .ant-menu-submenu.ant-menu-submenu-horizontal { background-image: url('~@/assets/img/menuDefault.png'); background-repeat: no-repeat !important; background-size: 100% 100% !important; min-width : 130px !important; margin : 0 10px !important; min-height : 55px !important; line-height : 50px !important; text-align : center; font-weight : 800; font-size : 20px !important; padding :0 20px !important; vertical-align: middle !important; font-family : @fontfamily; border-bottom: none !important; } .ant-menu-item>a>span, .ant-menu-submenu { color: rgb(28,204,253) !important; } .ant-menu-item-selected>a>span, .ant-menu-item-active>a>span, .ant-menu-submenu:hover, .ant-menu-submenu-selected .ant-menu-submenu-title, .ant-menu-submenu-title:hover { color: @headercolor !important; } .ant-menu-submenu-horizontal.ant-menu-submenu-selected, .ant-menu-submenu-horizontal.ant-menu-submenu-open, .ant-menu-horizontal .ant-menu-item-selected, .ant-menu-horizontal .ant-menu-item-active { background-image: url('~@/assets/img/menuSelect.png') !important; } .ant-menu-dark .ant-menu-sub{ background: transparent !important; } .ant-menu-vertical .ant-menu-item, .ant-menu-submenu.ant-menu-submenu-vertical { background-image: url('~@/assets/img/MenuSecDefault.png'); background-size: 100% 100%; width : 165px !important; height : 40px !important; margin-bottom: 0 !important; margin-top : -1px !important; text-align: left; float: left; margin-right: 20px; padding: 0 0 0 10px !important; } .ant-menu-vertical .ant-menu-submenu-title { margin-top: 0px !important; } .ant-menu-submenu-vertical.ant-menu-submenu-selected, .ant-menu-submenu-vertical.ant-menu-submenu-open, .ant-menu-vertical .ant-menu-item-selected, .ant-menu-vertical .ant-menu-item-active { background-image: url('~@/assets/img/MenuSecSelect.png'); background-size: 100% 100%; } .ant-menu-submenu-placement-rightTop { left: 194px !important; top : 0 !important; } .ant-layout.ant-layout-has-sider>.ant-layout, .ant-layout.ant-layout-has-sider>.ant-layout-content { overflow-y: hidden; } .ant-modal-content{ background: url('~@/assets/img/文件上传.png') !important; } .ant-modal-header{ background: transparent !important; border-bottom: none !important; } .ant-modal-title{ color: #fff !important; font-size: 20px !important; font-family: 'MyCustomFont2', sans-serif; } .result-wrapper{ background: rgb(15,41,61) !important; border: none !important; height: 360px; .item{ font-family: 'MyCustomFont3', sans-serif; color: #fff !important; } } .ant-modal-footer{ border-top: none !important; } .ant-card, .ant-card-body, .ant-layout-footer, .ant-input-group-addon { background: transparent !important; } .ant-card-body { padding: 0 !important; } // drawer-sider 自定义 .ant-drawer.drawer-sider { .sider { box-shadow: none; } &.dark { .ant-drawer-content { background-color: rgb(0, 76, 147); } } &.light { box-shadow: none; .ant-drawer-content { background-color: @defaultWhiteColor; } } .ant-drawer-body { padding: 0; } } .ant-menu-inline .ant-menu-submenu-title { font-size: 16px !important; } .ant-menu-item .anticon, .ant-menu-submenu-title .anticon{ font-size: 20px !important; } // 外置的样式控制 .user-dropdown-menu-wrapper.ant-dropdown-menu { padding: 4px 0; .ant-dropdown-menu-item { width: 160px; } .ant-dropdown-menu-item>.anticon:first-child, .ant-dropdown-menu-item>a>.anticon:first-child, .ant-dropdown-menu-submenu-title>.anticon:first-child .ant-dropdown-menu-submenu-title>a>.anticon:first-child { min-width : 12px; margin-right: 8px; } } // 数据列表 样式 .table-alert { margin-bottom: 16px; } .ant-table-align-center, .ant-table-selection-column, .ant-table-row-expand-icon { background-color: transparent !important; color : @labelDeaultColor !important; font-weight : 400 !important; font-size : 16px !important; } .ant-table-header, .ant-table-fixed-header>.ant-table-content>.ant-table-scroll>.ant-table-body, .ant-table-fixed-left table, .ant-table-fixed-right table, tr.ant-table-expanded-row, tr.ant-table-expanded-row:hover { background: transparent !important; } .ant-table-row, .ant-table-row .ant-table-selection-column, .ant-avatar, .ant-table-tbody>tr td, .ant-table-row>td>span>a { background-color: transparent !important; color : #00A2FF; height : 50px; font-family : 'MyCustomFont1', sans-serif; font-weight : 400 !important; font-size : 16px !important; } .ant-divider{ background:#00A2FF !important; } .ant-table-tbody>tr.ant-table-row-hover>td, .ant-table-tbody>tr.ant-table-row-hover>td>span>a, .ant-table-tbody>tr.ant-table-row-selected>td, .ant-table-tbody>tr.ant-table-row-selected>td>span>a { color: #08c0ef !important; } // a { // color: #00DEF4 !important; // } .ant-alert-info, // .ant-pagination, // .ant-table-pagination, .ant-tabs-no-animation, .ant-tabs-editable-card { display: none; } // .ant-table-fixed-right, // .ant-table-fixed-columns-in-body, // .ant-table-row-cell-break-word, // .ant-table-selection-column, // .ant-alert-info, // .ant-table-pagination { // display: none; // } .ant-table-small, .ant-table-small.ant-table-bordered .ant-table-content, .ant-table-fixed, .ant-table-body table { border : 0px solid #096A87 !important; border-right : 0px !important; border-bottom: 0px !important; } .ant-table-fixed-right .ant-table-fixed { border-left : 0 !important; border-right: 0 !important; } .ant-table-thead>tr>th, .ant-table-tbody>tr>td { border-right : 0px solid #096A87 !important; border-bottom: 1px solid rgb(10,49,75) !important; } .ant-table-tbody>tr>td { color: @tableColor !important; } .ant-table-align-center, .ant-table-thead tr th { background: @tableheadBgColor !important; color : @tableheadColor !important; font-family: 'MyCustomFont3', sans-serif; font-size: 16px; } .ant-alert-info { background-color: #3D4145; border : none; color : @defaultWhiteColor; } .ant-alert-info>a { color: #00A2FF; } .ant-card-body { background-color: #8a8a8a4f; } .ant-layout-footer { background-color: #9494947e; } .ant-pagination { color: @defaultWhiteColor; } .layout .header, .sider.light .logo { background-color: transparent !important; } .table-page-search-wrapper { .ant-form-inline { .ant-form-item { display : flex; margin-bottom: 10px; margin-right : 0; .ant-form-item-control-wrapper { flex : 1 1; display : inline-block; vertical-align: middle; } >.ant-form-item-label { line-height : 32px; padding-right: 8px; width : auto; } .ant-form-item-control { height : 32px; line-height: 32px; } } } .table-page-search-submitButtons { display : block; margin-bottom: 0px; white-space : nowrap; } } .content { .table-operator { // position: absolute; // margin-bottom: 18px; // right: 10px; // top:30px; padding: 10px 0; text-align: right; button { margin: 0 8px 0 0; } } }