/**主页布局*/ /** * 隐藏页脚 */ .pearone-hide-footer .layui-body { bottom: 0px !important; } .pearone-hide-footer .layui-footer { display: none !important; } /**通用 Header Logo */ .pearone-layout .layui-header .layui-logo { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .15); color: whitesmoke; transition: all .4s; } .pearone-mini .layui-side { width: 60px !important; } .pearone-layout .layui-side { top: 50px !important; } .pearone-layout .layui-logo { height: 50px; line-height: 50px; } .pearone-layout .layui-header { height: 50px !important; line-height: 50px !important; } .pearone-layout .layui-body { top: 50px; } .pearone-layout .layui-header .layui-nav li { height: 50px !important; line-height: 50px !important; } .pearone-mini .layui-layout-left { left: 60px !important; transition.pearone-layout: all .4s; } .pearone-layout .layui-nav-tree { width: 220px !important; } .pearone-layout .layui-layout-left { transition: all .4s; left: 220px; } .pearone-mini .layui-body { left: 60px; } .pearone-mini .layui-header .layui-logo .title { display: none; } .pearone-mini .layui-side .layui-nav-item>a span { display: none; } .pearone-mini .layui-logo { width: 60px !important; } .layui-body { left: 220px; } .pearone-layout .layui-logo .title { margin-left: 15px; } .pearone-layout .layui-body .layui-tab-title { transition: all .4s; } .pearone-layout .layui-nav-item { transition: all .4s; } .pearone-layout .layui-body { overflow: -Scroll; overflow-y: hidden; transition: all .4s; } .pearone-layout .layui-side { transition: all .4s; } .pearone-layout .layui-side .layui-nav-tree {} .pearone-layout .layui-side .layui-nav-tree a span { margin-left: 15px; } /**通用 Body Tab */ .pearone-layout .layui-body .layui-tab { height: 100%; } .pearone-layout .layui-tab ul li:first-child .layui-tab-close { display: none; } .pearone-mini .layui-footer { left: 60px; } .pearone-layout .layui-footer { transition: all .4s; left: 220px; } .pearone-mini .layui-footer { left: 60px !important; } .pearone-layout .layui-body .layui-tab .layui-tab-title { padding-left: 40px; padding-right: 80px; box-shadow: 0px 0px 5px gray; } .pearone-layout .layui-body .layui-tab .layui-tab-content { width: 100%; height: calc(100% - 41px); padding: 0px; } .pearone-layout .layui-body .layui-tab .layui-tab-content .layui-tab-item { width: 100%; height: 100%; } .pearone-layout .layui-header .layui-this:after { display: none; } #topMenu .layui-this:after { display: inline; } .pearone-mini .pearone-menu-hover { position: fixed !important; left: 61px; /* top: 50px !important; */ z-index: 100 !important; width: 120px !important; background-color: #20222A !important; min-width: 120px; display: block; } .pearone-mini .pearone-menu-hover a i { display: none !important; } .pearone-mini .pearone-menu-hover a span { margin: 0px !important; } .pearone-mini .layui-nav-itemed>.pearone-menu-hover {} /**通用 Body Tab 控制器*/ .pearone-layout .layui-body .admin-tabs-control { position: absolute; top: 0px; width: 40px; height: 41px; line-height: 41px; text-align: center; cursor: pointer; transition: all .3s; box-sizing: border-box; border-left: 1px solid #f6f6f6; z-index: 999; background-color: white; border-top: 1px solid whitesmoke; border-bottom: 1px solid whitesmoke; } .layui-header .layui-nav-bar { opacity: 1 !important; } .pearone-layout .layui-body .layui-icon-left { left: 0; border-left: none; border-right: 1px solid whitesmoke; } .pearone-layout .layui-body .layui-icon-right { right: 40px; border-left: 1px solid whitesmoke; } .pearone-layout .layui-body .layui-icon-down { right: 0; border-left: 1px solid whitesmoke; } .admin-tabs-select.layui-nav { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0; background: 0 0; } .admin-tabs-select.layui-nav .layui-nav-item { line-height: 40px } .admin-tabs-select.layui-nav .layui-nav-item>a { height: 40px } .admin-tabs-select.layui-nav .layui-nav-item a { color: #666 } .admin-tabs-select.layui-nav .layui-nav-child { top: 46px; left: auto; right: 6px } .admin-tabs-select.layui-nav .layui-nav-child dd.layui-this, .admin-tabs-select.layui-nav .layui-nav-child dd.layui-this a { background-color: #f2f2f2 !important; color: #333 } .admin-tabs-select.layui-nav .layui-nav-bar, .admin-tabs-select.layui-nav .layui-nav-more { display: none; } /**菜单栏美化*/ .layui-nav-child dd { padding-top: 4px; padding-bottom: 4px; } /**样式扩展*/ /**选项卡扩展样式*/ .layui-tab-topline { padding: 0px; margin: 0px; } .layui-tab-topline .layui-tab-title { border: solid whitesmoke 0.0625rem; } .layui-tab-topline>.layui-tab-more li.layui-this:after, .layui-tab-topline>.layui-tab-title .layui-this:after{ border-top: 2px #2F4056 solid; } /*选项卡扩展样式*/ .layui-tab-button { padding: 0px; margin: 0px; } .layui-tab-button .layui-tab-title { height: 40px; line-height: 40px; border: 0px; background-color: whitesmoke; } .layui-tab-button .layui-tab-title li { height: 32px; line-height: 32px; background: #fff; border-radius: 3px; margin-left: 8px; border: none; } .layui-tab-button .layui-tab-title li span { margin-right: 5px; } .layui-tab-button .layui-tab-title li:hover { color: dodgerblue; } /** 选中状态 */ .layui-tab-button .layui-this { color: dodgerblue; border: none !important; border-radius: 5px; /* box-shadow: 0px 0px 3px gray; */ } /** 选中后 */ .layui-tab-button .layui-this:after { border: none; } .layui-logo .title { display: none; } .layui-tab-title li .layui-tab-close { border-radius: 50px; } .layui-tab-title li .layui-tab-close:hover { border-radius: 50px; background-color: lightgray; } .pearone-mini #topMenu { left: 180px !important; } #topMenu { transition: all .4s; left: 340px !important; } /** * 横向导航栏样式 */ .layui-bg-white *, .layui-bg-white { background-color: white !important; color: black !important; } .layui-bg-white .layui-this:after, .layui-bg-white .layui-nav-bar { background-color: black !important; } .layui-nav-topinline { padding: 0px; } .layui-nav-topinline .layui-this:after { top: 0px !important; height: 2px !important; } .layui-nav-topinline .layui-nav-bar { top: 0px !important; height: 2px !important; } .pearone-layout .layui-side-scroll::-webkit-scrollbar { width: 2px; background: none; } .pearone-layout .layui-side { overflow-x: hidden; overflow-y: hidden; } .layui-tab-circular { padding: 0px; margin: 0px; } .layui-tab-circular .layui-tab-title { height: 40px; line-height: 40px; border: 0px; background-color: whitesmoke !important; } .layui-tab-circular .layui-tab-title li { height: 32px; line-height: 32px; background: #fff; border-radius: 20px; margin-left: 8px; border: none; } .layui-tab-circular .layui-tab-title li span { margin-right: 5px; } .layui-tab-circular .layui-tab-title li:hover { color: dodgerblue; } /** 选中状态 */ .layui-tab-circular .layui-this { color: dodgerblue !important; border: none !important; box-shadow: 0px 0px 5px gray; } /** 选中后 */ .layui-tab-circular .layui-this:after { border: none; } .layui-tab-title li .layui-tab-close { border-radius: 50px; } .layui-tab-title li .layui-tab-close:hover { border-radius: 50px; background-color: lightgray; } .layui-layout-admin .layui-side { width: 220px; } .layui-header .layui-logo { width: 220px; } .downpanel { width: 120px; } .downpanel .layui-select-title !important { padding-right: 30px !important; padding-left: 10px !important; } .downpanel dl { color: #000 !important; /* top: 30px; */ font-size: 14px !important; } .downpanel .layui-select-title i { border-top-color: #fff !important; } /**选择配色方案 */ .pearone-color .color-title { padding: 10px 0 10px 20px; border-bottom: 1px solid #d9dada; margin-bottom: 8px; } .pearone-color .color-content { padding: 0 5px 0 5px; } .pearone-color .color-content ul { list-style: none; text-align: center; } .pearone-color .color-content ul li { position: relative; display: inline-block; vertical-align: top; width: 80px; height: 50px; margin: 0 15px 15px 0; padding: 2px 2px 4px 2px; background-color: #f2f2f2; cursor: pointer; font-size: 12px; color: #666; } .pearone-color .color-content li.layui-this:after, .pearone-color .color-content li:hover:after { width: 100%; height: 100%; padding: 4px; top: -5px; left: -5px; border-color: #d8d8d8; opacity: 1; } .pearone-color .color-content li:after { content: ''; position: absolute; z-index: 20; top: 50%; left: 50%; width: 1px; height: 0; border: 1px solid #f2f2f2; transition: all .3s; -webkit-transition: all .3s; opacity: 0; } /** * 移动端适应 */ @media screen and (max-width:1200px) { /* 这里是顶部菜单重叠的解决方案,可根据项目需要自行改变(备注:改变时需一同改变index.html移动导航的class --> layui-hide-*) */ .layui-header .layui-nav.layui-header-pc-menu{ display:none!important; } .layui-header .layui-nav.modules-pe{ display: block; } .pearone-mini .modules-pe{ left: 170px !important; } } @media screen and (max-width:768px) { .layui-header .layui-logo { width: 220px !important; z-index: 10002; transition: all .4s; } .pearone-mini .layui-header .layui-logo{ width: 0px!important; } .show-menu .layui-side{ z-index: 10002; } .pearone-layout.show-menu .site-mobile-shade{ display: block; } .pearone-mini .layui-side { width: 0px !important; } .layui-body { left: 0px !important; } .layui-header .layui-layout-left { left: 0px !important; } .layui-header .layui-layout-left.modules-pe{ left: 110px !important; } .layui-side { width: 220px !important; } .layui-side .layui-nav-item>a span { display: inline-block; } .pearone-mini .layui-layout-admin .layui-body { bottom: 0px !important !important; } .pearone-mini .layui-layout-admin .layui-logo .logo{ display: none; } } @media screen and (max-width:480px) { /* 超小分辨率适配 需要隐藏的元素加上 small-mobile 属性即可 */ .pearone-layout [small-mobile]{ display: none; } .layui-nav-topinline .layui-nav-item .layui-nav-child{ left: -45px; } } /* 移动设备遮罩层样式 */ .site-mobile-shade { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, .25); transition: background-color .3s; z-index: 10001; cursor: pointer; display: none; } /* 弹窗全局样式 */ .layui-layer-btn a { height: 30px; text-align: center; color: white; font-size: 13px; border-radius: 4px; padding-left: 30px; padding-right: 30px; } .layui-layer-btn1 { color: gray !important; } .layui-layer { border-radius: 4px !important; } .layui-layer .layui-layer-title { /* background-color: white!important; */ border-top-right-radius: 4px; border-top-left-radius: 4px; /* border-bottom: none; */ } #multileTab .layui-tab-bar { display: none; height: 0px; } @-webkit-keyframes am-horizontal-roll_show { 0% { opacity: 1; -webkit-transform: translateX(2000px); transform: translateX(2000px) } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes am-horizontal-roll_show { 0% { opacity: 1; -webkit-transform: translateX(400px); -ms-transform: translateX(400px); transform: translateX(400px) } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } } .layer-anim-07 { -webkit-animation: am-horizontal-roll_show .5s ease-out; animation: am-horizontal-roll_show .5s ease-out;