|
@@ -1,14 +1,11 @@
|
|
|
-@import "~ant-design-vue/lib/style/index";
|
|
|
-
|
|
|
+@import '~ant-design-vue/dist/antd.less'; // 引入官方提供的 less 样式入口文件
|
|
|
+// @import "~ant-design-vue/lib/style/index";
|
|
|
+@import './newThem.less'; // 用于覆盖上面定义的变量
|
|
|
// The prefix to use on all css classes from ant-pro.
|
|
|
@ant-pro-prefix : ant-pro;
|
|
|
@ant-global-sider-zindex : 106;
|
|
|
@ant-global-header-zindex : 105;
|
|
|
|
|
|
-.ant-input-disabled{
|
|
|
- color: #666;
|
|
|
- background-color: #f8f8f8;
|
|
|
-}
|
|
|
.text-overflow{
|
|
|
overflow: hidden;
|
|
|
text-overflow:ellipsis;
|
|
@@ -19,4 +16,368 @@
|
|
|
-webkit-box-orient: vertical;
|
|
|
-webkit-line-clamp: 3;
|
|
|
overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+/* 扩展ant design pro按钮组件颜色 */
|
|
|
+.ant-btn-primary.button-primary {
|
|
|
+ background-color: #39f;
|
|
|
+ border-color: #39f;
|
|
|
+ margin: 0 5px;
|
|
|
+ font-size: 12px;
|
|
|
+ &:hover, &:focus {
|
|
|
+ background-color: #52a6fb;
|
|
|
+ border-color: #52a6fb;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ background-color: #3d80bf;
|
|
|
+ border-color: #3d80bf;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-primary.button-info {
|
|
|
+ background-color: #2db7f5;
|
|
|
+ border-color: #2db7f5;
|
|
|
+ margin: 0 5px;
|
|
|
+ font-size: 12px;
|
|
|
+ &:hover, &:focus {
|
|
|
+ background-color: #32c8f5;
|
|
|
+ border-color: #32c8f5;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ background-color: #27a3d8;
|
|
|
+ border-color: #27a3d8;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-primary.button-success {
|
|
|
+ background-color: #0c6;
|
|
|
+ border-color: #0c6;
|
|
|
+ margin: 0 5px;
|
|
|
+ font-size: 12px;
|
|
|
+ &:hover, &:focus {
|
|
|
+ background-color: #01dc8c;
|
|
|
+ border-color: #01dc8c;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ background-color: #00af57;
|
|
|
+ border-color: #00af57;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-primary.button-warning {
|
|
|
+ background-color: #f90;
|
|
|
+ border-color: #f90;
|
|
|
+ margin: 0 5px;
|
|
|
+ font-size: 12px;
|
|
|
+ &:hover, &:focus {
|
|
|
+ background-color: #ffb60a;
|
|
|
+ border-color: #ffb60a;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ background-color: #dd8500;
|
|
|
+ border-color: #dd8500;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-primary.button-error {
|
|
|
+ background-color: #f30;
|
|
|
+ border-color: #f30;
|
|
|
+ margin: 0 5px;
|
|
|
+ font-size: 12px;
|
|
|
+ &:hover, &:focus {
|
|
|
+ background-color: #ff6666;
|
|
|
+ border-color: #ff6666;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ background-color: #d62a00;
|
|
|
+ border-color: #d62a00;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-primary.button-geekblue {
|
|
|
+ background-color: #2F54EB;
|
|
|
+ border-color: #2F54EB;
|
|
|
+ margin: 0 5px;
|
|
|
+ font-size: 12px;
|
|
|
+ &:hover, &:focus {
|
|
|
+ background-color: #1d39c4;
|
|
|
+ border-color: #1d39c4;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ background-color: #597ef7;
|
|
|
+ border-color: #597ef7;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-primary.button-purple {
|
|
|
+ background-color: #722ED1;
|
|
|
+ border-color: #722ED1;
|
|
|
+ margin: 0 5px;
|
|
|
+ font-size: 12px;
|
|
|
+ &:hover, &:focus {
|
|
|
+ background-color: #9254de;
|
|
|
+ border-color: #9254de;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ background-color: #531dab;
|
|
|
+ border-color: #531dab;
|
|
|
+ }
|
|
|
+}
|
|
|
+.ant-btn-primary.button-grey {
|
|
|
+ background-color: #82848a;
|
|
|
+ border-color: #82848a;
|
|
|
+ margin: 0 5px;
|
|
|
+ font-size: 12px;
|
|
|
+ &:hover, &:focus {
|
|
|
+ background-color: #909399;
|
|
|
+ border-color: #909399;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ background-color: #c8c9cc;
|
|
|
+ border-color: #c8c9cc;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// btn-link
|
|
|
+.ant-btn-link.button-default {
|
|
|
+ color: #1b1b1b;
|
|
|
+ &:hover, &:focus {
|
|
|
+ color: #66696d;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ color: #8e8f91;
|
|
|
+ }
|
|
|
+}
|
|
|
+.ant-btn-link.button-primary {
|
|
|
+ color: #39f;
|
|
|
+ &:hover, &:focus {
|
|
|
+ color: #52a6fb;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ color: #3d80bf;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-link.button-info {
|
|
|
+ color: #2db7f5;
|
|
|
+ &:hover, &:focus {
|
|
|
+ color: #32c8f5;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ color: #27a3d8;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-link.button-success {
|
|
|
+ color: #0c6;
|
|
|
+ &:hover, &:focus {
|
|
|
+ color: #01dc8c;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ color: #00af57;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-link.button-warning {
|
|
|
+ color: #aa6a02;
|
|
|
+ &:hover, &:focus {
|
|
|
+ color: #c68d07;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ color: #dd8500;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-link.button-error {
|
|
|
+ color: #f30;
|
|
|
+ &:hover, &:focus {
|
|
|
+ color: #ff6666;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ color: #d62a00;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-link.button-geekblue {
|
|
|
+ color: #2F54EB;
|
|
|
+ &:hover, &:focus {
|
|
|
+ color: #1d39c4;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ color: #597ef7;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.ant-btn-link.button-purple {
|
|
|
+ color: #722ED1;
|
|
|
+ &:hover, &:focus {
|
|
|
+ color: #9254de;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ color: #531dab;
|
|
|
+ }
|
|
|
+}
|
|
|
+.ant-btn-link.button-grey {
|
|
|
+ color: #82848a;
|
|
|
+ &:hover, &:focus {
|
|
|
+ color: #909399;
|
|
|
+ }
|
|
|
+
|
|
|
+ &:active, &.active {
|
|
|
+ color: #c8c9cc;
|
|
|
+ }
|
|
|
+}
|
|
|
+// 查询条件样式
|
|
|
+.table-page-search-wrapper {
|
|
|
+ .ant-form.ant-form-inline{
|
|
|
+ .ant-form-item {
|
|
|
+ margin-bottom: 10px!important;
|
|
|
+ .ant-input,.ant-select-selection{
|
|
|
+ border-radius: 2px;
|
|
|
+ padding: 0px 11px;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ .ant-form-item-label{
|
|
|
+ line-height: 32px!important;
|
|
|
+ padding-right: 8px!important;
|
|
|
+ }
|
|
|
+ .ant-form-item-control{
|
|
|
+ line-height: 31px!important;
|
|
|
+ }
|
|
|
+ .ant-form-item-control-wrapper{
|
|
|
+ .ant-select-selection__rendered{
|
|
|
+ margin: 0!important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .form-model-con.ant-form.ant-form-inline{ // a-form-model 有必选条件(因校验提示信息原因,因此边距需高于无必选条件边距)
|
|
|
+ .ant-form-item {
|
|
|
+ margin-bottom: 16px!important;
|
|
|
+ .ant-form-explain{
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .table-page-search-submitButtons {
|
|
|
+ margin-bottom: 9px;
|
|
|
+ }
|
|
|
+}
|
|
|
+// 菜单样式
|
|
|
+.sider {
|
|
|
+ .logo {
|
|
|
+ h1 {
|
|
|
+ font-size: 15px!important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ant-menu{
|
|
|
+ .ant-menu-submenu{
|
|
|
+ .ant-menu-item{ // 二级菜单左侧缩进
|
|
|
+ padding-left: 30px!important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+// 内容盒子样式
|
|
|
+.content {
|
|
|
+ .table-operator {
|
|
|
+ padding: 0 0 8px;
|
|
|
+ button {
|
|
|
+ margin-right: 8px;
|
|
|
+ margin-left: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .table-operator-nobor{
|
|
|
+ padding: 0 0 10px 0;
|
|
|
+ button {
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .affix-cont{
|
|
|
+ z-index: 99;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 7px 0 4px;
|
|
|
+ box-shadow: 0 0 20px #dcdee2;
|
|
|
+ }
|
|
|
+}
|
|
|
+// 页签样式
|
|
|
+.multi-tab-con{
|
|
|
+ .ant-tabs-nav-container{
|
|
|
+ height: 31px!important;
|
|
|
+ .ant-tabs-tab{
|
|
|
+ padding: 0 8px!important;
|
|
|
+ height: 30px!important;
|
|
|
+ line-height: 30px!important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+// a-alert样式
|
|
|
+.ant-alert,.ant-alert-info{
|
|
|
+ .ant-alert-icon{
|
|
|
+ top: 6.5px!important;
|
|
|
+ left: 5px!important;
|
|
|
+ }
|
|
|
+ padding: 3px 10px!important;
|
|
|
+ border-radius: 2px!important;
|
|
|
+}
|
|
|
+.ant-page-header{
|
|
|
+ padding: 5px 10px!important;
|
|
|
+}
|
|
|
+
|
|
|
+// 表格 样式
|
|
|
+.sTable{
|
|
|
+ .ant-table{
|
|
|
+ .ant-table-content{
|
|
|
+ .ant-table-header tr th, .ant-table-thead tr th{
|
|
|
+ background: #fafafa!important;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #000!important;
|
|
|
+ padding: 5px!important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ant-pagination.ant-table-pagination{
|
|
|
+ margin: 10px 0 0;
|
|
|
+ }
|
|
|
+ .ant-table-small > .ant-table-content .ant-table-body{
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+.sTable.fixPagination{
|
|
|
+ >.ant-table-wrapper{
|
|
|
+ height: 100%;
|
|
|
+ >.ant-spin-nested-loading{
|
|
|
+ height: 100%;
|
|
|
+ >.ant-spin-container{
|
|
|
+ height: 100%;
|
|
|
+ position: relative;
|
|
|
+ .ant-pagination.ant-table-pagination{
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|