修改后台样式

This commit is contained in:
Anyon 2022-01-20 18:38:15 +08:00
parent 08108ea482
commit b5f3d499e3
11 changed files with 153 additions and 108 deletions

View File

@ -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}

View File

@ -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;

View File

@ -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

View 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;
}
}
}
}
}

View File

@ -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";
}

View 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";
}

View 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";
}

View File

@ -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

View File

@ -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';