// 公共的mixin混入(可以把重复的样式封装为mixin 混入到复用的地方) // .iconBg(@width: 3rem, @height: 3rem, @bgUrl: 'icons.png') { // /*图片背景,大小作为参数传递,默认是30*30*/ // display: inline-block; // width: @width; // height: @height; // cursor: pointer; // background-image: url('../images/@{bgUrl}'); // background-color: transparent; // } .position(@position: static, @top: auto, @right: auto, @bottom: auto, @left: auto) { // 定位方式 position: @position; top: @top; right: @right; bottom: @bottom; left: @left; } .boxShadow(@color, @xWdh, @yWdh, @wdh) { box-shadow: @color @xWdh @yWdh @wdh; -webkit-box-shadow: @color @xWdh @yWdh @wdh; -moz-box-shadow: @color @xWdh @yWdh @wdh; } .link-colors(@normal: @black-color, @hover-color: @hover-color, @visited: @black-color) { /*a标签经过以及访问颜色变化混合器*/ color: @normal; &:hover { color: @hover-color; } &:visited { color: @visited; } } .rounded-corners(@border-radius: 5px, @border-radius1: @border-radius, @border-radius2: @border-radius, @border-radius3: @border-radius) { /*圆角兼容性*/ -moz-border-radius: @border-radius @border-radius1 @border-radius2 @border-radius3; -webkit-border-radius: @border-radius @border-radius1 @border-radius2 @border-radius3; border-radius: @border-radius @border-radius1 @border-radius2 @border-radius3; } // 线性渐变 .linearGradient(@point, @start, @stop) { background-color: @stop; background: linear-gradient(@point, @start, @stop); background: -moz-linear-gradient(@point, @start, @stop); background: -webkit-linear-gradient(@point, @start, @stop); } .transition-animation(@property: all, @duration: 0.2s, @timing-function: linear) { /*过渡动画*/ transition: @property @duration @timing-function; -webkit-transition: @property @duration @timing-function; -moz-transition: @property @duration @timing-function; } .borderStyle(@width: 1px, @style: solid, @color: @m-black16) { border: @width @style @color; } .resetElement(@border: 0, @background: transparent, @radius: 0) { border: @border; background-color: @background; border-radius: @radius; } /* 定制宽高按钮 */ .btn(@width: @width, @height: @height) { width: @width; height: @height; line-height: @height; cursor: pointer; } // flex弹性布局兼容性 .flex { display: -webkit-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */ display: -moz-box; /* Firefox 17- */ display: -webkit-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */ display: -moz-flex; /* Firefox 18+ */ display: -ms-flexbox; /* IE 10 */ display: flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */ } // 行内flex 弹性布局兼容性 .inlineflex { display: -webkit-inline-box; /* Chrome 4+, Safari 3.1, iOS Safari 3.2+ */ display: -moz-inline-box; /* Firefox 17- */ display: -webkit-inline-flex; /* Chrome 21+, Safari 6.1+, iOS Safari 7+, Opera 15/16 */ display: -moz-inline-flex; /* Firefox 18+ */ display: -ms-inline-flexbox; /* IE 10 */ display: inline-flex; /* Chrome 29+, Firefox 22+, IE 11+, Opera 12.1/17/18, Android 4.4+ */ } // 行内元素span强转块元素 .specailSpan(@width: 50%, @height: 2.6rem) { display: inline-block; text-align: center; float: left; width: @width; height: @height; line-height: @height; cursor: pointer; } .inputStyle(@height: 2.8rem, @fontSize: 1.3rem) { height: @height; line-height: @height; border-color: @money-border-color; color: @black-color; font-size: @fontSize; @if @skin =='black' { background-color: transparent; } @else if @skin =='white' { background-color: @white-color; } } .ellipse { // 一行显示,超过显示省略号 white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .nowrap { white-space: nowrap; } .dateInputStyle(@width: 12rem, @height: 2.2rem, @fontSize: 1.3rem) { width: @width; height: @height; line-height: @height; @if @skin =='black' { background-color: transparent; } @else if @skin =='white' { background-color: @white-color; } border-color: @money-border-color; font-size: @fontSize; } .submitBtnStyle(@width: 12rem, @height: 2.8rem, @fontSize: 1.4rem, @rounded: 2px) { width: @width; height: @height; line-height: @height; padding: 0; color: @white-color; background-color: @hover-color; border-color: @hover-color; font-size: @fontSize; .rounded-corners(@rounded); } .resetBtnStyle(@width: 7rem, @height: 2.2rem, @fontSize: 1.3rem, @rounded: 2px) { width: @width; height: @height; line-height: @height; padding: 0; color: @hover-color; background-color: transparent; border-color: @hover-color; font-size: @fontSize; .rounded-corners(@rounded); } .ant-input { &::placeholder { color: @m-grey10; } } .commonInput { background: @m-grey21; border: 1px solid @m-grey14; border-radius: 3px; color: @m-white1; .ant-input { color: @m-white1; background: transparent; } .ant-input-suffix { color: @m-grey41; margin-left: 0; position: absolute; right: 5px; } &:hover, &:focus { border-color: @m-blue10; } } .dialogTableInput { border: 0; margin-top: 5px; } .tableConditionInput { width: 140px; height: 30px; line-height: 30px; background: @m-grey9; .rounded-corners(3px); border: 0; color: @m-white1; font-size: 14px; } .tableConditionInput+.tableConditionInput { margin-left: 10px; } .ant-select-dropdown { background: @m-grey22; border: 1PX solid @m-grey23; box-shadow: 0px 10px 10px 0px @m-black18; border-radius: 5px; .ant-select-item { color: @m-grey1; } .ant-select-item-option-active, .ant-select-item-option-selected, .ant-select-item-option-hover { background: @m-blue0; color: @m-white8; } } .srcollYTable { .ant-table { width: 100%; table { border: 0; } .ant-table-thead { tr { box-shadow: 0px 1px 0px 0px @m-black17; th { line-height: 26px; background: @m-black34; padding-top: 0; padding-bottom: 0; color: @m-grey17; font-size: 14px; border-right: 1px solid @m-black9; border-bottom: 1px solid @m-black9; } } } .ant-table-tbody { tr { td { height: 30px; line-height: 30px; padding: 0 8px; border-right: 1px solid @m-black9; border-bottom: 1px solid @m-black9; font-size: 14px; color: @m-white1; } } tr.ant-table-expanded-row:hover { //tr.ant-table-expanded-row, td { background-color: @m-blue3; } } tr.ant-table-expanded-row { td { text-align: right; } } } .ant-table-placeholder { border: 0; background: @m-black2; min-height: 190px; } } .ant-table-row-expand-icon { border-color: @m-grey17; background-color: transparent; color: @m-grey17; } .operBtn.ant-btn { margin-top: 0; margin-bottom: 0; height: 26px; line-height: 26px; } } // 左边菜单展开后 表格展开行操作按钮显示在最右侧 .expandLeftTable { .ant-table { .ant-table-content { .ant-table-tbody { .ant-table-expanded-row { width: calc(100vw - 160px); } } } } } // 上面表格样式 .topTable { .ant-table { width: 100%; table { border: 0; } .ant-table-thead { tr { box-shadow: 0px 1px 0px 0px @m-black17; th { line-height: 34px; background: @m-black8; padding-top: 0; padding-bottom: 0; color: @m-grey17; font-size: 14px; border-right: 1px solid @m-black9; border-bottom: 1px solid @m-black9; // white-space: nowrap; // text-overflow: ellipsis; // overflow: hidden; } } } .ant-table-tbody { tr { td { height: 34px; line-height: 34px; padding: 0 8px; border-right: 1px solid @m-black9; border-bottom: 1px solid @m-black9; font-size: 16px; color: @m-white1; // white-space: nowrap; // text-overflow: ellipsis; // overflow: hidden; } } tr.ant-table-expanded-row:hover { //tr.ant-table-expanded-row, td { background-color: @m-blue3; } } tr.ant-table-expanded-row { td { text-align: right; } } } .ant-table-placeholder { border: 0; background: @m-black2; } } .ant-table-row-expand-icon { border-color: @m-grey17; background-color: transparent; color: @m-grey17; } .operBtn.ant-btn { margin-top: 0; margin-bottom: 0; height: 26px; line-height: 26px; } } // 展开行操作按钮显示问题 .topOrderTable { .ant-table { width: 100%; table { border: 0; } .ant-table-thead { tr { box-shadow: 0px 1px 0px 0px @m-black17; th { line-height: 34px; background: @m-black8; padding-top: 0; padding-bottom: 0; color: @m-grey17; font-size: 14px; border-right: 1px solid @m-black9; border-bottom: 1px solid @m-black9; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } } } .ant-table-tbody { tr { td { height: 34px; line-height: 34px; padding: 0 8px; border-right: 1px solid @m-black9; border-bottom: 1px solid @m-black9; font-size: 16px; color: @m-white1; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } } tr.ant-table-expanded-row:hover { //tr.ant-table-expanded-row, td { background-color: @m-blue3; } } tr.ant-table-expanded-row { td { text-align: right; } td:last-child { position: relative; .btn-list { position: absolute; left: calc(100vw - 530px); top: 4px; width: 300px; text-align: right; .operBtn.ant-btn { margin-top: 0; margin-bottom: 0; height: 26px; line-height: 26px; } } } } } .ant-table-placeholder { border: 0; background: @m-black2; } } .ant-table-row-expand-icon { border-color: @m-grey17; background-color: transparent; color: @m-grey17; } } // 折叠菜单后右侧表格中展开后操作按钮的位置 .collapsed { .topOrderTable { .ant-table { .ant-table-tbody { tr.ant-table-expanded-row { td:last-child { .btn-list { left: calc(100vw - 430px); } } } } } } } // 弹窗表格 .dialogTable { .ant-table { width: 100%; background: transparent; table { border: 1px solid @m-grey20; border-radius: 0; } .ant-table-thead { tr { box-shadow: 0px 1px 0px 0px @m-black17; th { line-height: 36px; background: @m-grey11; padding-top: 0; padding-bottom: 0; color: @m-grey2; font-size: 16px; border-right: 1px solid @m-grey20; border-bottom: 1px solid @m-grey20; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } } } .ant-table-tbody { tr { td { height: 36px; line-height: 36px; padding: 0 8px; border-right: 1px solid @m-grey20; border-bottom: 1px solid @m-grey20; font-size: 14px; color: @m-white1; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; background: @m-grey11; } } } .ant-table-placeholder { border: 0; background: @m-grey11; } } } .dialogTable2 { .ant-table { width: 100%; background: transparent; table { border: 1px solid @m-black44; border-right: none; border-bottom: none; border-radius: 0; } .ant-table-thead { tr { box-shadow: 0px 1px 0px 0px @m-black17; th { line-height: 36px; background: @m-grey61; padding-top: 0; padding-bottom: 0; color: @m-grey60; font-size: 16px; border-right: 1px solid @m-black44; border-bottom: 1px solid @m-black44; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } } } .ant-table-tbody { tr { td { height: 36px; line-height: 36px; padding: 0 8px; border-right: 1px solid @m-black44; border-bottom: 1px solid @m-black44; font-size: 14px; color: @m-white11; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; background: @m-grey62; } } } .ant-table-placeholder { border: 0; background: @m-grey11; } } } .ant-empty-normal { color: @m-grey17; } .ant-empty-img-simple-path, .ant-empty-img-simple-ellipse { fill: @m-grey17; } .ant-empty-img-simple-g { stroke: @m-grey17; } .ant-modal-wrap { overflow: hidden; } .add-custom, .commonModal { top: 0; max-height: 100%; padding-bottom: 0; .ant-modal-content { background: @m-grey11; border-radius: 5px; height: 100%; .ant-modal-close { .ant-modal-close-x { width: 40px; height: 40px; line-height: 40px; .ant-modal-close-icon { color: @m-blue11; } } } .ant-modal-header { height: 40px; background: linear-gradient(0deg, @m-blue4, @m-blue5); border-radius: 5px; padding: 0; text-align: center; border-bottom: 0; .ant-modal-title { line-height: 40px; font-size: 16px; color: @m-white0; } } .ant-modal-body { min-height: 380px; max-height: calc(100vh - 115px); overflow-y: auto; } .ant-modal-footer { border-top: 0; text-align: center; padding-bottom: 31px; height: 75px; .ant-btn-primary { width: 200px; height: 34px; line-height: 32px; border: 0; background: linear-gradient(0deg, @m-blue8 0%, @m-blue9 100%); border-radius: 3px; font-size: 16px; color: @m-white0; &:hover { background: linear-gradient(0deg, @m-blue8-hover 0%, @m-blue9-hover 100%); color: @m-white0-hover; } } .ant-btn.cancelBtn { width: 200px; height: 34px; line-height: 32px; border: 1px solid @m-blue10; border-radius: 3px; background: transparent; font-size: 16px; color: @m-blue10; margin-right: 20px; &:hover { border-color: @m-blue10-hover; } } } } } .ant-form.inlineForm { .ant-row.ant-form-item { margin-bottom: 21px; .ant-form-item-label { position: relative; width: 130px; line-height: 30px; text-align: left; label { color: @m-grey1; padding-left: 16px; &::after { content: '' } &::before { .position(absolute, 0, auto, auto, 0); font-size: 16px; line-height: 21px; color: @m-red1; } label { padding-left: 0; } } } .ant-form-item-control-wrapper { .ant-form-item-control { line-height: 30px; } } } .relative.ant-form-item { position: relative; // .itemTip { // position: absolute; // color: @m-grey1; // } .tip { position: absolute; font-size: 14px; color: @m-grey41; width: 100%; top: calc(100% + 5px); // div:nth-child(2){ // margin-top: -10px; // } } .ant-form-item-control { width: 200px; .unit { float: right; color: @m-grey41; } .backUnit { position: absolute; right: -20px; top: -7px; line-height: 32px; height: 32px; color: @m-grey2; } } } .tc.ant-form-item { .ant-form-item-control-wrapper { margin: 0 auto; } } .pl40.ant-form-item { .ant-form-item-label { label { padding-left: 40px; } } } } .ant-form.dialogForm { height: 100%; .ant-row.ant-form-item { .ant-form-item-label { width: 70px; label { padding-left: 0; &::before { display: none; } } } .ant-form-item-control-wrapper { width: calc(100% - 70px); } } .btnCenter.ant-form-item { width: 100%; .ant-form-item-label { width: 0; } .ant-form-item-control-wrapper { width: 100%; text-align: center; } } } .ant-select-single { .ant-select-selector { height: 30px; padding: 0 8px; background: @m-grey21; border: 1px solid @m-blue10; border-radius: 3px; color: @m-white1; } .ant-select-arrow { right: 8px; color: @m-grey1; } } .inlineFormSelect.ant-select-single { .rounded-corners(3px); border: 1px solid @m-grey14; &:hover, &:focus { border-color: @m-blue10; } .ant-select-selector { height: 30px; padding: 0 8px; background: @m-grey21; border: 0; color: @m-white1; .ant-select-selection-placeholder { color: @m-grey10; } } .ant-select-arrow { right: 8px; color: @m-blue0 !important; } } .dialogTableSelect.ant-select-single { margin-top: 5px; border: 0; } .shortSelect.ant-select-single:extend(.inlineFormSelect.ant-select-single) { margin-right: 0; .ant-select-selector { padding: 0 5px; .ant-select-selection-item { padding-right: 14px; } } } .typeSelect.ant-select-single { .rounded-corners(3px); border: 1px solid @m-grey14; &:hover, &:focus { border-color: @m-blue10; } .ant-select-selector { height: 30px; padding: 0 8px; background: @m-grey21; border: 0; color: @m-white1; .ant-select-selection-placeholder { color: @m-grey10; } } .ant-select-arrow { right: 8px; color: @m-blue0; } } .input-enumdicname { color: @m-grey41; font-size: 14px; position: absolute; right: 5px; } .input-enumdicname-absolute { position: absolute; top: -8px; right: -78px; color: @m-grey41; margin-left: 5px; font-size: 14px; display: inline-block; min-width: 100px; } .dialogInput { background: @m-grey21; border: 1px solid @m-grey14; border-radius: 3px; color: @m-white1; .ant-input { color: @m-white1; background: transparent } .ant-input-suffix { color: @m-white1; } .ant-input-suffix { .ant-input-password-icon { color: @m-white1; } } &:hover, &:focus { border-color: @m-blue10; } } .yellowInput { .ant-input, .ant-input-number-input { color: @m-yellow1; font-size: 16px; text-align: center; } } .suffixGrey { .ant-input-suffix { color: @m-grey2; } } .dialogInput34.ant-input-number { position: relative; height: 34px; .ant-input-number-input { height: 34px; line-height: 34px; font-size: 16px; color: @m-white6; text-align: center; padding: 0 26px; } } .dialogInput34.ant-input-number-disabled { background: @m-grey52; .ant-input-number-input { color: @m-grey51; } } .block { display: block; } .formFieldSet { border: 1PX solid @m-grey19; padding: 0 20px 20px; legend { color: @m-white0; } } .formFieldSet+.formFieldSet { margin-top: 35px; } .ant-form { legend { width: auto; margin-left: 20px; font-size: 16px; color: @m-white0; border-bottom: 0; padding: 0 10px; } } .paddingDialog, .fieldsetDialog { .formFieldSet { legend { width: auto; margin-left: 20px; font-size: 16px; color: @m-white0; border-bottom: 0; padding: 0 10px; } } } .paddingDialog { .ant-modal-content { .ant-modal-body { padding: 24px; } } } // 上传 .upload { display: inline-flex; .ant-btn.uploadBtn { width: 60px; height: 30px; background: @m-blue0; border: 0; padding: 0; text-align: center; font-size: 14px; color: @m-white0; .rounded-corners(3px); &:hover { background: @m-blue0-hover; color: @m-white0-hover; } } .ant-upload-list-item-info { .anticon-loading, .anticon-paper-clip { color: @m-white0; } .ant-upload-list-item-name { color: @m-white0; } .ant-upload-list-item-card-actions { .anticon { color: @m-white0; } } &:hover { background: transparent; .anticon-loading, .anticon-paper-clip { color: @m-blue0; } .ant-upload-list-item-name { color: @m-blue0; } .ant-upload-list-item-card-actions { .anticon { color: @m-blue0; } } } } .look { color: @m-blue0; font-size: 14px; margin-left: 10px; cursor: pointer; } } .fl { float: left; } .fr { float: right; } .ml8 { margin-left: 8px; } .ml10 { margin-left: 10px; } .ml15 { margin-left: 15px; } .ml20 { margin-left: 20px; } .ml35 { margin-left: 35px; } .ml9 { margin-left: 9px; } .ml5 { margin-left: 5px; } .mt5 { margin-top: 5px; } .mt10 { margin-top: 10px; } .mt20 { margin-top: 20px; } .mt25 { margin-top: 25px; } .mt30 { margin-top: 30px; } .mb40 { margin-bottom: 40px !important; } .mr10 { margin-right: 10px; } .red { color: @m-red0; } .red1 { color: @m-red1; } .grey { color: @m-grey2; } .grey1 { color: @m-grey1; } .white { color: @m-white6; } .blue { color: @m-blue0; } .green { color: @m-green0; } .yellow { color: @m-yellow0; } .orange { color: @m-orange0; } .selectBtn.ant-btn, .operBtn.ant-btn { margin-left: 10px; width: 80px; height: 28px; line-height: 29px; text-align: center; background: linear-gradient(0deg, @m-grey39 0%, @m-grey40 98%); border: 0; color: @m-white0; font-size: 14px; .rounded-corners(3px); &:hover, &:focus, &:active, &::after { background: linear-gradient(0deg, @m-grey39-hover 0%, @m-grey40-hover 98%); color: @m-white0-hover; border: 0; } } .operBtn.ant-btn { background: linear-gradient(0deg, @m-blue6 0%, @m-blue7 99%); &:hover, &:focus, &:active, &::after { background: linear-gradient(0deg, @m-blue6-hover 0%, @m-blue7-hover 99%); color: @m-white0-hover; border: 0; } } .ant-btn.historyBtn { margin-left: 10px; .rounded-corners(3px); height: 28px; border-color: @m-blue29; background: @m-blue30; color: @m-grey43; .anticon { color: @m-grey44; } &:hover, &:focus, &:active, &::after { border-color: @m-blue29-hover; background: @m-blue30-hover; color: @m-grey43-hover; .antion { color: @m-grey44-hover; } } } // .ant-input-affix-wrapper:focus, .ant-btn:focus { // box-shadow: none; // } .btnPrimary.ant-btn, .operBtn.ant-btn { margin-left: 10px; width: auto; min-width: 80px; height: 28px; line-height: 31px; text-align: center; background: linear-gradient(0deg, @m-blue6 0%, @m-blue7 99%); border: 0; color: @m-white0; font-size: 14px; .rounded-corners(3px); &:hover, &:focus { background: linear-gradient(0deg, @m-blue6-hover 0%, @m-blue7-hover 99%); color: @m-white0-hover; border: 0; } } // .operBtn.ant-btn { // margin-top: 9px; // margin-bottom: 6px; // } .ant-table-expanded-row { .btn-list { padding-right: 10px; text-align: right; } .btnPrimary.ant-btn { width: 80px; height: 26px; line-height: 27px; border: 0; background: linear-gradient(0deg, @m-blue2, @m-blue0); box-shadow: -1px 0px 0px 0px @m-black10; .rounded-corners(3px); &:hover, &:focus { background: linear-gradient(0deg, @m-blue2-hover 0%, @m-blue0-hover 99%); color: @m-white0-hover; border: 0; } } .ant-btn+.ant-btn { margin-left: 10px; } } .btnDanger.ant-btn { margin-left: 10px; width: 80px; height: 26px; line-height: 27px; text-align: center; border: 0; color: @m-white0; font-size: 14px; background: linear-gradient(0deg, @m-red9 0%, @m-red10 99%); .rounded-corners(3px); &:hover, &:focus { background: linear-gradient(0deg, @m-red9-hover 0%, @m-red10-hover 99%); color: @m-white0-hover; border: 0; } } .btnDeafault.ant-btn { margin-left: 10px; width: 80px; height: 26px; line-height: 27px; text-align: center; border: 0; color: @m-white0; font-size: 14px; background: linear-gradient(0deg, @m-grey12 0%, @m-grey13 100%); .rounded-corners(3px); &:hover, &:focus { background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 99%); color: @m-white0-hover; border: 0; } } // .hiddenFirstCol { // .ant-table { // .ant-table-content { // .ant-table-scroll { // .ant-table-hide-scrollbar { // .ant-table-fixed { // .ant-table-thead { // .ant-table-expand-icon-th { // width: 0 !important; // } // } // } // } // } // .ant-table-body { // table { // .ant-table-thead { // .ant-table-expand-icon-th { // width: 0 !important; // } // } // .ant-table-tbody { // .ant-table-row { // .ant-table-row-expand-icon-cell { // width: 0 !important; // } // } // tr.ant-table-expanded-row { // td:first-child { // width: 0 !important; // } // } // } // } // } // } // } // } .to { font-size: 14px; color: @m-grey2; margin-left: -8px; margin-right: 2px; } .filterTable { display: inline-flex; width: calc(100% - 3px); padding-left: 3px; background: @m-black35; } .ant-row.dialogRowTitle { margin-left: 0 !important; margin-right: 0 !important; border: 1px solid @m-grey20; .ant-col { border-top: 1px solid @m-grey20; border-right: 1px solid @m-grey20; padding-left: 0 !important; padding-right: 0 !important; height: 34px; line-height: 34px; font-size: 16px; color: @m-grey2; .red { color: @m-red1; } } .ant-col:nth-child(1), .ant-col:nth-child(2), .ant-col:nth-child(3), .ant-col:nth-child(4) { border-top: 0; text-align: center; } .ant-col:last-child { border-right: 1px solid @m-grey20; } .bt1 { border-top: 1px solid @m-grey20 !important; } } // 日期输入框 @m-grey21 .commonPicker.ant-calendar-picker { .ant-input { background: @m-grey21; border-color: @m-grey14; padding: 4px 8px; .rounded-corners(3px); .ant-calendar-range-picker-input { color: @m-white0; font-size: 14px; &::placeholder { color: @m-grey10; } } .ant-calendar-picker-clear { background: @m-white0; } .ant-calendar-range-picker-separator { font-size: 14px; color: @m-grey2; } } } // 日期输入框 .commonDatePicker.ant-calendar-picker { .ant-input { background: @m-grey21; padding: 0 8px; height: 30px; line-height: 30px; color: @m-white1; border: 1PX solid @m-grey14; .rounded-corners(3px); } .ant-calendar-picker-icon { color: @m-grey1; } .ant-calendar-picker-clear { display: none; background: transparent; color: @m-grey1; svg { fill: @m-grey1; } } } .conditionPicker.ant-calendar-picker { .ant-input { border: 0; } &:focus { .ant-input { border: 0; } } } .ant-popover { .ant-popover-content { border: 1px solid @m-grey23; box-shadow: 0px 10px 10px 0px @m-boxShadow; .rounded-corners(5px); .ant-popover-arrow { border-top-color: @m-grey22; border-left-color: @m-grey22; background: @m-grey22; border: 1PX solid @m-grey23; border-bottom: 0; border-right: 0; } .ant-popover-inner { .ant-popover-inner-content { border-image-width: 0; background: @m-grey22; color: @m-grey1; padding: 5px 0; .popItem { min-width: 160px; padding: 0 15px; text-align: center; cursor: pointer; height: 30px; line-height: 30px; font-size: 15px; &:hover { color: @m-white8; background: @m-blue0; } } } } } } .ant-calendar-picker-container { .ant-calendar-range, .ant-calendar { background: @m-grey22; border-color: @m-grey22; .ant-calendar-panel { .ant-calendar-input-wrap { border-bottom-color: @m-grey23; .ant-calendar-input { background: transparent; border: 1px solid @m-grey42; color: @m-white0; &::placeholder { color: @m-grey1; } } } .ant-calendar-date-panel { // .ant-calendar-range-part { .ant-calendar-header { border-color: @m-grey42; .ant-calendar-prev-year-btn, .ant-calendar-prev-month-btn { color: @m-grey1; &::before, &::after { border-color: @m-grey2; } } .ant-calendar-month-select, .ant-calendar-year-select { color: @m-grey1; } } .ant-calendar-body { border-top-color: @m-grey42; .ant-calendar-column-header-inner { color: @m-grey1; } .ant-calendar-cell { .ant-calendar-date { background: transparent; color: @m-white6; } &:hover { .ant-calendar-date { color: @m-blue0; } } } .ant-calendar-last-day-of-month, .ant-calendar-next-month-btn-day { .ant-calendar-date { color: @m-white1; } } .ant-calendar-disabled-cell { .ant-calendar-date { color: @m-grey1; } } .ant-calendar-selected-day { .ant-calendar-date { color: @m-blue0; } } .ant-calendar-active-week { .ant-calendar-cell { .ant-calendar-date { background: transparent; } } } // } } .ant-calendar-range-middle { color: @m-white1; } } } .ant-calendar-footer { border-top-color: @m-grey42; .ant-calendar-time-picker-btn { color: @m-grey1; } .ant-calendar-ok-btn { background-color: @m-blue0; border-color: @m-blue0; color: @m-white0; &:hover { background-color: @m-blue0-hover; border-color: @m-blue0-hover; color: @m-white0-hover; } } } } .ant-calendar-month-calendar { .ant-calendar-month-calendar-content { .ant-calendar-month-header-wrap { .ant-calendar-header { .ant-calendar-prev-year-btn, .ant-calendar-prev-month-btn { color: @m-grey1; &::before, &::after { border-color: @m-grey2; } } .ant-calendar-month-panel-year-select { color: @m-grey1; } } .ant-calendar-month-panel-body { .ant-calendar-month-panel-table { .ant-calendar-month-panel-tbody { .ant-calendar-month-panel-cell { .ant-calendar-month-panel-month { color: @m-white1; &:hover { background: transparent; color: @m-blue0; } } } } } } } } .ant-calendar-month-panel { background: @m-grey22; border-color: @m-grey22; .ant-calendar-month-panel-header { border-color: @m-grey1; } } } } .ant-calendar-range { .ant-calendar-in-range-cell::before { background: @m-grey22-hover; } } .has-error .ant-input:not(.has-error .ant-input-disabled), -has-error .ant-input:not(.has-error .ant-input-disabled), .has-error .ant-input:not(-has-error .ant-input-disabled), -has-error .ant-input:not(-has-error .ant-input-disabled) { background: @m-grey21; } .ant-modal-confirm-confirm { top: 50%; padding-bottom: 0; width: 300px !important; height: 200px; margin-top: -100px; .ant-modal-content { background: @m-black27; height: 100%; .rounded-corners(10px); .ant-modal-close { .ant-modal-close-x { width: 40px; height: 40px; line-height: 40px; .ant-modal-close-icon { color: @m-blue11; } } } .ant-modal-body { padding: 20px; .ant-modal-confirm-body-wrapper { .ant-modal-confirm-body { .ant-modal-confirm-title { color: @m-blue0; text-align: center; font-size: 20px; } .ant-modal-confirm-content { color: @m-white0; font-size: 16px; margin-top: 25px; text-align: center; } } .ant-modal-confirm-btns { float: none; text-align: center; margin-top: 20px; .ant-btn { width: 120px; height: 30px; line-height: 28px; border-radius: 3px; background: linear-gradient(0deg, @m-grey12 0%, @m-grey13 100%); font-size: 16px; color: @m-white0; margin-right: 20px; border: 0; &:hover { background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%); color: @m-white0-hover; } } .ant-btn-primary { width: 120px; height: 30px; line-height: 28px; border: 0; background: linear-gradient(0deg, @m-blue2 0%, @m-blue0 100%); border-radius: 3px; font-size: 16px; color: @m-white0; margin-right: 0; margin-left: 0; &:hover { background: linear-gradient(0deg, @m-blue2-hover 0%, @m-blue0-hover 100%); color: @m-white0-hover; } } } } } } } .tltLeft { font-size: 16px; text-align: left; .icon { font-size: 20px; fill: @m-blue0; margin-right: 10px; } } .ant-collapse.spotCollapse.ant-collapse-borderless { margin-top: 10px; background-color: transparent; .ant-collapse-item { border-bottom: 0; .ant-collapse-header { color: @m-grey17; font-size: 14px; border-bottom: 1px solid @m-grey18; padding: 10px 8px 10px 44px; height: 43px; .ant-collapse-arrow { fill: @m-grey17; width: 16px; height: 16px; font-size: 16px; left: 0; } } .ant-collapse-content { .ant-collapse-content-box { padding: 0 0 0 30px; background-color: transparent; .ant-row.contRow { width: 100%; height: 40px; line-height: 40px; font-size: 16px; color: @m-white1; margin-bottom: 10px; background: @m-black15; border: 1px solid @m-blue3; border-radius: 3px; padding-left: 14px; padding-right: 12px; .ant-col:last-child { text-align: right; } .ant-col:first-child { text-align: left; } } .contRow:first-child { margin-top: 9px; } .contRow:last-child { margin-bottom: 20px; } } } } } .ant-collapse.busyCollapse.ant-collapse-borderless { margin-top: 10px; background: @m-black15; border: 1px solid @m-blue3; .rounded-corners(3px); .ant-collapse-item { border-bottom: 0; .ant-collapse-header { color: @m-grey17; font-size: 14px; border-bottom: 0; padding: 0; line-height: 43px; .ant-collapse-arrow { fill: @m-grey17; width: 16px; height: 16px; font-size: 16px; left: 0; } .ant-row.contRow { width: 100%; // height: 40px; line-height: 40px; font-size: 16px; color: @m-white1; margin-bottom: 10px; // background: @m-black15; border: 0 !important; // border-radius: 3px; padding-left: 14px; padding-right: 12px; .ant-col:last-child { text-align: right; } .ant-col:first-child { text-align: left; } } .contRow:first-child { margin-top: 0 !important; } .contRow:last-child { margin-bottom: 0 !important; } } .ant-collapse-content { .ant-collapse-content-box { padding: 0 0 0 30px; background-color: transparent; .btn-list { width: calc(100% - 10px); justify-content: flex-end; padding-right: 10px; padding-bottom: 10px; } } } } } .ant-row.headRow { .ant-col:first-child { text-align: left; } .ant-col:nth-child(3) { text-align: right; } } .ant-collapse.futureCollapse.ant-collapse-borderless { background: transparent; .ant-collapse-item { margin-top: 10px; background: @m-black15; border: 1px solid @m-blue3; .rounded-corners(3px); .ant-collapse-header { color: @m-grey17; font-size: 14px; border-bottom: 0; padding: 0; line-height: 43px; .ant-collapse-arrow { fill: @m-grey17; width: 16px; height: 16px; font-size: 16px; left: 0; } .ant-row.contRow { width: 100%; // height: 40px; line-height: 40px; font-size: 16px; color: @m-white1; margin-bottom: 10px; // background: @m-black15; border: 0 !important; // border-radius: 3px; padding-left: 14px; padding-right: 12px; .ant-col:last-child { text-align: right; } .ant-col:first-child { text-align: left; } } .contRow:first-child { margin-top: 0 !important; } .contRow:last-child { margin-bottom: 0 !important; } } .ant-collapse-content { .ant-collapse-content-box { padding: 0 0 0 30px; background-color: transparent; .btn-list { width: calc(100% - 10px); justify-content: flex-end; padding-right: 10px; padding-bottom: 10px; .operBtn.ant-btn { margin-top: 0; margin-bottom: 0; height: 26px; line-height: 26px; } } } } } } // 输入框自动填充背景色和字体颜色 input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill, .dialogInput:-webkit-autofill { box-shadow: inset 0 0 0 1000px @m-grey21; -webkit-text-fill-color: @m-white1; } .dialogSpan { color: @m-white1; } input:-internal-autofill-selected { background-color: @m-grey21 !important; } .login { input:-webkit-autofill { box-shadow: inset 0 0 0 1000px @m-white0; } } .ant-checkbox-group.commonCheckboxGroup { width: 100%; .ant-checkbox-wrapper { color: @m-white0; font-size: 14px; .ant-checkbox { margin-right: 2px; .ant-checkbox-inner { background: @m-grey21; border: 1px solid @m-grey14; border-radius: 3px; } } .ant-checkbox.ant-checkbox-checked { .ant-checkbox-inner { &::after { border-color: @m-blue0; } } &::after { border-color: @m-blue0; } } span+span { margin-right: 15px; color: @m-white0; font-size: 14px; } } .ant-checkbox-wrapper-disabled { .ant-checkbox-disabled { outline-color: @m-grey14; .ant-checkbox-input { color: @m-white0; font-size: 14px; } .ant-checkbox-inner { border-color: @m-grey14 !important; } } } } .commonRadioGroup { .ant-radio-wrapper { color: @m-white0; font-size: 14px; .ant-radio { .ant-radio-inner { border-color: @m-blue0; background: @m-grey21; &::after { left: 4px; top: 4px; width: 6px; height: 6px; background: @m-blue0; border-radius: 50%; } } } } .ant-radio-wrapper-disabled { .ant-radio-disabled { .ant-radio-inner { border-color: @m-blue0 !important; background: @m-grey21; &::after { left: 4px; top: 4px; width: 6px; height: 6px; background: @m-blue0; border-radius: 50%; } } } span+span { color: @m-white0; font-size: 14px; } } } .tc { text-align: center; } .checkboxGroupItem { .ant-col.ant-form-item-control-wrapper { max-width: calc(100% - 130px); } } .ant-spin-container::after, .ant-drawer-content { background-color: transparent; } .ant-layout-sider-has-trigger { padding-bottom: 40px; } // 弹窗中表格内容居中 .tableContextCenter { .dialogTable { .ant-table-thead { tr { th { text-align: center; } } } .ant-table-tbody { tr { td { text-align: center; } } } } } .filter-check { >span { &:nth-of-type(2) { color: @m-grey2; height: 30px; line-height: 30px; } } } .topTableHeight { height: calc(100% - 28px); } .topTableHeight40 { height: calc(100% - 35px); } // 折叠底部上面左边菜单高度 .hiddenBottomLayout .layout-top .middleLayout .m-layout-left .ant-layout-sider-children ul.ant-menu.ant-menu-inline.left-menu { height: calc(100vh - 126px); } // 买卖大厅 .buy-sell-market { width: 100%; height: 100%; position: absolute; z-index: 9; left: 0; top: 0; background-color: @m-black1; .buy-sell-market-title { width: 100%; height: 40px; background: @m-black1; display: inline-flex; font-size: 14px; position: relative; line-height: 40px; border-bottom: 1PX solid @m-blue0; padding-bottom: 2px; div { align-self: center; align-items: center; // height: 40px; // line-height: 40px; } .backIcon { width: 52px; line-height: 40px; } .titleBtn { min-width: 90px; height: 32px; display: inline-flex; .name { background: @m-blue12; text-align: center; flex: 1; padding: 0 16px; .rounded-corners(3px, 0, 0, 3px); color: @m-white9; height: 32px; line-height: 32px; font-size: 14px; } .arrowRightIcon, .arrowLeftIcon { width: 12px; height: 32px; background-image: @m-arrowRight; background-position: 0 0; background-repeat: no-repeat; } .arrowLeftIcon { background-position: -12px 0; } } .titleBtn2 { .name { .rounded-corners(0); } } .titleBtn3 { position: relative; .name { .rounded-corners(0, 5px, 5px, 0); } margin-right: 20px; .anticon { font-size: 16px; color: @m-grey1; .position(absolute, auto, 16px, 0, auto); line-height: 28px; z-index: 2; } } .numBlock { display: inline-flex; white-space: nowrap; text-align: left; min-width: 80px; margin-left: 15px; .first { font-size: 14px; } .last { font-size: 14px; margin-left: 10px; } } .numBlock+.numBlock { margin-left: 25px; } .market { margin-left: 28px; min-width: 160px; height: 40px; display: inline-flex; background: @m-blue3; border: 1px solid @m-blue13; .rounded-corners(3px); color: @m-grey2; padding: 0 14px; >div { align-self: center; align-items: center; } .first { font-size: 14px; } .last { font-size: 18px; margin-left: 10px; margin-right: 10px; } .red { color: @m-red1; } } .ant-btn { align-items: center; align-self: center; } .publishBuy.ant-btn { min-width: 80px; height: 30px; line-height: 30px; background: linear-gradient(0deg, @m-blue2, @m-blue0); .rounded-corners(3px); font-size: 14px; color: @m-white0; text-align: center; border: none; margin-left: 10px; &:hover { background: linear-gradient(0deg, @m-blue2-hover, @m-blue0-hover); color: @m-white0-hover; } } .detailBtn.ant-btn { min-width: 80px; height: 30px; line-height: 30px; background: linear-gradient(0deg, @m-grey12 0%, @m-grey13 100%); .rounded-corners(3px); font-size: 14px; color: @m-white0; text-align: center; border: none; &:hover { background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%); color: @m-white0-hover; } } .ant-btn+.ant-btn { margin-left: 10px; } .btn-list { position: absolute; right: 10px; .operBtn.ant-btn { margin-top: 0; margin-bottom: 0; } } } } .bdf1 { border-left: 1PX solid @m-grey31; } // 上半部分表格高度 .topTableHeight { .srcollYTable { .ant-table { .ant-table-body { min-height: calc(100vh - 378px); max-height: calc(100vh - 378px); background: @m-black2; } .ant-table-placeholder { height: calc(100vh - 378px); .ant-empty.ant-empty-normal { margin: 0; } } } } .srcollYTableNoBottom { .ant-table { .ant-table-body { min-height: calc(100vh - 138px); max-height: calc(100vh - 138px); } .ant-table-placeholder { height: calc(100vh - 138px); } } } .noPlaceHolder { .ant-table-placeholder { display: none; } } .hasPlaceHolder { .ant-table-placeholder { .position(absolute, 28px, auto, auto, 50%); margin-left: -56px; } } } // 下半部分表格高度 .layout-bottom { .srcollYTable { .ant-table { .ant-table-tbody { min-height: 190px; background: @m-black33; } } } } // 上半部分表格带二级tab筛选 .topTableHeight { .secondTabTable { .ant-table { .ant-table-body { min-height: calc(100vh - 407px); max-height: calc(100vh - 407px); background: @m-black2; } .ant-table-placeholder { height: calc(100vh - 407px); } } } .secondTabTableNoBottom { .ant-table { .ant-table-body { min-height: calc(100vh - 167px); max-height: calc(100vh - 167px); background: @m-black2; } .ant-table-placeholder { height: calc(100vh - 167px); } } } } // 上半部分表格带二级tab筛选带筛选条件 .topTableHeight { .condSecondTabTable { .ant-table { .ant-table-body { min-height: calc(100vh - 443px); max-height: calc(100vh - 443px); background: @m-black2; } .ant-table-placeholder { height: calc(100vh - 443px); } } } .condSecondTabTableNoBottom { .ant-table { .ant-table-body { min-height: calc(100vh - 196px); max-height: calc(100vh - 196px); background: @m-black2; } .ant-table-placeholder { height: calc(100vh - 196px); } } } .condSecondTabTableHalfTop { .ant-table { .ant-table-body { min-height: calc((100vh - 443px)/2 - 13px); max-height: calc((100vh - 443px)/2 - 13px); background: @m-black2; } .ant-table-thead { tr { th { background: @m-green1; color: @m-grey17; } } } .ant-table-placeholder { height: calc((100vh - 443px)/2 - 13px); } } } .halfBottom { .ant-table { .ant-table-thead { tr { th { background: @m-red2; } } } } } .condSecondTabTableHalfTopNoBottom { .ant-table { .ant-table-body { min-height: calc((100vh - 196px)/2 - 16px); max-height: calc((100vh - 196px)/2 - 16px); background: @m-black2; } .ant-table-placeholder { height: calc((100vh - 196px)/2 - 16px); } } } } // 买卖大厅表格 .buyHallTable, .sellHallTable { .ant-table-fixed-header>.ant-table-content>.ant-table-scroll>.ant-table-body { background: transparent; } .ant-table { width: 100%; table { border: 0; } .ant-table-content { background-image: linear-gradient(90deg, @m-black34 60px, @m-red2 0); } .ant-table-thead { tr { box-shadow: 0px 1px 0px 0px @m-black17; th { line-height: 26px; background: @m-black34; padding-top: 0; padding-bottom: 0; color: @m-grey17; font-size: 14px; border-right: 1px solid @m-black10; border-bottom: 1px solid @m-black10; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } } } .ant-table-tbody { tr { td { height: 30px; line-height: 30px; padding: 0 8px; border-right: 1px solid @m-black10; border-bottom: 1px solid @m-black10; font-size: 14px; color: @m-grey17; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } td:first-child { background: @m-black34; color: @m-grey17; min-width: 61px; } td:not(:first-child :nth-child(1)) { background: @m-red2; color: @m-white1; } } tr.ant-table-expanded-row, tr.ant-table-expanded-row:hover { td { background-color: @m-black2; } } tr.ant-table-expanded-row { td { text-align: right; } } tr:hover { td { background-color: @m-blue3 !important; } } } .ant-table-placeholder { border: 0; background: @m-black2; } } .ant-table-row-expand-icon { border-color: @m-grey17; background-color: transparent; color: @m-grey17; } } .sellHallTable { .ant-table { .ant-table-content { background-image: linear-gradient(90deg, @m-black34 60px, @m-green1 0); } .ant-table-tbody { tr { td:first-child { // background: @m-black34; color: @m-grey17; } td:not(:first-child :nth-child(1)) { background: @m-green1; } } } } } .sellHallTable .ant-table .ant-table-tbody tr td:not(:first-child), .buyHallTable .ant-table .ant-table-tbody tr td:not(:first-child) { background-color: @m-black2; } .buyHallTable, .sellHallTable { .ant-table-fixed-header>.ant-table-content>.ant-table-scroll>.ant-table-body { min-height: calc(100vh - 378px); max-height: calc(100vh - 378px); } .ant-table { .ant-table-tbody { min-height: calc(100vh - 378px); max-height: calc(100vh - 378px); } } } .noDataTable { .ant-table { .ant-table-header { // height: 35px; margin-bottom: 0 !important; overflow: hidden !important; } } } // 没有底部时买卖大厅表格高度 .buyHallTableHigh, .sellHallTableHigh { .ant-table-fixed-header>.ant-table-content>.ant-table-scroll>.ant-table-body { min-height: calc(100vh - 135px); max-height: calc(100vh - 135px); } .ant-table { .ant-table-tbody { min-height: calc(100vh - 135px); max-height: calc(100vh - 135px); } } } // 表单里面的内容 .formBar { width: 100%; flex: 1; padding: 28px 16px 0; max-height: calc(100% - 70px); overflow-y: auto; overflow-x: hidden; ::v-deep.formProgress { width: 140px; // height: 3px; // .rounded-corners(2px); margin-left: 70px; .ant-progress-outer { margin-right: 0; padding-right: 0; .ant-progress-inner { background: @m-grey14; .rounded-corners(2px); .ant-progress-bg { height: 3px !important; border-radius: 2px !important; background-color: @m-blue0; } } } .ant-progress-text { display: none; } } .listedBtn { width: 120px; height: 30px; line-height: 30px; background: linear-gradient(0deg, @m-blue2 0%, @m-blue0 100%); border-radius: 3px; color: @m-white0; font-size: 14px; text-align: center; border: 0; &:hover { background: linear-gradient(0deg, @m-blue0-hover 0%, @m-blue2-hover 100%); color: @m-white0-hover; } } .cancelBtn:extend(.listedBtn) { background: linear-gradient(0deg, @m-grey12 0%, @m-grey13 100%); &:hover { background: linear-gradient(0deg, @m-grey12-hover 0%, @m-grey13-hover 100%); color: @m-white0-hover; } } } .fixedBtns { .position(absolute, auto, 0, 9px, 0); z-index: 2; } .c_c_s_s { .fixedBtns { left: 8px; right: 8px; padding-top: 18px; background: @m-black40; } } .ant-slider.formSlider { width: 140px; margin-left: 70px; .ant-slider-rail { margin-right: 0; padding-right: 0; height: 3px !important; border-radius: 2px !important; background-color: @m-blue14; } .ant-slider-track { height: 3px; background-color: @m-blue0; } .ant-slider-step { height: 3px; } .ant-progress-text { display: none; } } // 暂无数据 .noData { width: 80px; height: 80px; background: @m-nodata center center no-repeat; background-size: cover; } .ant-empty.ant-empty-normal { .ant-empty-image { width: 80px; height: 80px; background: @m-nodata center center no-repeat; background-size: cover; .ant-empty-img-simple { display: none; } } .ant-empty-description { display: none; } } // 底部表格行背景色 .layout-bottom { .srcollYTable { .ant-table { .ant-table-tbody { tr { td { background: @m-black33; } } } .ant-table-placeholder { border-top: 1PX solid @m-black9; background: @m-black33; } } } } // 仓单预售查询条件 日期到月份 .conditionPicker.ant-calendar-picker { .ant-input { width: 90px; background: transparent; font-size: 14px; color: @m-white6; } .ant-calendar-picker-icon { display: none; } } // 表格按钮列表固定在右边 .btn-list-sticky { position: sticky; position: -webkit-sticky; right: 2px; } // 步骤条 .commonSteps { .ant-steps-item { .block { display: inline-flex; } .ant-steps-item-tail { left: 9.5px !important; padding: 30px 0 0 0 !important; } .ant-steps-item-icon { margin-top: 5px; width: 20px; height: 20px; background: @m-grey11; border-color: @m-blue24; .ant-steps-icon { font-size: 12px; line-height: 20px; top: -9px; } } .ant-steps-item-content { min-height: 60px; } .line { width: 280px; height: 30px; background: @m-blue17; .rounded-corners(3px); display: inline-flex; position: relative; .num { width: 30px; height: 30px; background: @m-blue0; .rounded-corners(3px); text-align: center; line-height: 30px; font-size: 14px; color: @m-white0; } .desc { flex: 1; padding-left: 14px; font-size: 16px; color: @m-white0; line-height: 28px; } .day { width: 70px; text-align: right; color: @m-blue0; margin-right: 17px; line-height: 28px; } .arrowRight { display: none; .position(absolute, auto, -9px, 0, auto); font-size: 12px; color: @m-blue0; line-height: 30px; z-index: 2; } } .tip { margin-left: 13px; font-size: 16px; line-height: 30px; color: @m-blue23; } } .ant-steps-item-finish {} .ant-steps-item-process { .line { border: 1px solid @m-blue0; .arrowRight { display: block; } } .tip { color: @m-blue0; } .ant-steps-item-icon { width: 22px !important; height: 22px !important; background: url(../images/stepPro.png) center center no-repeat !important; background-size: cover !important; border: 0; .ant-steps-icon { display: none; } } } .ant-steps-item-wait { .line { .num { background: @m-grey28; } .desc { color: @m-grey29; } } .tip { color: @m-grey30; } .ant-steps-item-icon { border: 0; width: 22px !important; height: 22px !important; background: url(../images/stepWait.png) center center no-repeat !important; background-size: cover !important; .ant-steps-icon { display: none; } } } } .commonSteps>.ant-steps-item-finish>.ant-steps-item-container>.ant-steps-item-tail::after { background-color: @m-blue24; } .commonSteps>.ant-steps-item-process>.ant-steps-item-container>.ant-steps-item-tail::after { background-color: @m-grey30; } // 左侧菜单 .ant-menu-dark .ant-menu-inline.ant-menu-sub { background: @m-black28; box-shadow: none; } // 仓单贸易查询条件 .ant-select-tree-dropdown { background: @m-grey9; box-shadow: none; .ant-select-tree { color: @m-grey1; li { .ant-select-tree-node-content-wrapper-open:hover { background: @m-blue3; } .ant-select-tree-node-content-wrapper { color: @m-grey1; } .ant-select-tree-child-tree { li:hover { background: @m-blue3; span { background: @m-blue3; color: @m-white0; } } } } } } // 左侧菜单样式 .ant-menu-dark .ant-menu-sub .ant-menu-item, .ant-menu-dark .ant-menu-sub .ant-menu-item { color: @m-grey34; } .ant-menu-dark .ant-menu-sub .ant-menu-item-selected, .ant-menu-dark .ant-menu-sub .ant-menu-item-selected { color: @m-white8; } .ant-select-tree-dropdown .ant-select-tree li .ant-select-tree-node-content-wrapper.ant-select-tree-node-selected { background: transparent !important; } // 数字最右侧上下箭头不显示 .ant-input-number-handler-wrap { display: none } // 图标卖挂选项卡 .chartTabs.ant-tabs-top { height: calc(100% - 22px); background: transparent; .ant-tabs-bar { margin-bottom: 0; border-bottom: 0; height: 30px; .ant-tabs-nav-container { .ant-tabs-nav-wrap { .ant-tabs-nav-scroll { .ant-tabs-nav { width: 100%; >div { .flex; } .ant-tabs-tab { margin-right: 0; padding: 0; height: 30px; line-height: 30px; background: @m-black39; color: @m-grey1; font-size: 14px; flex: 1; text-align: center; } .ant-tabs-tab-active { background: @m-green1; color: @m-blue0; } .ant-tabs-ink-bar-animated { width: 0 !important; height: 0 !important; } } } } } } .ant-tabs-content { width: 100%; height: calc(100% - 29px); min-height: calc(100% - 29px); margin-top: -1px; position: relative; .ant-tabs-tabpane { height: 100%; .flex; flex-direction: column; } .ant-tabs-tabpane-active { background: @m-green1; .position(absolute, 0, 0, 0, 0); z-index: 2; } } .ant-tabs-content-animated { margin-left: 0 !important; } } .watchMore { width: 100%; height: 22px; line-height: 22px; background: @m-grey48; font-size: 14px; color: @m-grey49; text-align: center; cursor: pointer; } .chartRow { width: 100%; padding-left: 8px; padding-right: 10px; display: inline-flex; >div { flex: 1; font-size: 14px; color: @m-grey50; height: 40px; line-height: 40px; } .left { text-align: left; } .middle { text-align: center; color: @m-red11; } .right { text-align: right; } } // 朋友搜索框 .ant-input-search.searchFriendInput { width: 100%; height: 30px; background: @m-grey53; border-color: @m-grey54; .rounded-corners(15px); .anticon-search { color: @m-grey55; } .ant-input { background: @m-grey53; color: @m-white6; font-size: 14px; font-weight: 400; } .ant-input-suffix { .ant-input-search-icon { display: none; } } .ant-input-group { .ant-input-group-addon { background: @m-grey53; .rounded-corners(0, 15px, 15px, 0); .ant-input-search-button { width: 56px; height: 26px; background: #3A87F7; padding: 0; align-self: center; align-items: center; .rounded-corners(13px); span { width: 100%; height: 26px; line-height: 22px; text-align: center; color: #ffffff; font-weight: 400; font-size: 14px; } } } } } .ant-input-search.noSuffixInput { .ant-input-group { .ant-input-group-addon { display: none; } } } .ant-popover.friendPopover { .ant-popover-content { .ant-popover-inner { .ant-popover-inner-content { padding: 0; } } } } // 履约规则 .rulesCont { margin-top: 10px; .flex; overflow-x: auto; overflow-y: hidden; max-width: 450px; .ruleCol.ant-col { margin-bottom: 10px; } .ant-row { margin-left: 0 !important; margin-right: 0 !important; .ant-col { padding-left: 0 !important; padding-right: 0 !important; margin-bottom: 20px; .rounded-corners(3px); display: inline-flex; .line { width: 100%; .flex; flex-direction: column; .name { min-width: 120px; height: 30px; line-height: 28px; background: @m-blue28; border: 1px solid @m-black37; .rounded-corners(3px); text-align: center; font-size: 14px; color: @m-white6; } .time { margin: 6px auto 0; width: 50px; height: 28px; background: @m-black38; .rounded-corners(5px); color: @m-blue26; font-size: 12px; text-align: center; } } .line:nth-child(2n) { .name { background: @m-yellow4; border-color: @m-yellow5; } } .line+.line { margin-left: 5px; } } } } // 账号管理 滚动条 .account_info_container { height: calc(100% - 40px); .a-collapse-container { height: calc(100% - 70px); overflow: auto; } }