34 lines
14 KiB
CSS
34 lines
14 KiB
CSS
.fl{float:left}.fr{float:right}.fix{*zoom:1}.fix:after{display:table;content:"";clear:both}.pr{position:relative}.pa{position:absolute}.pf{position:fixed}.align-middle{position:relative;top:50%;transform:translateY(-50%)}.text-ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-btn-wrap{position:fixed;top:67px;right:15px;max-width:200px;z-index:100}*{font-family:"微软雅黑","Microsoft YaHei","Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB",Arial,sans-serif}.header-container{background:transparent;transition:all 300ms;box-shadow:0 10px 20px 0 rgba(203,203,203,0.09);height:56px;position:fixed;top:0;left:0;width:100%;z-index:5}.header-container .icon-box{margin:0 24px 0 24px;cursor:pointer;background-repeat:no-repeat;background-position:30px center;background-size:14px}.header-container .icon-btn{background:transparent;height:24px;width:24px;line-height:24px;box-sizing:border-box;border-radius:2px;transition:all 500ms}.header-container .icon-btn i{color:#fff;font-size:22px;font-weight:100}.header-container .icon-btn.active{transform:rotate(90deg)}.header-container .delimiter{width:2px;border-left:1px solid rgba(255,255,255,0.5);height:20px}.header-container h4{font-size:19px;color:#fff;margin-left:12px;font-weight:bold;font-family:SimSun}.header-container .school-bg{position:absolute;top:0;height:100%;width:100%;left:0;right:0;z-index:-1}.header-container .header-aside{max-width:260px;height:56px}.header-container .header-aside img{float:left;width:28px;height:28px;border-radius:50%;cursor:pointer}.header-container .header-aside .name{max-width:90px;color:#fff;margin:0 32px 0 14px}.header-container .header-aside a{outline:none}.header-container .header-aside a:hover{opacity:.8}.header-container .header-aside .logout{padding:5px;margin:0 25px 0}.header-container .header-aside .logout i{color:#fff;font-size:18px}.left-menu{position:fixed;background:#fff;color:#272829;width:200px;left:0;top:56px;bottom:0px;display:flex;flex-direction:column;z-index:9;overflow:auto}.left-menu .menu-top-box{height:10px;border-right:1px solid #EBEEF4}.left-menu li{height:50px;transition:border 200ms;border-left:0px solid transparent;position:relative}.left-menu li a{color:#272829;width:100%;display:block;padding-left:35px;line-height:50px;outline:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-right:1px solid #EBEEF4;transition:none}.left-menu li.active{background:#f8f8f8;border-left:4px solid transparent;border-right:none}.left-menu li.active a{border-right:1px none;border-right:none}.left-menu li:hover{background:#f8f8f8}.left-menu li:hover a{border-right:none}.left-menu li .icon-box{line-height:1;height:20px;position:relative;top:25px;margin-top:-6px;padding-right:10px;font-size:14px;color:#656667}.left-menu .clear-box{flex:1;border-right:1px solid #EBEEF4}.path-nav{height:56px;width:calc(100% - 200px);position:relative;top:56px;left:200px;line-height:20px;font-size:12px;background:#fff;color:#969799;z-index:4;padding:16px 0 20px 24px}.path-nav .ivu-breadcrumb a{color:#848C98}.path-nav .ivu-breadcrumb a:hover{color:#6a727f}.path-nav .ivu-breadcrumb-item-link{font-size:14px}.path-nav .icon-category{color:#848C98;position:relative;top:1px}.app-panel{position:fixed;top:56px;margin-top:-6px;left:14px;background:#fff;z-index:10;transition:all 200ms;border-radius:8px;box-shadow:0 10px 20px 0 rgba(0,0,0,0.06);padding:20px 20px 0}.app-panel .tips-box{position:absolute;top:-5px;left:13px;width:0;height:0;border-right:5px solid transparent;border-bottom:7px solid #fff;border-left:5px solid transparent;z-index:1}.app-panel ul{padding-bottom:20px;border-bottom:1px solid #EBEEF4}.app-panel li{width:100px;margin-left:15px;text-align:center}.app-panel li a{display:block;color:#656667;padding:15px 0;border-radius:5px;transition:all 500ms;outline:none}.app-panel li a:hover{background:#eee}.app-panel li .icon-box{width:46px;height:46px;margin:0 auto 15px}.app-panel li .icon-box img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:50%}.app-panel li:first-child{margin-left:0}.app-panel .link-panel{height:60px;line-height:60px}.app-panel .link-panel i{margin-left:8px;position:relative;top:-1px}.app-panel .no-used-box{min-width:300px;text-align:center;height:110px;border-bottom:1px dashed #EBEEF4;line-height:30px;padding:40px 0}.no-authority-wrap{width:600px;height:320px;background:#fff;border-radius:15px;text-align:center;left:50%;position:relative;top:50%;transform:translateX(-50%) translateY(-50%);color:#272829;background-image:url(../image/no-authority.png);background-repeat:no-repeat;background-size:280px 152px;background-position:center 50px;overflow:hidden}.no-authority-wrap h3{font-size:18px;font-weight:500;margin-top:220px}.no-authority-wrap h6{font-size:12px;font-weight:500;margin-top:10px}.arrow-down{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAGCAYAAAD68A/GAAAAjUlEQVQYV2MsKSnh/vj1q+Xs6dP3MGAB2dnZ8v/+/RNhrK+vZ3r24tUsBsb/22fPmLEWWW16errWfwaGXob/nEmMIAlsitPSss0ZGP9UMzMxxU+fPv09WCG6Yqb//z/9Y2BMY/wvET9rVsM3kDxcIbJixv//WRgYDFNnzUr/DTMIRSFMMYhubGz8h+xeANRcRMpSDyHXAAAAAElFTkSuQmCC);background-repeat:no-repeat;background-size:10px 6px;background-position:90% center;transition:all 400ms;width:10px;height:6px;position:absolute;right:8%;top:22px}.arrow-up{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAGCAYAAAD68A/GAAAAjUlEQVQYV2MsKSnh/vj1q+Xs6dP3MGAB2dnZ8v/+/RNhrK+vZ3r24tUsBsb/22fPmLEWWW16errWfwaGXob/nEmMIAlsitPSss0ZGP9UMzMxxU+fPv09WCG6Yqb//z/9Y2BMY/wvET9rVsM3kDxcIbJixv//WRgYDFNnzUr/DTMIRSFMMYhubGz8h+xeANRcRMpSDyHXAAAAAElFTkSuQmCC);background-repeat:no-repeat;background-size:10px 6px;background-position:90% center;transition:all 400ms;width:10px;height:6px;position:absolute;right:8%;top:22px;transform:rotate(180deg)}.child-item-wrap{transition:all 500ms linear;overflow:hidden}.child-item-wrap li.child-item{border-left:transparent}.child-item-wrap li.child-item a{margin-left:24px;padding-left:35px}.fade_apps-enter-active,.fade_apps-leave-active{transition:all 1ms;transform:translateY(5px)}.fade_apps-leave-to{opacity:0}.fade_child_ul-enter-active{transition:all .5s ease-in-out}.fade_child_ul-leave-active{transition:all .5s ease-out}.fade_child_ul-enter{max-height:0}.fade_child_ul-enter-to{max-height:100%}.fade_child_ul-leave{max-height:100%}.fade_child_ul-leave-to{max-height:0}.base-wrap-main{padding:56px 0 0 200px;height:calc(100% - 56px);position:relative;background:#fff}.base-wrap-main .main-wrapper{min-width:760px;min-height:100%;position:relative;width:100%;box-sizing:border-box}.base-wrap-main .main-container{background:#ffffff;box-sizing:border-box;padding:0 24px;padding-bottom:24px;overflow:hidden}.base-wrap-main .default-wrapper{min-width:760px;min-height:100%;position:relative;width:100%;box-sizing:border-box}.base-wrap-main .page-wrapper{min-width:760px;min-height:100%;position:relative;width:100%;box-sizing:border-box}.base-wrap-main .tree-wrapper{height:100%}.base-wrap-main .tree-wrapper .tree-container{width:300px;float:left;border:1px solid #eeeeee;background:#ffffff;padding:10px;overflow:auto;margin-left:24px;height:calc(100% - 20px);border-radius:3px}.base-wrap-main .tree-wrapper .main-container{height:100%;margin-left:264px;overflow:auto}.base-wrap-main .tree-wrapper .page-panel{left:288px}.base-wrap-main .page-panel{height:72px;position:absolute;margin:0 auto;left:24px;right:24px;bottom:0;padding:20px 0;background:#fff}.base-wrap-main .page-panel .ivu-page li:hover{border-color:#5979ea}.base-wrap-main .page-panel .ivu-page li:hover a,.base-wrap-main .page-panel .ivu-page li:hover i{color:#5979ea}.base-wrap-main .page-panel .ivu-page-item-active{background:#5979ea;border-color:#5979ea}.base-wrap-main .page-panel .ivu-page-item-active a,.base-wrap-main .page-panel .ivu-page-item-active a:hover{color:#fff !important}.base-wrap-main .page-panel .ivu-page-disabled{border-color:#dcdee2}.base-wrap-main .page-panel .ivu-page-options-sizer{margin-right:0}.base-wrap-main .page-panel::after{display:block;position:relative;content:'';background:#eee;height:1px;width:100%;position:absolute;top:0}.base-wrap-main .tabs-panel{margin:0 24px 12px}.base-wrap-main .tabs-panel.ivu-tabs.ivu-tabs-card>.ivu-tabs-bar .ivu-tabs-tab{border-radius:0;background:#fff;margin-right:-1px;border-color:#EBEEF5 !important;height:39px;line-height:28px}.base-wrap-main .tabs-panel.ivu-tabs.ivu-tabs-card>.ivu-tabs-bar .ivu-tabs-tab.ivu-tabs-tab-active{color:#5979EA !important;height:40px}.base-wrap-main .tabs-panel.ivu-tabs.ivu-tabs-card .ivu-tabs-bar{border-color:#EBEEF5 !important;margin-bottom:0}.base-wrap-main .tabs-panel.ivu-tabs.ivu-tabs-card>.ivu-tabs-bar.ivu-tabs-tab-active{border-top:1px solid #EBEEF5}.base-wrap-main .tabs-panel.ivu-tabs.ivu-tabs-card>.ivu-tabs-bar .ivu-tabs-nav-container{height:40px}.base-wrap-main .btn-panel{margin-left:28px}.base-wrap-main.alone-page{padding-left:0}.search-wrap{background:#f7f7f7;padding:10px 16px;height:52px}.search-wrap_date .ivu-date-picker{width:150px}.search-wrap_sel{width:150px;float:left}.search-wrap_input{width:200px;float:left}.public-custom-switch .ivu-radio-wrapper-checked{background:#6b8cf4 !important;border-color:#6b8cf4 !important}.public-custom-switch .ivu-radio-group-item{width:90px;text-align:center}.public-upload-img li{width:100px;height:100px;border:1px solid #eee;border-radius:2px;padding:4px;position:relative;float:left;margin:0 10px 10px 0}.public-upload-img li img{width:100%;height:100%;object-fit:contain}.public-upload-img li:hover .upload-list-cover{display:block}.public-upload-img li .upload-list-cover{position:absolute;top:4px;bottom:4px;left:4px;right:4px;background:rgba(0,0,0,0.6);text-align:center;display:none;transition:all .3s}.public-upload-img li .upload-list-cover i{color:#fff;position:relative;top:50%;cursor:pointer;transform:translateY(-50%)}.public-upload-img li.add-li{border:none;padding:0;width:100px;height:100px}.public-upload-img li .add-box i{line-height:100px}.ivu-btn{font-size:14px;line-height:20px}.ivu-btn span{margin:0 3px}.ivu-btn-large{height:36px}a.ivu-btn-large{line-height:36px}.ivu-btn-primary{border-color:#5979EA;background:#5979EA}.ivu-btn-primary:hover{background:#708bed;border-color:#708bed}.ivu-btn-primary:active{background:#2c54e4;border-color:#2c54e4}.ivu-btn-primary.ivu-btn-ghost{background-color:#fff;color:#5979EA;border-color:#5979EA}.ivu-btn-success{border-color:#45B972;background:#45B972}.ivu-btn-success:hover{background:#57c080;border-color:#57c080}.ivu-btn-success:active{background:#37945b;border-color:#37945b}.ivu-btn-success.ivu-btn-ghost{background-color:#fff;color:#45B972;border-color:#45B972}.ivu-btn-error{border-color:#ed4d4d;background:#ed4d4d}.ivu-btn-error:hover{background:#ef6464;border-color:#ef6464}.ivu-btn-error:active{background:#e81f1f;border-color:#e81f1f}.ivu-btn-error.ivu-btn-ghost{background-color:#fff;color:#ed4d4d;border-color:#ed4d4d}.ivu-input-search{border-color:#5979EA !important;background:#5979EA !important}.ivu-input-search:hover{background:#708bed !important;border-color:#708bed !important}.ivu-input-search:active{background:#2c54e4 !important;border-color:#2c54e4 !important}.ivu-input-search.ivu-btn-ghost{background-color:#fff !important;color:#5979EA !important;border-color:#5979EA !important}.ivu-table-wrapper{border:none}.ivu-table::after{background:none}.ivu-table::before{background:none}.ivu-table-header th,.ivu-table-fixed-header th{height:48px !important;color:#595959;font-size:14px;background:#fff;border:none}.ivu-table td{height:48px;border:none;border-top:1px solid #ecedf3}.ivu-table td span{font-size:14px;font-family:"Microsoft YaHei","微软雅黑" !important}.ivu-table td .ivu-icon{font-family:'Ionicons' !important}.ivu-tabs-bar{margin-bottom:10px;border-bottom:1px solid #EBEEF5}.ivu-tabs-bar .ivu-tabs-ink-bar{background:#5979EA}.ivu-tabs-bar .ivu-tabs-tab-active,.ivu-tabs-bar .ivu-tabs-tab:hover,.ivu-tabs-bar .ivu-tabs-tab:active,.ivu-tabs-bar .ivu-tabs-tab-focused{color:#5979EA}.ivu-form-item{margin-bottom:20px}.ivu-form-item-error-tip{font-size:13px;padding-top:4px}.ivu-alert{margin-bottom:12px !important}.ivu-modal-wrap{display:flex;align-items:center;transform:translateY(0%)}.ivu-modal-wrap .ivu-form-item:last-child{margin-bottom:0px}.ivu-modal{top:0 !important}.ivu-modal-body{max-height:550px;overflow:auto}.ivu-table-cell .operating-btn{width:32px;height:32px;position:relative;display:block;border-radius:50%;color:gray;font-size:18px;margin-top:2px;line-height:32px;cursor:pointer}.ivu-table-cell .operating-btn:hover{background:#9e89cf;color:#fff}.ivu-table-cell .operating-btn.disabled{color:#c5c8ce;opacity:.3;cursor:not-allowed}.ivu-table-cell .operating-btn.disabled:hover{background:#fff}.ivu-table-cell .operating-link{display:inline-block;color:#2d8cf0;cursor:pointer;padding-right:10px}.ivu-table-cell .operating-link.disabled{color:#aaa;cursor:default}.status-shenhe span::before{content:'';display:inline-block;width:10px;height:10px;border-radius:50%;margin:auto 10px auto 0px;background-color:#e8a54c}.status-tongguo span::before{content:'';display:inline-block;width:10px;height:10px;border-radius:50%;margin:auto 10px auto 0px;background-color:#45B972}.status-chexiao span::before{content:'';display:inline-block;width:10px;height:10px;border-radius:50%;margin:auto 10px auto 0px;background-color:#bfbfbf}.status-jujue span::before{content:'';display:inline-block;width:10px;height:10px;border-radius:50%;margin:auto 10px auto 0px;background-color:#ed4d4d}.header-container{background:#577afb}.header-container .school-bg{display:none}.left-menu{background:#F6F8F9}.left-menu li:hover{background:#EFF4FF}.left-menu li.active{background:#EFF4FF;border-left:none ;border-right:4px solid #577afb}
|
||
/* ============================================================
|
||
菜单高亮闪烁修复（本地化后追加，优先级最高）
|
||
问题：原 .left-menu li 设了 transition:border 200ms，
|
||
切换 A→B 时 active 的 border-left(border-right) 在
|
||
transparent/none 与 4px #577afb 之间做 200ms 动画，
|
||
导致离开的项左侧出现一闪而逝的淡蓝边框。
|
||
修复：仅过渡 background-color，边框变化即时生效；
|
||
明确 active 仅保留右侧 4px 蓝边、无左侧边框。
|
||
============================================================ */
|
||
.left-menu li {
|
||
border-left: 0 solid transparent;
|
||
border-right: 0 solid transparent;
|
||
transition: background-color 200ms;
|
||
}
|
||
.left-menu li a {
|
||
border-right: 1px solid #EBEEF4;
|
||
transition: none;
|
||
}
|
||
.left-menu li.active {
|
||
background: #EFF4FF;
|
||
border-left: 0;
|
||
border-right: 4px solid #577afb;
|
||
}
|
||
.left-menu li.active a {
|
||
border-right: none;
|
||
}
|
||
.left-menu li:hover {
|
||
background: #EFF4FF;
|
||
}
|
||
.left-menu li:hover a {
|
||
border-right: none;
|
||
}
|