新增侧边栏浅色主题（参数管理配置）

5 years ago · 300f565e8b
parent 70ab63461f
commit 300f565e8b
3 changed files with 116 additions and 1 deletions
--- a/ruoyi-admin/src/main/resources/static/css/skins.css
+++ b/ruoyi-admin/src/main/resources/static/css/skins.css
@ -848,3 +848,117 @@
 	border-bottom-right-radius: 2px;
 	border-bottom-left-radius: 0
 }
+
+/*
+ *
+ *   侧边栏主题 若依管理系统
+ *   NAME - .theme-dark/theme-light
+ *
+*/
+/** 深色主题 .theme-dark **/
+.theme-dark .user-panel>.info>p, .theme-dark .user-panel>.info, .theme-dark .user-panel>.info>a{
+	color: #fff
+}
+
+.theme-dark .nav>li.active {
+	background: #293846;
+}
+
+.theme-dark .navbar-static-side {
+	background-color: #2f4050;
+}
+
+.theme-dark .user-panel {
+	background-color: #2f4050;
+}
+
+.theme-dark .navbar-default .nav>li>a:hover,
+.theme-dark .navbar-default .nav>li>a:focus {
+	background: #293846;
+}
+
+/** 浅色主题 theme-light **/
+.theme-light .user-panel>.info>p, .theme-light .user-panel>.info, .theme-light .user-panel>.info>a{
+	color: #555
+}
+
+.theme-light .nav>li.active{
+	background: #f9fafc;
+}
+
+.theme-light .navbar-static-side {
+	background-color: #f9fafc;
+	box-shadow: 2px 0 2px 0 rgba(29,35,41,.05);
+}
+
+.theme-light .user-panel {
+	background-color: #f9fafc;
+}
+
+.theme-light .navbar-default .nav>li>a {
+	color: #777;
+}
+
+.theme-light.skin-blue .navbar-default .nav>li.active>a {
+	color: #1890ff;
+}
+
+.theme-light.skin-blue .navbar-default .nav>li.selected>a,
+.theme-light.skin-blue .navbar-default .nav>li.selected>a:focus {
+	background-color: rgb(240, 245, 255);
+	color: rgb(47, 84, 235);
+}
+
+.theme-light.skin-green .navbar-default .nav>li.active>a {
+	color: #52c41a;
+}
+
+.theme-light.skin-green .navbar-default .nav>li.selected>a,
+.theme-light.skin-green .navbar-default .nav>li.selected>a:focus {
+	background-color: rgb(246, 255, 237);
+	color: rgb(82, 196, 26);
+}
+
+.theme-light.skin-purple .navbar-default .nav>li.active>a {
+	color: rgb(114, 46, 209);
+}
+
+.theme-light.skin-purple .navbar-default .nav>li.selected>a,
+.theme-light.skin-purple .navbar-default .nav>li.selected>a:focus {
+	background-color: #f9f0ff;
+	color: #722ed1;
+}
+
+.theme-light.skin-red .navbar-default .nav>li.active>a {
+	color: rgb(245, 34, 45);
+}
+
+.theme-light.skin-red .navbar-default .nav>li.selected>a,
+.theme-light.skin-red .navbar-default .nav>li.selected>a:focus {
+	background-color: rgb(255, 241, 240);
+	color: rgb(245, 34, 45);
+}
+
+.theme-light.skin-yellow .navbar-default .nav>li.active>a {
+	color: rgb(250, 173, 20);
+}
+
+.theme-light.skin-yellow .navbar-default .nav>li.selected>a,
+.theme-light.skin-yellow .navbar-default .nav>li.selected>a:focus {
+	background-color: #fffbe6;
+	color: #faad14;
+}
+
+.theme-light .navbar-default .nav>li>a:hover,
+.theme-light .navbar-default .nav>li>a:focus {
+	background-color: rgb(240, 245, 255);
+}
+
+.fixed-sidebar.theme-light.mini-navbar .nav li:hover>a> span.nav-label {
+    background-color: #f9fafc;
+}
+
+.fixed-sidebar.theme-light.mini-navbar .nav li:hover>.nav-second-level {
+    background-color: #f9fafc;
+}
+ 
--- a/ruoyi-admin/src/main/resources/templates/index.html
+++ b/ruoyi-admin/src/main/resources/templates/index.html
@ -17,7 +17,7 @@
    <link th:href="@{/css/skins.css}" rel="stylesheet"/>
    <link th:href="@{/ruoyi/css/ry-ui.css?v=3.4.0}" rel="stylesheet"/>
 </head>
-<body class="fixed-sidebar full-height-layout gray-bg" style="overflow: hidden" th:classappend="${@config.getKey('sys.index.skinName')}">
+<body class="fixed-sidebar full-height-layout gray-bg" style="overflow: hidden" th:classappend="|${@config.getKey('sys.index.sideTheme')} ${@config.getKey('sys.index.skinName')}|">
 <div id="wrapper">

    <!--左侧导航开始-->
--- a/sql/ry_20190719.sql
+++ b/sql/ry_20190719.sql
@ -524,6 +524,7 @@ create table sys_config (

 insert into sys_config values(1, '主框架页-默认皮肤样式名称', 'sys.index.skinName',     'skin-blue',     'Y', 'admin', '2018-03-16 11-33-00', 'ry', '2018-03-16 11-33-00', '蓝色 skin-blue、绿色 skin-green、紫色 skin-purple、红色 skin-red、黄色 skin-yellow' );
 insert into sys_config values(2, '用户管理-账号初始密码',     'sys.user.initPassword',  '123456',        'Y', 'admin', '2018-03-16 11-33-00', 'ry', '2018-03-16 11-33-00', '初始化密码 123456' );
+insert into sys_config values(3, '主框架页-侧边栏主题',       'sys.index.sideTheme',    'theme-dark',    'Y', 'admin', '2018-03-16 11-33-00', 'ry', '2018-03-16 11-33-00', '深色主题theme-dark，浅色主题theme-light' );


 -- ----------------------------