bri-components 1.0.0

package/src/styles/variables.less

@@ -0,0 +1,98 @@
+/*主色start*/
+@themeColor: #3DB8C5; // 主题颜色
+@primaryColor: #0875FF; // button primary颜色
+@themeDarkColor: #0E3161; //深色导航背景
+@themeHelpColor: @themeColor; //辅助色1   原#34527A;
+@themeHelpColor1: @themeColor; //辅助色2  原#285AD8
+@progressColor: @themeColor; //进度条绿色 原#6CACEE
+@borderColor: @themeColor; // 边框颜色 原#BAC9F0
+@bgColor: #F4F5FA; // 背景颜色
+@btnBg: @themeColor; //按钮色
+@disabledColor: #8A92A5; // 辅助图标
+@shenpi-themeColor:#3D84EE; // 审批端表单编辑改版主题色
+/*主色end*/
+
+/*辅色start*/
+@warningDanger: #F5222D; //警示红
+@warningOrange: #FA8C16; //警示橙
+@warningYellow: #FACF16; //警示黄
+@tipSuccess: #13C282; //通过绿
+/*辅色end*/
+
+/*字色start*/
+@contentColor: #596278; // 正文颜色
+@textColor: #8c8c8c; // 文字颜色
+@minorTextColor: #8A92A5; //次要文字颜色
+@subColor: #B8BECC; //弱文字颜色
+@greyColor: #E3E7F0; // 弱文字色，当前激活若背景色
+@deleteColor: @warningDanger; //删除文字颜色
+@titleColor: #19233B; // title文字颜色
+/*字色end*/
+
+/*字体大小规范start*/
+@largeTitleSize: 24px; // 最大title字体大小
+@titleSize: 20px; // 用于导航文字 大标题文字
+@commonTitleSize: 18px; //用于主页重要标题信息
+@smallTitleSize: 16px; //用于小标题类文字信息
+@textSize: 14px; //用于主要信息类文字
+@textSmallSize: 13px;
+@tipTextSize: 12px; //用于辅助信息类文字
+@bannerTitleSize: 54px;
+/*字体大小规范end*/
+
+
+@shadowColor: #828499; // 阴影颜色
+@textActiveColor: #262626; // 文字选中颜色
+@tabTextActiveColor: @themeColor; // tab选中的背景颜色
+@tabBgActiveColor: #F7FCFC; // tab选中的背景颜色
+@tipTextColor: #60c0ec; // 提示文字的颜色
+
+@titleFontFamily: SourceHanSansCN-Bold, SourceHanSansCN; // title字体
+
+@numberFontFamily: DINAlternate-Bold, DINAlternate; //数字字体
+@textFontFamily: PingFang SC; //中文文字字体
+@hoverBg: #E8F3FD;
+@white: #fff;
+@formLabelColor: #666; //表单label
+@formTextColor: #333; //表单label
+@formLabelSize: 14px; //表单label
+@formBorderColor: #E5E5E5; // 表单边框 
+@formBgColor: #F5F5F5; // 表单背景色 
+@formFocusBorderColor: @themeColor; // 表单选中边框 
+@uploadBackgroundColor: transparent; //上传icon背景
+@iconDefaultGreyColor: #BABABA; //icon默认灰色
+@ghostBg: #F4F8FF; //btn 浅背景色
+@inputPlaceholderColor: #BCBCBC; //input框内部placeholder
+@sheetSearchTitleColor: #333333; //工作表筛选两级title颜色
+@activeDarkGreyColor: #515a6e; // active时字体深灰颜色
+@readonlyBorderColor: #eee; //readonly状态下border颜色
+@disabledBgColor: rgb(250, 250, 250);
+// @disabledColor: #666;
+
+@mainBg: #ecf1f9;
+@boxShadow: 0px 2px 20px 0px rgba(116, 138, 163, 0.38);
+@boxShadowRight: 5px 0px 9px rgba(0, 0, 0, 0.1);
+
+@cscecBg: #F4F5FA;
+@cscecTableTitleBg: #fafbfd;
+@dasTextColor: @contentColor;
+@cscecInputBg: #fff;
+
+@borderGrey: #d9d9d9;
+
+@resourceColor: #3D84EE,
+    #F4A135,
+    #32B5A5,
+    #A3CF26,
+    #C36625,
+    #793CB7,
+    #E94829,
+    #E8BB1F,
+    #52A829,
+    #37B653,
+    #1DD9E6,
+    #1457BC,
+    #4B5CC4,
+    #7471F7,
+    #C434DB,
+    #252F36;

package/src/styles/view_reset.less

