root
/
ok-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add: 加入主题样式，目前先弄个okadmin.theme.scss文件

master
zhizous 2019-10-31 01:05:00 +08:00
parent 7fd320189d
commit ae849fd7b4
4 changed files with 148 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
css/okadmin.css
View File

@ -1,6 +1,7 @@
@import "../lib/layui/css/layui.css";
@import "../lib/fonts/iconfont.css";
@import "./jquery.contextMenu.css";
@import "./okadmin.theme.css";
/*边距*/
.ptb20{

26
css/okadmin.theme.css Normal file
View File

@ -0,0 +1,26 @@
.okadmin.orange_theme .okadmin-header .layui-nav-item a {
color: #FF4806; }
.okadmin.orange_theme .okadmin-header .layui-icon, .okadmin.orange_theme .okadmin-header .ok-icon {
color: #FF4806; }
.okadmin.orange_theme .okadmin-header .layui-nav .layui-nav-mored {
border-color: transparent transparent #FF4806; }
.okadmin.orange_theme .okadmin-header .layui-nav .layui-nav-more {
border-color: #FF4806 transparent transparent; }
.okadmin.orange_theme .okadmin-header .layui-nav .layui-nav-bar {
background: #FF4806 !important; }
.okadmin.orange_theme .ok-left .okadmin-nav .layui-nav-bar {
background: #FF4806; }
.okadmin.orange_theme .ok-left .okadmin-nav .layui-nav-item.layui-this a {
background: #FF4806; }
.okadmin.orange_theme .ok-left .okadmin-nav .layui-nav-item .layui-nav-child .layui-this a {
background: #FF4806; }
.okadmin.orange_theme .ok-tab .okadmin-tabs-control:hover, .okadmin.orange_theme .ok-tab .layui-tab-title li.layui-this {
color: #FF4806; }

119
css/okadmin.theme.scss Normal file
View File

@ -0,0 +1,119 @@
$orange: #FF4806;
.okadmin.orange_theme{
/**头部导航*/
.okadmin-header{
.layui-nav-item a{
color: $orange;
}
.layui-icon,.ok-icon{
color: $orange;
}
.layui-nav {
.layui-nav-mored{
border-color: transparent transparent $orange;
}
.layui-nav-more{
border-color: $orange transparent transparent;
}
.layui-nav-bar{
background: $orange !important;
}
}
}
/**左侧菜单*/
.ok-left .okadmin-nav{
.layui-nav-bar{
background: $orange;
}
.layui-nav-item{
&.layui-this{
a{
background: $orange;
}
}
.layui-nav-child{
.layui-this{
a{
background: $orange;
}
}
}
}
}
/**tab栏*/
.ok-tab{
.okadmin-tabs-control:hover,
.layui-tab-title li.layui-this{
color: $orange;
}
}
}

3
index.html
View File

@ -8,9 +8,10 @@
<meta name="description" content="ok-admin v2.0，顾名思义，很赞的后台模版，它是一款基于Layui框架的轻量级扁平化且完全免费开源的网站后台管理系统模板，适合中小型CMS后台系统。">
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/>
<link rel="stylesheet" href="css/okadmin.css">
<link rel="stylesheet" href="../../nodejs/gulp_util/css/okadmin.theme.css">
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin okadmin">
<div class="layui-layout layui-layout-admin okadmin"><!-- 主题在此加 例子orange_theme -->
<!--头部导航-->
<div class="layui-header okadmin-header">
<ul class="layui-nav layui-layout-left">