.pear-admin .layui-header, .pear-admin .layui-body, .pear-admin .layui-logo, .pear-admin .layui-side{ transition: all .3s; } .pear-admin .layui-logo .title{ font-size: 20px; } .layui-header .layui-nav-more{ display: none!important; } /** * 风格 * */ .light-theme .layui-logo{ background-color: white!important; color: black!important; } .light-theme .layui-side-scroll{ background-color: white!important; color: black!important; } /** 通 用 框 架 布 局 */ .pear-admin .layui-header { left: 220px; width: calc(100% - 220px); background-color: white; } .pear-admin .layui-header .layui-nav-img{ width: 30px; height: 30px; } .pear-admin .layui-layout-control{ left: 120px; position: absolute; } .pear-admin .layui-logo{ width: 220px; height: 60px; position: relative; background-color: #28333E; } .pear-admin .layui-logo img{ width: 36px; height: 36px; } .pear-admin .layui-side { top: 0px; width: 220px; box-shadow: 2px 0 6px rgba(0, 21, 41, .35); z-index: 9999; } .pear-admin .layui-side-scroll::-webkit-scrollbar{ width:0px; height:0px; } .pear-admin .layui-side-scroll{ height: calc(100% - 60px); background-color: #28333E; } .pear-admin .layui-header .layui-nav .layui-nav-item>a { color: black; font-size: 15px; } .pear-admin .layui-body { left: 220px; bottom: 0px; } .pear-admin .layui-layout-left { left: 0px; } /** 隐 藏 布 局 样 式 */ .pear-mini .layui-side{ width: 60px; } .pear-mini .layui-header{ left: 60px; width: calc(100% - 60px); } .pear-mini .layui-body{ left: 60px; } .pear-mini .layui-logo{ width: 60px; } .pear-mini .layui-nav-tree .layui-nav-item span{ display: none; } /** 顶 部 菜 单 样 式 */ .pear-admin .layui-header .layui-nav .layui-nav-bar { top: 0px !important; height: 2px !important; background-color: #5FB878; } .pear-admin .layui-header .layui-nav .layui-this:after { display: none; } /** 新增兼容 */ @media screen and (max-width:768px) { /** 隐 藏 布 局 样 式 */ .pear-mini .layui-side{ width: 0px; } .pear-mini .layui-header{ left: 0px; width: 100%; } .pear-mini .layui-body{ left: 0px; } .pear-mini .layui-logo{ width: 0px; } .pear-admin .layui-body{ left: 0px; } .pear-admin .layui-header{ left: 0px; width: 100%; } .pear-admin .pear-cover{ width: 100%; height: 100%; background-color: #1E1E1E; display: block; position: absolute; z-index: 1000; opacity: 0; } .pear-mini .pear-cover{ display: none; } } @-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(800px); -ms-transform: translateX(800px); transform: translateX(800px) } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } } .layer-anim-right { -webkit-animation: am-horizontal-roll_show .6s ease-out; animation: am-horizontal-roll_show .6s ease-out; } .layui-layer-dialog .layui-layer-content{ padding: 0px!important; }