YangHuCost/web/building_saas/css/main.css

/*building SAAS 0.1*/
/*bootstrap 初始化*/
body {
    font-size: 0.9rem;
    overflow: hidden;
}
a{
    outline: none
}
.dropdown-menu {
    font-size: 0.9rem
}
.btn.disabled, .btn:disabled {
    color:#999
}
.btn-link:focus, .btn-link:hover{
    text-decoration: none
}
.dropdown-menu {
    padding:.2rem 0;
}
.dropdown-item:focus, .dropdown-item:hover{
    background-color: #f7f7f9
}
.text-indent {
    text-indent:26px;
}
.modal-header{
    background:#f2f2f2;
    border-bottom:1px solid #ccc;
    padding:.8rem 1rem;
}
.modal-title{
    font-size:1rem;
}
.modal-footer{
    padding:.8rem 1rem;
}
.form-check .form-check-label,.form-radio .form-check-label{
    cursor: pointer;
}
/*自定义css*/
.login-body,.login-html{
    height:100%;
}
.login-bg{
    width: 100%;
    height: 100%;
    background: #f2f6f5 url("login-bg.jpg") bottom center no-repeat;
    background-size: 100% auto;
    display: inline-block;
    position: absolute;
}
.login-panel {
    width: 500px;
    margin: 0 auto;
    position: absolute;
    left: 0;
    right: 0;
    top: 20%;
    padding:30px;
    background:#fff;
    box-shadow:#333 1px 1px 5px
}
.ver-panel {
    width:100%;
    top:10%;
}
.header {
    border-bottom: 1px solid #ccc
}
.header .header-logo {
    background: #ff6501;
    float: left;
    margin-right: 1rem;
    font-size: 1rem;
    height:38px;
    background:url(logo.png) no-repeat 0 0;
    padding-left:50px;
}
.header-logo div.v-title{
    font-size:11px;
    color:#aeaeae;
    line-height: 12px;
    margin-top:3px;
}
.header-logo div.p-title{
    font-size:16px;
    color:#ff6501;
}
.header-logo div.b-title{
    font-size:24px;
    color:#ff6501;
}
.top-msg{
    position: fixed;
    top:10px;
    width:900px;
    z-index: 9999;
    left:50%;
    margin-left:-450px;
}
.main {
    position: relative;
    background: #f7f7f9;
}
.main-nav {
    position: absolute;
    text-align: center;
    z-index: 999;
    padding: 2px 0 0 2px
}
.main-nav .nav a {
    display: block;
    width: 28px;
    text-align: center;
    line-height: 18px;
    padding: 10px 0;
    border-right: 1px solid #ccc;
}
.main-nav .nav a:hover {
    background: #fff;
    color: #333;
    text-decoration: none;
}
.main-nav .nav a.active {
    border: 2px solid #ff6501;
    border-right: 1px solid #fff;
    background: #fff;
    color: #333
}
.main-nav .nav-tabs{
    border-bottom: none
}
.poj-manage .col-auto{
    background:#f7f7f9
}
.poj-cate {
    width:58px;
    margin-right:-1px;
    margin-top:2px;
}
.poj-cate .nav-pills .nav-link{
    border-radius: 0;
    font-size: 24px;
    color: #007bff
}
.poj-cate .nav-item{
    position: relative;
}
.poj-cate .nav-pills .badge{
    position: absolute;
    right:5px;
    top:5px;
}
.poj-cate .nav-pills .nav-link:hover{
    color:#0056b3
}
.poj-cate .nav-pills .nav-link.active, .nav-pills .show > .nav-link{
    background-color: #6c757d;
    color:#fff
}
.pm-side{
    position: fixed;
    left:0;
    height:100%;
    border-right:1px solid #ccc;
    background: #f7f7f9
}
.pm-content{
    padding-left:58px
}
.content {
    border-left: 1px solid #ccc;
    margin-left: 29px;
    background: #fff
}
.toolsbar,.toolsbar-f {
    background: #f7f7f9;
    border-bottom: 1px solid #ccc
}
.tools-btn {
    height: 30px;
    line-height: 30px
}
.toolsbar .tools-btn.btn:hover,.toolsbar-f .tools-btn.btn:hover {
    background: #f7f7f9;
}
.toolsbar .btn-light {
    color:#007bff;
    min-width: 34px;
}
.toolsbar .btn-light.disabled {
    color:#999;
}
.main-side {
    border-left: 1px solid #ccc;
    overflow-y: hidden;
}
.main-data-top,.main-data-full{
    overflow: hidden;
    width:100%
}
.main-data-top-side{
    overflow: hidden
}
.main-content.col-lg-8{
    width:66.666667%
}
.main-content.col-lg-12{
    width:100%
}
.main-side.col-lg-4{
    width: 33.333333%;
}
.main-side.col-lg-0{
    width:0%;
}
.sidebar-middle{
    height:80px;
}
.sidebar-bottom,.sidebar-bottom .col-lg-6,.sidebar-bottom .col-lg-12 {
    height:300px
}
.top-content, .fluid-content {
    overflow: auto;
    border-bottom: 1px solid #ccc;
    width: 100%
}
.bottom-content .nav {
    background: #f7f7f9;
    padding:1px 0 0 2px
}
.bottom-content .nav-tabs .nav-link, .side-tabs .nav-tabs .nav-link {
    border-radius: 0;
    padding: 0.2em 0.5em
}
.bottom-tools {
    height: 30px;
    line-height: 30px;
    background:#fff;
    bottom:20px;
    left:22px;
    z-index: 999
}
.side-tabs .nav-tabs .nav-item {
    z-index: 999
}
.side-tabs .nav-tabs {
    border-bottom: none;
    margin-bottom: -1px
}
.side-tabs .nav-tabs .nav-link {
    border-radius: 0;
    padding: 0em 0.5em;
    line-height: 30px;
    z-index: 999
}
.bottom-content .nav-tabs .nav-link.active {
    border:2px solid #ff6501;
    border-bottom: 1px solid #fff
}
.side-tabs .nav-tabs .nav-link.active {
    border-top: none;
    border-bottom:1px solid #fff
}
.side-tabs a.active, .sub-nav a.active {
    background: #ccc
}
.poj-manage {
    background: #fff
}
.slide-sidebar {
    border-left: 1px solid #E1E1E1;
    box-shadow: 0px 15px 15px rgba(0, 0, 0, 0.1);
    background: none repeat scroll 0% 0% #ffffff;
    overflow: hidden;
    position: absolute;
    right: 0px;
    top: 0;
    z-index: 999;
    width: 0px;
}
.new-msg {
    -webkit-animation: tada 1s infinite .2s ease both;
    -moz-animation: tada 1s infinite .2s ease both;
}
@-webkit-keyframes tada {
    0% {
        -webkit-transform: scale(1)
    }
    10%, 20% {
        -webkit-transform: scale(0.9) rotate(-3deg)
    }
    30%, 50%, 70%, 90% {
        -webkit-transform: scale(1.1) rotate(3deg)
    }
    40%, 60%, 80% {
        -webkit-transform: scale(1.1) rotate(-3deg)
    }
    100% {
        -webkit-transform: scale(1) rotate(0)
    }
}
@-moz-keyframes tada {
    0% {
        -moz-transform: scale(1)
    }
    10%, 20% {
        -moz-transform: scale(0.9) rotate(-3deg)
    }
    30%, 50%, 70%, 90% {
        -moz-transform: scale(1.1) rotate(3deg)
    }
    40%, 60%, 80% {
        -moz-transform: scale(1.1) rotate(-3deg)
    }
    100% {
        -moz-transform: scale(1) rotate(0)
    }
}
.has-danger {
    -webkit-animation: shake 1s .2s ease both;
    -moz-animation: shake 1s .2s ease both;
    animation: shake 1s .2s ease both;
}
@-webkit-keyframes shake {
    0%, 100% {
        -webkit-transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translateX(-10px);
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translateX(10px);
    }
}
@-moz-keyframes shake {
    0%, 100% {
        -moz-transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        -moz-transform: translateX(-10px);
    }
    20%, 40%, 60%, 80% {
        -moz-transform: translateX(10px);
    }
}
@keyframes shake {
    0%, 100% {
        transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-10px);
    }
    20%, 40%, 60%, 80% {
        transform: translateX(10px);
    }
}
.gl-side.gl-side-lg{
    width:200px;
}
.nav-side .nav-link{
    padding:.5rem;
}
.nav-side .nav-link.active{
    background:#ddd;
    color:#333;
}
.gl-side{
    border-right:1px solid #ccc;
    width:120px
}
.bottom-content .tab-content .main-data-bottom{
    height: 300px;
    overflow: auto;
}
.bottom-content .main-data-bottom2{
    height: 331px;
    overflow: hidden;
}
.bottom-content .tab-content .ovf-hidden{
    overflow: hidden;
}
.tn-nav,.rn-nav{
    width:30px;
    height: 100%;
    border-left:1px solid #dee2e6 ;
}
.tn-nav,.cn-nav{
    border-right:1px solid #dee2e6 ;
    border-left:none;
}
.tn-nav > span{
    width:20px;
}
.tn-nav:hover{
    background:#f7f7f9;
    cursor: pointer;
}
.rn-nav {
    background: #f7f7f9
}
.rn-nav .nav{
    padding: 0
}
.rn-nav .nav-tabs {
    border:none;
    margin-top:2px;
}
.rn-nav .nav-tabs .nav-link{
    padding:0.4em 0.4em;
    line-height: 16px
}
.rn-nav .nav-tabs .nav-link.active {
    border:none;
    background-color: #fff;
    border-left:1px solid #fff;
    margin-left:-1px;
    border-top:1px solid #ccc;
    border-right:1px solid #ccc;
    border-bottom:1px solid #ccc;
}
.cn-nav .nav-tabs .nav-link.active {
    border:none;
    background-color: #fff;
    border-right:1px solid #fff;
    margin-right:-1px;
    border-top:1px solid #ccc;
    border-left:1px solid #ccc;
    border-bottom:1px solid #ccc;
}
.rn-nav .nav-tabs .nav-link span{
    display:none;
}
.rn-nav .nav-tabs .nav-link.active span{
    display: inline-block;
}
.poj-list, .side-content ,.form-view{
    overflow: auto;
}
.print-toolsbar{
    padding:5px
}
.print-toolsbar .panel {
    display:inline-block;
    vertical-align:top
}
.print-toolsbar .panel .panel-foot{
    text-align: center;
    font-size: 12px;
    padding-bottom:3px;
    background:#F2F2F2
}
.print-list {
    border-right:1px solid #ccc
}
.print-list .form-list {
    overflow: auto
}
.print-list .list-tools{
    height:50px;
    padding:10px 0;
    border-bottom:1px solid #f2f2f2
}
.pageContainer {
    text-align: center
}
.pageContainer .page{
    border:9px solid transparent;
    display: inline-block;
}
.pageContainer .page img{
    width:inherit;
    height: inherit;
}
.modal-auto-height {
    height: 400px;
    overflow-y: auto;
}
.modal-toolbar + .modal-auto-height{
    height:369px
}
.modal-fixed-height {
    height: 400px;
    overflow-y: hidden;
}
.sidebar-tools-bar {
    background:#fff
}
.side-search-box{
    background:#fff;
    border-bottom:1px solid #ddd
}
.navbar-crumb span{
    float:left;
}
.navbar-crumb span.text-truncate{
    max-width: 200px;
}
.dropdown-item{
    color:#007bff
}
.dropdown-item:hover{
    color:#0056b3
}
.dropdown-item.disabled, .dropdown-item:disabled{
    pointer-events:none
}
.tools-symbol{
    width:450px
}
.tools-symbol p{
    margin: 0
}
.tools-symbol a.btn{
    font-size: .95rem;
    width:26px;
    padding: 0;
    height:26px;
}
.custom-file-input:lang(zh) ~ .custom-file-label::after {
    content: "浏览";
}