@@ -0,0 +1,446 @@
+.ivu-input-icon-clear {
+    width: 20px;
+}
+
+.ivu-select-dropdown {
+    max-height: 350px;
+    font-size: 14px;
+
+    // 时间日期控件
+    .ivu-date-picker {
+        &-header {
+            border-bottom: 0;
+            margin-top: 5px;
+
+            &-label {
+                font-weight: 700;
+            }
+        }
+
+        &-cells {
+            & span em:hover {
+                border-radius: 50%;
+                background-color: @shenpi-themeColor;
+                color: @white;
+            }
+
+            &-focused em {
+                border-radius: 50%;
+                color: @white;
+                background: @shenpi-themeColor;
+            }
+
+            &-cell-today em::after {
+                display: none;
+            }
+        }
+    }
+}
+
+.ivu-select-multiple .ivu-select-item-selected:after {
+    content: none;
+}
+
+.ivu-dropdown-menu {
+    min-width: 50px;
+}
+
+.ivu-form-item-error-tip {
+    font-size: 12px;
+    padding: 0 8px 0px 16px;
+}
+
+.ivu-tree-empty {
+    text-align: center;
+}
+
+// 蓝色按钮primary
+.ivu-btn-primary {
+    background-color: @formFocusBorderColor;
+    border-color: @formFocusBorderColor;
+    font-weight: bold;
+
+    &:hover {
+        background-color: @themeHelpColor1;
+    }
+}
+
+// primary-ghost
+.ivu-btn-ghost.ivu-btn-primary {
+    background-color: @ghostBg;
+    color: @tabTextActiveColor;
+    border: 1px solid @formFocusBorderColor;
+
+    &:hover {
+        color: @themeColor;
+    }
+}
+
+.ivu-btn-ghost.btn-cancel {
+    background-color: @ghostBg;
+    color: @tabTextActiveColor;
+    border: none;
+
+    &:hover {
+        background-color: @ghostBg !important;
+    }
+}
+
+.ivu-btn-default {
+    border-color: #C6C6C8;
+}
+
+/*自定义模态框start*/
+.ivu-modal {
+    // width: 468px;
+
+    .ivu-modal-confirm {
+        padding: 6px 8px 8px;
+
+        .ivu-modal-confirm-head {}
+
+        .ivu-modal-confirm-body {
+            padding: 20px 0;
+            padding-left: 40px;
+        }
+
+        .ivu-modal-confirm-footer {
+            button {
+                width: 102px;
+                height: 38px;
+                line-height: 38px;
+                font-size: 16px;
+            }
+
+            .ivu-btn-text {
+                border: 1px solid @minorTextColor  !important;
+                color: @textColor;
+            }
+
+            .ivu-btn-text:hover {
+                border-color: @minorTextColor  !important;
+                color: @themeHelpColor1;
+            }
+        }
+    }
+}
+
+/*自定义模态框end*/
+
+/*按钮start*/
+//按钮配置公共样式
+.ivu-btn {
+    border-radius: 2px;
+    height: 32px;
+    font-size: 14px;
+    color: @textColor;
+    background-color: @white;
+    border: 1px solid transparent;
+}
+
+.ivu-btn-dashed {
+    border-color: #dcdee2;
+    border-style: dashed;
+}
+
+//高亮按钮
+.ivu-btn-primary {
+    color: @white;
+    background-color: @btnBg;
+    border-color: @btnBg;
+
+    //.ivu-btn-large;
+    //按钮状态 悬停
+    &:hover {
+        background-color: @themeHelpColor1;
+    }
+}
+
+//默认按钮
+.ivu-btn-default {
+    border-color: @minorTextColor;
+
+    // color: #596278;
+    // background-color: @white;
+    // border-color: #8A92A5;
+    //.ivu-btn-large;
+    &:hover {
+        border-color: @minorTextColor;
+        color: @themeHelpColor1;
+    }
+}
+
+//按钮尺寸 大
+.ivu-btn-large {
+    height: 38px;
+    font-size: 16px;
+}
+
+//按钮尺寸 中 默认样式
+.ivu-btn-middle {
+    .ivu-btn
+}
+
+//按钮尺寸 小
+.ivu-btn-small {
+    height: 26px;
+    font-size: 12px;
+}
+
+//按钮状态 禁用
+.ivu-btn.disabled,
+.ivu-btn.disabled.active,
+.ivu-btn.disabled:active,
+.ivu-btn.disabled:focus,
+.ivu-btn.disabled:hover,
+.ivu-btn[disabled],
+.ivu-btn[disabled].active,
+.ivu-btn[disabled]:active,
+.ivu-btn[disabled]:focus,
+.ivu-btn[disabled]:hover,
+fieldset[disabled] .ivu-btn,
+fieldset[disabled] .ivu-btn.active,
+fieldset[disabled] .ivu-btn:active,
+fieldset[disabled] .ivu-btn:focus,
+fieldset[disabled] .ivu-btn:hover {
+    color: @minorTextColor !important;
+    background-color: @bgColor;
+    border: 1px solid @minorTextColor;
+}
+
+.ivu-btn-text {
+    border-color: transparent !important;
+}
+
+//配置按钮
+.ivu-settings-btn {
+    // height: 38px;
+    // font-size: 16px;
+    background: @bgColor;
+    color: @minorTextColor;
+    min-width: 153px;
+    border: 1px solid @greyColor;
+
+    &:hover {
+        border-color: @greyColor;
+        color: @minorTextColor;
+    }
+
+    .ivu-icon {
+        width: 15px;
+        height: 15px;
+        line-height: 15px;
+        color: @white;
+        background-color: @minorTextColor;
+    }
+
+    >span {
+        vertical-align: middle;
+    }
+}
+
+//下拉按钮 待实现
+// .ivu-select-selected-value,.ivu-select-arrow {
+//     color: @themeColor;
+// }
+//文字按钮
+.ivu-btn-text {
+    // font-size: 16px !important;
+    color: @themeColor;
+    background: transparent;
+    border: none;
+}
+
+//成功按钮
+.ivu-btn-success {
+    color: #fff;
+    background-color: @tipSuccess;
+    border-color: @tipSuccess;
+}
+
+/*按钮end*/
+
+
+
+// checkbox 控制选中时icon样式
+
+// 默认样式
+.type-item-0.ivu-radio-wrapper-checked,
+.type-item-0.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: @white;
+        left: 4px;
+    }
+}
+
+.type-item-1.ivu-radio-wrapper-checked,
+.type-item-1.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #CDE6FF;
+    }
+}
+
+.type-item-2.ivu-radio-wrapper-checked,
+.type-item-2.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #C1FCFF;
+    }
+}
+
+.type-item-3.ivu-radio-wrapper-checked,
+.type-item-3.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #C5FFD9;
+    }
+}
+
+.type-item-4.ivu-radio-wrapper-checked,
+.type-item-4.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #FFEDC8;
+    }
+}
+
+.type-item-5.ivu-radio-wrapper-checked,
+.type-item-5.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #FFDCAC;
+    }
+}
+
+.type-item-6.ivu-radio-wrapper-checked,
+.type-item-6.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #FFD3B6;
+    }
+}
+
+.type-item-7.ivu-radio-wrapper-checked,
+.type-item-7.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #EEB0FF;
+    }
+}
+
+.type-item-8.ivu-radio-wrapper-checked,
+.type-item-8.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #D1B3FF;
+    }
+}
+
+.type-item-9.ivu-radio-wrapper-checked,
+.type-item-9.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #B1C7FF;
+    }
+}
+
+.type-item-10.ivu-radio-wrapper-checked,
+.type-item-10.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #DCDCDC;
+    }
+}
+
+.type-item-11.ivu-radio-wrapper-checked,
+.type-item-11.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #6DAEF2;
+    }
+}
+
+.type-item-12.ivu-radio-wrapper-checked,
+.type-item-12.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #40CBD2;
+    }
+}
+
+.type-item-13.ivu-radio-wrapper-checked,
+.type-item-13.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #50C979;
+    }
+}
+
+.type-item-14.ivu-radio-wrapper-checked,
+.type-item-14.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #FFC53B;
+    }
+}
+
+.type-item-15.ivu-radio-wrapper-checked,
+.type-item-15.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #FF9300;
+    }
+}
+
+.type-item-16.ivu-radio-wrapper-checked,
+.type-item-16.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #FA6400;
+    }
+}
+
+.type-item-17.ivu-radio-wrapper-checked,
+.type-item-17.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #B620E0;
+    }
+}
+
+.type-item-18.ivu-radio-wrapper-checked,
+.type-item-18.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #7E41DF;
+    }
+}
+
+.type-item-19.ivu-radio-wrapper-checked,
+.type-item-19.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #25428D;
+    }
+}
+
+.type-item-20.ivu-radio-wrapper-checked,
+.type-item-20.ivu-checkbox-wrapper-checked {
+    .ivu-checkbox-inner:after {
+        border-color: #5D5D5D;
+    }
+}
+
+// input number border delete
+.ivu-input-number {
+    &-handler {
+        &-wrap {
+            border-left: none;
+            opacity: 1;
+        }
+
+        &-down {
+            border-top-color: #fff;
+            opacity: 1;
+        }
+    }
+}
+
+//表格中的多选框tooltip样式修改
+.columnCheckbox {
+    width: 100%;
+
+    // text-align: center;
+    .ivu-tooltip-rel {
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+    }
+}
+
+// tooltip 数字不折行问题
+.ivu-tooltip-inner {
+    word-break: break-word;
+}