|
|
@@ -1,7 +1,11 @@
|
|
|
/*
|
|
|
* 新华 ERP — 简洁后台主题
|
|
|
*/
|
|
|
-.skin-blue-light .main-header .logo,
|
|
|
+.skin-blue-light .main-header {
|
|
|
+ box-shadow: none !important;
|
|
|
+ border: none !important;
|
|
|
+}
|
|
|
+
|
|
|
.skin-blue-light .main-header .navbar {
|
|
|
background: #ffffff !important;
|
|
|
color: #1f1f1f !important;
|
|
|
@@ -10,13 +14,20 @@
|
|
|
}
|
|
|
|
|
|
.skin-blue-light .main-header .logo {
|
|
|
- border-right: 1px solid #f0f0f0 !important;
|
|
|
+ background: #1a3a6e !important;
|
|
|
+ border: none !important;
|
|
|
+ border-right: 1px solid #152f5c !important;
|
|
|
+ border-bottom: none !important;
|
|
|
+ color: #ffffff !important;
|
|
|
font-weight: 600;
|
|
|
font-size: 15px !important;
|
|
|
+ /* 与下方侧栏无缝衔接,避免露出白线空隙 */
|
|
|
+ box-shadow: none !important;
|
|
|
}
|
|
|
|
|
|
.skin-blue-light .main-header .logo:hover {
|
|
|
- background: #fafafa !important;
|
|
|
+ background: #163560 !important;
|
|
|
+ color: #ffffff !important;
|
|
|
}
|
|
|
|
|
|
.skin-blue-light .main-header .navbar .nav > li > a,
|
|
|
@@ -36,13 +47,22 @@
|
|
|
}
|
|
|
|
|
|
.skin-blue-light .main-sidebar,
|
|
|
-.skin-blue-light .left-side {
|
|
|
- background: #ffffff !important;
|
|
|
+.skin-blue-light .left-side,
|
|
|
+.skin-blue-light .main-sidebar .sidebar {
|
|
|
+ background: #1a3a6e !important;
|
|
|
+ background-color: #1a3a6e !important;
|
|
|
+}
|
|
|
+
|
|
|
+/* fixed 布局必须留出顶栏高度,否则用户信息会顶到 logo 下面 */
|
|
|
+.fixed.skin-blue-light .main-sidebar,
|
|
|
+.fixed.skin-blue-light .left-side {
|
|
|
+ padding-top: 50px !important;
|
|
|
}
|
|
|
|
|
|
.skin-blue-light .main-sidebar {
|
|
|
- border-right: 1px solid #f0f0f0;
|
|
|
+ border-right: 1px solid #152f5c !important;
|
|
|
box-shadow: none !important;
|
|
|
+ border-top: none !important;
|
|
|
}
|
|
|
|
|
|
.skin-blue-light .content-wrapper,
|
|
|
@@ -64,14 +84,23 @@
|
|
|
}
|
|
|
|
|
|
.skin-blue-light .sidebar .user-panel {
|
|
|
- border-bottom: 1px solid #f5f5f5;
|
|
|
+ border-bottom: 1px solid rgba(255, 255, 255, 0.12);
|
|
|
padding-bottom: 12px;
|
|
|
margin-bottom: 6px;
|
|
|
}
|
|
|
|
|
|
+.skin-blue-light .sidebar .user-panel > .info {
|
|
|
+ left: 55px;
|
|
|
+ line-height: 45px;
|
|
|
+}
|
|
|
+
|
|
|
+.skin-blue-light .sidebar .user-panel > .info > p {
|
|
|
+ margin: 0;
|
|
|
+}
|
|
|
+
|
|
|
.skin-blue-light .sidebar-menu > li.header {
|
|
|
background: transparent !important;
|
|
|
- color: #bfbfbf !important;
|
|
|
+ color: rgba(255, 255, 255, 0.45) !important;
|
|
|
font-size: 12px;
|
|
|
}
|
|
|
|
|
|
@@ -79,52 +108,156 @@
|
|
|
border-radius: 6px;
|
|
|
margin: 1px 8px;
|
|
|
padding: 10px 12px !important;
|
|
|
- color: #434343 !important;
|
|
|
+ color: rgba(255, 255, 255, 0.92) !important;
|
|
|
border-left: none !important;
|
|
|
}
|
|
|
|
|
|
+.skin-blue-light .sidebar-menu > li > a > .fa,
|
|
|
+.skin-blue-light .sidebar-menu > li > a > .glyphicon,
|
|
|
+.skin-blue-light .sidebar-menu > li > a > .ion,
|
|
|
+.skin-blue-light .sidebar-menu > li > a > .pull-right-container > .fa {
|
|
|
+ color: rgba(255, 255, 255, 0.8) !important;
|
|
|
+}
|
|
|
+
|
|
|
+/* 悬停:白底黑字 */
|
|
|
.skin-blue-light .sidebar-menu > li:hover > a {
|
|
|
- background: #f5f5f5 !important;
|
|
|
+ background: #ffffff !important;
|
|
|
+ color: #1f1f1f !important;
|
|
|
+}
|
|
|
+
|
|
|
+.skin-blue-light .sidebar-menu > li:hover > a > .fa,
|
|
|
+.skin-blue-light .sidebar-menu > li:hover > a > .glyphicon,
|
|
|
+.skin-blue-light .sidebar-menu > li:hover > a > .ion,
|
|
|
+.skin-blue-light .sidebar-menu > li:hover > a > .pull-right-container > .fa {
|
|
|
color: #1f1f1f !important;
|
|
|
}
|
|
|
|
|
|
.skin-blue-light .sidebar-menu > li.active > a {
|
|
|
- background: #e6f4ff !important;
|
|
|
- color: #1677ff !important;
|
|
|
+ background: #ffffff !important;
|
|
|
+ color: #1f1f1f !important;
|
|
|
font-weight: 500;
|
|
|
box-shadow: none !important;
|
|
|
}
|
|
|
|
|
|
+.skin-blue-light .sidebar-menu > li.active > a > .fa,
|
|
|
+.skin-blue-light .sidebar-menu > li.active > a > .glyphicon,
|
|
|
+.skin-blue-light .sidebar-menu > li.active > a > .ion,
|
|
|
+.skin-blue-light .sidebar-menu > li.active > a > .pull-right-container > .fa {
|
|
|
+ color: #1f1f1f !important;
|
|
|
+}
|
|
|
+
|
|
|
.skin-blue-light .treeview-menu > li > a {
|
|
|
- color: #8c8c8c !important;
|
|
|
+ color: rgba(255, 255, 255, 0.78) !important;
|
|
|
}
|
|
|
|
|
|
.skin-blue-light .treeview-menu > li.active > a,
|
|
|
.skin-blue-light .treeview-menu > li > a:hover {
|
|
|
- color: #1677ff !important;
|
|
|
+ background: #ffffff !important;
|
|
|
+ color: #1f1f1f !important;
|
|
|
}
|
|
|
|
|
|
.skin-blue-light .sidebar-menu > li > .treeview-menu {
|
|
|
- background: transparent !important;
|
|
|
+ background: rgba(0, 0, 0, 0.18) !important;
|
|
|
}
|
|
|
|
|
|
-/* 侧栏收起后悬浮子菜单:必须实色底,否则表格内容会透出来 */
|
|
|
+/* 侧栏收起后悬浮层:标题与子菜单贴合成一块,贴紧 50px 侧栏 */
|
|
|
@media (min-width: 768px) {
|
|
|
- .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right),
|
|
|
- .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li {
|
|
|
+ position: relative !important;
|
|
|
+ }
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li > a {
|
|
|
+ margin: 0 !important;
|
|
|
+ border-radius: 0 !important;
|
|
|
+ padding-left: 0 !important;
|
|
|
+ padding-right: 0 !important;
|
|
|
+ text-align: center !important;
|
|
|
+ }
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a,
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a {
|
|
|
+ width: 50px !important;
|
|
|
+ background: #ffffff !important;
|
|
|
+ color: #1f1f1f !important;
|
|
|
+ }
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > .fa,
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.active > a > .fa {
|
|
|
+ color: #1f1f1f !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 无子菜单:不弹出标题白条 */
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li:not(.treeview):hover > a > span,
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li:not(.treeview):hover > a > .pull-right-container {
|
|
|
+ display: none !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ /* 有子菜单:标题 + 列表同一左缘、无空隙 */
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > a > span:not(.pull-right),
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > .treeview-menu {
|
|
|
+ display: block !important;
|
|
|
+ position: absolute !important;
|
|
|
+ left: 50px !important;
|
|
|
+ margin: 0 !important;
|
|
|
+ margin-left: 0 !important;
|
|
|
+ width: 200px !important;
|
|
|
background: #ffffff !important;
|
|
|
+ color: #1f1f1f !important;
|
|
|
+ z-index: 1200 !important;
|
|
|
+ box-sizing: border-box !important;
|
|
|
+ }
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > a > span:not(.pull-right) {
|
|
|
+ top: 0 !important;
|
|
|
+ height: 40px !important;
|
|
|
+ line-height: 40px !important;
|
|
|
+ padding: 0 14px !important;
|
|
|
+ font-weight: 600;
|
|
|
+ border: 1px solid #e2e8f0 !important;
|
|
|
+ border-bottom: 1px solid #f0f0f0 !important;
|
|
|
+ border-radius: 0 6px 0 0 !important;
|
|
|
+ box-shadow: none !important;
|
|
|
+ overflow: hidden;
|
|
|
+ white-space: nowrap;
|
|
|
+ text-overflow: ellipsis;
|
|
|
}
|
|
|
- .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu {
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > a > .pull-right-container {
|
|
|
+ display: none !important;
|
|
|
+ visibility: hidden !important;
|
|
|
+ }
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview > .treeview-menu,
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > .treeview-menu {
|
|
|
+ top: 40px !important;
|
|
|
background: #ffffff !important;
|
|
|
- border: 1px solid #f0f0f0 !important;
|
|
|
- box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1) !important;
|
|
|
- z-index: 1100 !important;
|
|
|
+ border: 1px solid #e2e8f0 !important;
|
|
|
+ border-top: none !important;
|
|
|
+ border-radius: 0 0 6px 6px !important;
|
|
|
+ box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.1) !important;
|
|
|
+ padding: 2px 0 4px !important;
|
|
|
+ min-width: 200px !important;
|
|
|
+ max-height: 70vh;
|
|
|
+ overflow-y: auto;
|
|
|
+ }
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > .treeview-menu > li > a {
|
|
|
+ color: #1f1f1f !important;
|
|
|
+ background: transparent !important;
|
|
|
+ padding: 8px 14px !important;
|
|
|
+ white-space: nowrap;
|
|
|
+ border-radius: 0 !important;
|
|
|
+ margin: 0 !important;
|
|
|
+ text-align: left !important;
|
|
|
+ width: 100% !important;
|
|
|
+ box-sizing: border-box !important;
|
|
|
+ }
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > .treeview-menu > li > a > .fa,
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > .treeview-menu > li > a > .glyphicon,
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > .treeview-menu > li > a > .ion {
|
|
|
+ color: #595959 !important;
|
|
|
+ width: 18px;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
- .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right) {
|
|
|
- border: 1px solid #f0f0f0 !important;
|
|
|
- box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > .treeview-menu > li > a:hover,
|
|
|
+ .skin-blue-light.sidebar-mini.sidebar-collapse .sidebar-menu > li.treeview:hover > .treeview-menu > li.active > a {
|
|
|
+ background: #f0f5fb !important;
|
|
|
color: #1f1f1f !important;
|
|
|
}
|
|
|
+
|
|
|
.skin-black.sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu,
|
|
|
.skin-black.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
|
|
|
background: #222d32 !important;
|
|
|
@@ -142,7 +275,7 @@
|
|
|
|
|
|
.skin-blue-light .user-panel > .info,
|
|
|
.skin-blue-light .user-panel > .info > a {
|
|
|
- color: #434343 !important;
|
|
|
+ color: rgba(255, 255, 255, 0.92) !important;
|
|
|
}
|
|
|
|
|
|
.user-panel > .image,
|
|
|
@@ -176,7 +309,7 @@
|
|
|
.skin-blue-light .nav-addtabs > li > a {
|
|
|
color: #8c8c8c !important;
|
|
|
border-radius: 0;
|
|
|
- padding: 0 14px !important;
|
|
|
+ padding: 0 22px 0 14px !important;
|
|
|
height: 48px !important;
|
|
|
line-height: 48px !important;
|
|
|
border-right: 1px solid #f5f5f5 !important;
|
|
|
@@ -200,6 +333,25 @@
|
|
|
font-weight: 500;
|
|
|
}
|
|
|
|
|
|
+/* 白底顶栏:恢复页签关闭 ×(原色 #eee/#f6f6f6 在白底上看不见) */
|
|
|
+.skin-blue-light .nav-addtabs > li {
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.skin-blue-light .main-header .navbar .nav-addtabs li > .close-tab,
|
|
|
+.skin-blue-light .nav-addtabs > li > .close-tab {
|
|
|
+ color: #bfbfbf !important;
|
|
|
+ right: 4px;
|
|
|
+ z-index: 120;
|
|
|
+}
|
|
|
+.skin-blue-light .nav-addtabs > li:hover > .close-tab,
|
|
|
+.skin-blue-light .nav-addtabs > li.active > .close-tab {
|
|
|
+ display: block !important;
|
|
|
+ color: #8c8c8c !important;
|
|
|
+}
|
|
|
+.skin-blue-light .nav-addtabs > li > .close-tab:hover {
|
|
|
+ color: #1677ff !important;
|
|
|
+}
|
|
|
+
|
|
|
body.inside-header.inside-aside,
|
|
|
body.inside-header.inside-aside #main,
|
|
|
body.inside-header.inside-aside .tab-content,
|
|
|
@@ -320,11 +472,38 @@ body.inside-aside .content,
|
|
|
|
|
|
/* 导航与内容仅竖线分隔;勿清 content-wrapper 的 margin-left(侧栏占位依赖它) */
|
|
|
.skin-blue-light .main-sidebar {
|
|
|
- border-right: 1px solid #e8e8e8 !important;
|
|
|
+ border-right: 1px solid #152f5c !important;
|
|
|
}
|
|
|
.skin-blue-light .content-wrapper {
|
|
|
border-left: none !important;
|
|
|
}
|
|
|
+
|
|
|
+/* 左侧菜单略收窄(默认 230 → 200) */
|
|
|
+@media (min-width: 768px) {
|
|
|
+ .skin-blue-light .main-sidebar,
|
|
|
+ .skin-blue-light .left-side {
|
|
|
+ width: 200px !important;
|
|
|
+ }
|
|
|
+ .skin-blue-light .main-header .logo {
|
|
|
+ width: 200px !important;
|
|
|
+ }
|
|
|
+ .skin-blue-light:not(.sidebar-collapse) .content-wrapper,
|
|
|
+ .skin-blue-light:not(.sidebar-collapse) .right-side,
|
|
|
+ .skin-blue-light:not(.sidebar-collapse) .main-footer {
|
|
|
+ margin-left: 200px !important;
|
|
|
+ }
|
|
|
+ .skin-blue-light:not(.sidebar-collapse) .main-header .navbar {
|
|
|
+ margin-left: 200px !important;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.skin-blue-light .sidebar-menu > li > a {
|
|
|
+ padding-left: 10px !important;
|
|
|
+ padding-right: 8px !important;
|
|
|
+}
|
|
|
+.skin-blue-light .sidebar-menu .treeview-menu > li > a {
|
|
|
+ padding-left: 28px !important;
|
|
|
+}
|
|
|
/* 只清 iframe / 页签内容的边距,绝不能清 .content-wrapper 自身的 margin-left */
|
|
|
.skin-blue-light .content-wrapper > .tab-pane,
|
|
|
.skin-blue-light .content-wrapper.tab-addtabs > .tab-pane,
|
|
|
@@ -337,14 +516,6 @@ body.inside-aside .content,
|
|
|
|
|
|
/* 明确恢复 AdminLTE 侧栏占位,避免内容整体贴到左侧被侧栏挡住 */
|
|
|
@media (min-width: 768px) {
|
|
|
- .skin-blue-light:not(.sidebar-collapse) .content-wrapper,
|
|
|
- .skin-blue-light:not(.sidebar-collapse) .right-side,
|
|
|
- .skin-blue-light:not(.sidebar-collapse) .main-footer {
|
|
|
- margin-left: 230px !important;
|
|
|
- }
|
|
|
- .skin-blue-light:not(.sidebar-collapse) .main-header .navbar {
|
|
|
- margin-left: 230px !important;
|
|
|
- }
|
|
|
.skin-blue-light.sidebar-mini.sidebar-collapse .content-wrapper,
|
|
|
.skin-blue-light.sidebar-mini.sidebar-collapse .right-side,
|
|
|
.skin-blue-light.sidebar-mini.sidebar-collapse .main-footer {
|