.message-box {
    position:absolute;
    background:#000;
    padding:8px 10px;
    line-height: 18px;
    border-radius:4px;
    box-shadow:2px 2px 6px #ccc;
    color:#fff;
}
.triangle-border {
    position:absolute;
    left:10px;
    overflow:hidden;
    width:0;
    height:0;
    border-width:6px;
    border-style:solid dashed dashed dashed;
}
.tb-border {
    bottom:-12px;
    border-color:#000 transparent transparent transparent;
}
.tb-background {
    bottom:-11px;
    border-color:#000 transparent transparent transparent;
}
.box-text-style {
    font-size: 12px;
    font-family:"Microsoft YaHei"
}
.box-text-style p{
    margin:0 0 2px 0;
}
.box-text-style table{
    width: 100%;
    text-align: center;
}
.box-text-style table th,.box-text-style table td{
    border:1px solid #fff;
}

.box-text-style table p{
    text-align: left;
}
.sys-setting-nav .nav-link{
    padding:.3rem 1rem;
}
/*快捷切换单位工程*/
.navbar-crumb{
    position: relative;
}
.navbar-crumb .f-nav,.navbar-crumb .s-nav{
    position: absolute;
    z-index: 999;
    width: 200px;
    background:#fff;
    border: 1px solid rgba(0,0,0,.15);
    padding: .5rem 0;
}
.navbar-crumb .f-nav{
    right:50px;
    top:35px;
}
.navbar-crumb .s-nav{
    left:200px
}
.navbar-crumb .f-nav li{
    padding: .25rem 1rem;
    cursor: default;
}
.navbar-crumb .f-nav li.focus{
    color: #16181b;
    background-color: #f7f7f9;
}
.navbar-crumb .f-nav li .s-nav{
    display: none
}
.navbar-crumb .f-nav li.focus .s-nav{
    display: block
}
/*书签颜色*/
.annotate-color-1{
    background: #E2F2C5
}
.annotate-color-2{
    background: #F9E2CF
}
.annotate-color-3{
    background: #F2EFD9
}
.annotate-color-4{
    background: #F5D1DA
}
.annotate-color-5{
    background: #E3E3E3
}
.annotate-color-6{
    background: #B6F3F2
}
.annotate-color-7{
    background: #ECE0F5
}
/*宽屏菜单*/
@media screen and (min-width: 900px) {
    #fluid-menu{
    }
    #min-menu{
        display: none
    }
}
@media screen and (min-width: 912px) {
    #share-info{
        overflow: auto;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width:inherit;
    }
}
/*窄屏菜单*/
@media screen and (max-width: 900px) {
    #fluid-menu{
        display: none
    }
    #min-menu{

    }
}
@media screen and (max-width: 1018px) {
    #share-info{
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width:80px;
    }
}