msb-public-java
/
xxl-job
mirror of https://gitee.com/xuxueli0323/xxl-job.git
4
2
Code Issues Projects Releases Wiki Activity

feat(admin): 添加新的主题皮肤选项并优化样式

Browse Source 
- 新增 Green、Red 和 Yellow 主题皮肤
- 重新组织主题列表结构，按层级分组显示
- 调整主题皮肤数组顺序，确保加载逻辑正确
- 优化主题预览样式，统一背景色类名使用
- 修复部分 HTML 标签属性格式问题
- 统一代码缩进风格，提升可读性
3.3.0-release
xuxueli 3 weeks ago
parent 92f1b3204f
commit 67402126f7
1 changed files with 45 additions and 14 deletions
Show Stats Download Patch File Download Diff File

59
xxl-job-admin/src/main/resources/static/biz/common/admin.setting.js
Unescape View File

@ -224,21 +224,22 @@ $(function(){
<div class="modal-body">
<!-- 主题列表 -->
<ul class="list-unstyled clearfix" >
<!-- level 1 -->
<li style="float:left; width: 33.33333%; padding: 5px;">
<a href="javascript:" data-skin='skin-blue' style="display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)" class="clearfix full-opacity-hover">
<span style='display:block; width: 20%; float: left; height: 13px; background: #367fa9;'></span>
<span style='display:block; width: 80%; float: left; height: 13px; background: #367fa9;'></span>
<span style='display:block; width: 20%; float: left; height: 30px; background: #222d32;'></span>
<span style='display:block; width: 80%; float: left; height: 30px; background: #f4f5f7;'></span>
<span style="width: 20%; float: left; height: 13px; background: #367fa9"></span>
<span style="width: 80%; float: left; height: 13px;" class='bg-light-blue'></span>
<span style="width: 20%; float: left; height: 30px; background: #222d32"></span>
<span style="width: 80%; float: left; height: 30px; background: #f4f5f7"></span>
</a>
<p class="text-center">Blue</p>
</li>
<li style="float:left; width: 33.33333%; padding: 5px;">
<a href="javascript:" data-skin="skin-black" style="display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)" class="clearfix full-opacity-hover">
<span style='display:block; width: 20%; float: left; height: 13px; background: #fefefe;'></span>
<span style='display:block; width: 80%; float: left; height: 13px; background: #fefefe;'></span>
<span style='display:block; width: 20%; float: left; height: 30px; background: #222;'></span>
<span style='display:block; width: 80%; float: left; height: 30px; background: #f4f5f7;'></span>
<span style="width: 20%; float: left; height: 13px; background: #fefefe"></span>
<span style="width: 80%; float: left; height: 13px; background: #fefefe"></span>
<span style="width: 20%; float: left; height: 30px; background: #222d32"></span>
<span style="width: 80%; float: left; height: 30px; background: #f4f5f7"></span>
</a>
<p class="text-center">Black</p>
</li>
@ -252,6 +253,36 @@ $(function(){
<p class="text-center">Purple</p>
</li>
<!-- level 2 -->
<li style="float:left; width: 33.33333%; padding: 5px;">
<a href="javascript:" data-skin="skin-green" style="display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)" class="clearfix full-opacity-hover">
<span style="width: 20%; float: left; height: 13px;" class='bg-green-active'></span>
<span style="width: 80%; float: left; height: 13px;" class='bg-green'></span>
<span style="width: 20%; float: left; height: 30px; background: #222d32"></span>
<span style="width: 80%; float: left; height: 30px; background: #f4f5f7"></span>
</a>
<p class="text-center">Green</p>
</li>
<li style="float:left; width: 33.33333%; padding: 5px;">
<a href="javascript:" data-skin="skin-red" style="display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)" class="clearfix full-opacity-hover">
<span style="width: 20%; float: left; height: 13px;" class='bg-red-active'></span>
<span style="width: 80%; float: left; height: 13px;" class='bg-red'></span>
<span style="width: 20%; float: left; height: 30px; background: #222d32"></span>
<span style="width: 80%; float: left; height: 30px; background: #f4f5f7"></span>
</a>
<p class="text-center">Red</p>
</li>
<li style="float:left; width: 33.33333%; padding: 5px;">
<a href="javascript:" data-skin="skin-yellow" style="display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)" class="clearfix full-opacity-hover">
<span style="width: 20%; float: left; height: 13px;" class='bg-yellow-active'></span>
<span style="width: 80%; float: left; height: 13px;" class='bg-yellow'></span>
<span style="width: 20%; float: left; height: 30px; background: #222d32"></span>
<span style="width: 80%; float: left; height: 30px; background: #f4f5f7"></span>
</a>
<p class="text-center">Yellow</p>
</li>
<!-- level 3 -->
<li style="float:left; width: 33.33333%; padding: 5px;">
<a href="javascript:" data-skin="skin-blue-light" style="display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)" class="clearfix full-opacity-hover">
<span style="width: 20%; float: left; height: 13px; background: #367fa9"></span>
@ -280,6 +311,7 @@ $(function(){
<p class="text-center">Purple(Light)</p>
</li>
<!-- level 4 -->
<li style="float:left; width: 33.33333%; padding: 5px;">
<a href="javascript:" data-skin="skin-green-light" style="display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)" class="clearfix full-opacity-hover">
<span style="width: 20%; float: left; height: 13px;" class='bg-green-active'></span>
@ -289,7 +321,6 @@ $(function(){
</a>
<p class="text-center">Green(Light)</p>
</li>
<li style="float:left; width: 33.33333%; padding: 5px;">
<a href="javascript:" data-skin="skin-red-light" style="display: block; box-shadow: 0 0 3px rgba(0,0,0,0.4)" class="clearfix full-opacity-hover">
<span style="width: 20%; float: left; height: 13px;" class='bg-red-active'></span>
@ -336,16 +367,16 @@ $(function(){
var skins = [
"skin-blue",
"skin-black",
"skin-red",
"skin-yellow",
"skin-purple",
"skin-green",
"skin-red",
"skin-yellow",
"skin-blue-light",
"skin-black-light",
"skin-red-light",
"skin-yellow-light",
"skin-purple-light",
"skin-green-light"
"skin-green-light",
"skin-red-light",
"skin-yellow-light"
];
/**

Write Preview
Loading…
Cancel
Save