mirror of
https://gitee.com/zoujingli/ThinkAdmin.git
synced 2025-04-05 19:41:44 +08:00
修改后台样式
This commit is contained in:
parent
08108ea482
commit
b5f3d499e3
@ -19,7 +19,7 @@
|
||||
<div class="layui-form-item">
|
||||
<div class="help-label label-required-prev"><b>后台默认主题</b>Theme</div>
|
||||
<div class="layui-input">
|
||||
{foreach ['default'=>'默认主题','white'=>'简约白色','black'=>'精典黑色'] as $k=>$v}
|
||||
{foreach ['default'=>'默认色','white'=>'简约白','black'=>'精典黑','red'=>'玫瑰红','blue'=>'天空蓝'] as $k=>$v}
|
||||
<label class="think-radio">
|
||||
{if sysconf('base.site_theme') eq $k}
|
||||
<input name="site_theme" type="radio" value="{$k}" lay-ignore checked> {$v}
|
||||
|
@ -43,7 +43,7 @@
|
||||
@TopHeaderNavActiveBackColor: rgba(0, 0, 0, 0.10);
|
||||
|
||||
// 左侧菜单布局颜色
|
||||
@LeftMainBackColor: #393D49 !important;
|
||||
@LeftMainBackColor: #20222A !important;
|
||||
|
||||
@LeftMainNavHoverBackColor: rgba(99, 99, 99, 0.2);
|
||||
@LeftMainNavHoverTextColor: #FFF;
|
||||
|
@ -154,6 +154,7 @@
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
box-shadow: none !important;
|
||||
line-height: @TopHeaderHeight;
|
||||
border-bottom: @TopHeaderBottomLine;
|
||||
|
||||
@ -227,8 +228,8 @@
|
||||
.layui-side-icon:after,
|
||||
.layui-side-tree:after {
|
||||
height: @TopHeaderHeight;
|
||||
display: block;
|
||||
content: '';
|
||||
display: block;
|
||||
}
|
||||
|
||||
.layui-nav-tree {
|
||||
@ -245,19 +246,14 @@
|
||||
}
|
||||
|
||||
.layui-nav-item {
|
||||
border-bottom: @TopHeaderBottomLine;
|
||||
// border-bottom: @TopHeaderBottomLine;
|
||||
|
||||
> a {
|
||||
background: rgba(100, 100, 100, .30) !important;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(100, 100, 100, .35) !important;
|
||||
}
|
||||
> a:hover {
|
||||
// background-color: rgba(100, 100, 100, .2) !important;
|
||||
}
|
||||
|
||||
.layui-nav-child {
|
||||
padding: 0;
|
||||
background-color: unset !important;
|
||||
}
|
||||
|
||||
dd, dd > a {
|
||||
@ -279,12 +275,6 @@
|
||||
line-height: 45px;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
color: @LeftMainNavNormalTextColor;
|
||||
|
||||
&:hover {
|
||||
color: @LeftMainNavHoverTextColor;
|
||||
background: @LeftMainNavHoverBackColor
|
||||
}
|
||||
|
||||
.nav-icon {
|
||||
padding-right: 5px;
|
||||
@ -396,6 +386,10 @@
|
||||
display: none !important
|
||||
}
|
||||
|
||||
.layui-side-target:before {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
.layui-nav-item {
|
||||
a {
|
||||
padding: 0
|
||||
|
71
public/static/theme/css/_layout_.less
Normal file
71
public/static/theme/css/_layout_.less
Normal file
@ -0,0 +1,71 @@
|
||||
> .layui-header {
|
||||
background: @headNormalBackColor;
|
||||
|
||||
.layui-nav-item {
|
||||
&.layui-this > a {
|
||||
color: @headActionTextColor;
|
||||
background: @headActiveBackColor;
|
||||
}
|
||||
|
||||
> a {
|
||||
color: @headNormalTextColor;
|
||||
|
||||
&:hover {
|
||||
color: @headActionTextColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .layui-body {
|
||||
> .think-page-body > .layui-card > .layui-card-header {
|
||||
box-sizing: border-box;
|
||||
border-bottom: @TopHeaderBottomLine;
|
||||
}
|
||||
}
|
||||
|
||||
.layui-side {
|
||||
|
||||
.layui-logo {
|
||||
color: #FFF;
|
||||
box-shadow: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.layui-side-scroll {
|
||||
display: flex !important;
|
||||
box-sizing: border-box;
|
||||
border-right: @TopHeaderBottomLine;
|
||||
|
||||
.layui-side-icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.layui-side-tree {
|
||||
flex: 1;
|
||||
|
||||
.layui-nav-item {
|
||||
|
||||
a {
|
||||
color: @leftNormalTextColor;
|
||||
border-bottom: none !important;
|
||||
|
||||
&:hover {
|
||||
color: @leftActiveTextColor;
|
||||
}
|
||||
}
|
||||
|
||||
.layui-this, &.layui-this {
|
||||
> a {
|
||||
color: @leftActiveTextColor;
|
||||
background: @leftActiveBackColor;
|
||||
}
|
||||
}
|
||||
|
||||
&ed > a {
|
||||
color: @leftActiveTextColor;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@ -1,95 +1,25 @@
|
||||
@charset "UTF-8";
|
||||
@import "_config.less";
|
||||
|
||||
|
||||
.layui-layout-theme-black {
|
||||
&.layui-layout-left-mini {
|
||||
> .layui-side .layui-side-target:before {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
@mainActiveBack: #23262E !important;
|
||||
@mainNormalBack: rgba(0, 0, 0, 0.1) !important;
|
||||
|
||||
> .layui-header {
|
||||
background: #393D49 !important;
|
||||
@mainActionText: #FFFFFF !important;
|
||||
@mainNormalText: #EEEEEE !important;
|
||||
|
||||
.layui-nav-item {
|
||||
&.layui-this > a {
|
||||
color: #ffffff !important;
|
||||
background: #098 !important;
|
||||
}
|
||||
@headNormalBackColor: @mainActiveBack;
|
||||
@headActiveBackColor: #098 !important;
|
||||
|
||||
> a {
|
||||
color: #fefefe !important;
|
||||
@headNormalTextColor: @mainNormalText;
|
||||
@headActionTextColor: @mainActionText;
|
||||
|
||||
&:hover {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@leftNormalTextColor: @mainNormalText;
|
||||
@leftActiveTextColor: @mainActionText;
|
||||
|
||||
> .layui-body {
|
||||
> .think-page-body > .layui-card > .layui-card-header {
|
||||
box-sizing: border-box;
|
||||
box-shadow: none !important;
|
||||
border-bottom: @TopHeaderBottomLine;
|
||||
}
|
||||
}
|
||||
@leftNormalBackColor: @mainNormalBack;
|
||||
@leftActiveBackColor: #098 !important;
|
||||
|
||||
.layui-side {
|
||||
|
||||
.layui-logo {
|
||||
color: #fff;
|
||||
box-shadow: none;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.layui-side-scroll {
|
||||
display: flex !important;
|
||||
box-sizing: border-box;
|
||||
border-right: @TopHeaderBottomLine;
|
||||
|
||||
.layui-side-icon {
|
||||
width: 60px;
|
||||
display: none;
|
||||
|
||||
a {
|
||||
height: 60px;
|
||||
display: block;
|
||||
text-align: center;
|
||||
line-height: 60px;
|
||||
}
|
||||
|
||||
.layui-icon {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.layui-side-tree {
|
||||
flex: 1;
|
||||
|
||||
.layui-nav-item {
|
||||
border-bottom-color: rgba(0, 0, 0, 0);
|
||||
|
||||
a {
|
||||
color: #fff !important;
|
||||
border-bottom: none !important;
|
||||
|
||||
&:hover {
|
||||
color: #fff !important;
|
||||
}
|
||||
}
|
||||
|
||||
.layui-this, &.layui-this {
|
||||
> a {
|
||||
color: #fff !important;
|
||||
}
|
||||
}
|
||||
|
||||
&ed > a {
|
||||
color: #fff !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@import (multiple)"_layout_.less";
|
||||
}
|
||||
|
25
public/static/theme/css/_layout_blue.less
Normal file
25
public/static/theme/css/_layout_blue.less
Normal file
@ -0,0 +1,25 @@
|
||||
@charset "UTF-8";
|
||||
@import "_config.less";
|
||||
|
||||
|
||||
.layui-layout-theme-blue {
|
||||
@mainActiveBack: #1890FF !important;
|
||||
@mainNormalBack: rgba(0, 0, 0, 0.1) !important;
|
||||
|
||||
@mainActionText: #FFFFFF !important;
|
||||
@mainNormalText: #EEEEEE !important;
|
||||
|
||||
@headNormalBackColor: @mainActiveBack;
|
||||
@headActiveBackColor: @mainNormalBack;
|
||||
|
||||
@headNormalTextColor: @mainNormalText;
|
||||
@headActionTextColor: @mainActionText;
|
||||
|
||||
@leftNormalTextColor: @mainNormalText;
|
||||
@leftActiveTextColor: @mainActionText;
|
||||
|
||||
@leftNormalBackColor: @mainNormalBack;
|
||||
@leftActiveBackColor: @mainActiveBack;
|
||||
|
||||
@import (multiple)"_layout_.less";
|
||||
}
|
24
public/static/theme/css/_layout_red.less
Normal file
24
public/static/theme/css/_layout_red.less
Normal file
@ -0,0 +1,24 @@
|
||||
@charset "UTF-8";
|
||||
@import "_config.less";
|
||||
|
||||
.layui-layout-theme-red {
|
||||
@mainActiveBack: #AA3130 !important;
|
||||
@mainNormalBack: rgba(0, 0, 0, 0.1) !important;
|
||||
|
||||
@mainActionText: #FFFFFF !important;
|
||||
@mainNormalText: #EEEEEE !important;
|
||||
|
||||
@headNormalBackColor: @mainActiveBack;
|
||||
@headActiveBackColor: @mainNormalBack;
|
||||
|
||||
@headNormalTextColor: @mainNormalText;
|
||||
@headActionTextColor: @mainActionText;
|
||||
|
||||
@leftNormalTextColor: @mainNormalText;
|
||||
@leftActiveTextColor: @mainActionText;
|
||||
|
||||
@leftNormalBackColor: @mainNormalBack;
|
||||
@leftActiveBackColor: @mainActiveBack;
|
||||
|
||||
@import (multiple)"_layout_.less";
|
||||
}
|
@ -2,11 +2,6 @@
|
||||
@import "_config.less";
|
||||
|
||||
.layui-layout-theme-white {
|
||||
&.layui-layout-left-mini {
|
||||
> .layui-side .layui-side-target:before {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
|
||||
> .layui-header {
|
||||
background: none !important;
|
||||
@ -51,6 +46,10 @@
|
||||
box-sizing: border-box;
|
||||
border-right: @TopHeaderBottomLine;
|
||||
|
||||
.layui-nav-child {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
.layui-side-icon {
|
||||
width: 60px;
|
||||
display: none;
|
||||
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -66,5 +66,7 @@ body {
|
||||
@import '_custom.less';
|
||||
@import '_display.less';
|
||||
@import '_layout.less';
|
||||
@import '_layout_red.less';
|
||||
@import '_layout_blue.less';
|
||||
@import '_layout_white.less';
|
||||
@import '_layout_black.less';
|
Loading…
x
Reference in New Issue
Block a user