Browse Source

优化颜色选择器

tags/6.2.7
叙述、别离 1 year ago
parent
commit
d39aad4b18
4 changed files with 37 additions and 81 deletions
  1. +1
    -1
      src/admin/css/login.min.css
  2. +6
    -4
      src/static/web/css/admin.css
  3. +0
    -45
      src/static/web/img/color.htm
  4. +30
    -31
      src/static/web/img/colornew.htm

+ 1
- 1
src/admin/css/login.min.css View File

@@ -1 +1 @@
body{line-height:1.6;letter-spacing:.6px;font:14px Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif;color:#545b62;background:#f5f5f5}a{color:#545b62}a:hover{color:#ff8400;text-decoration:none}h2{line-height:1.6;font-size:24px;color:#393d49;font-weight:600}.btn,input,select{font-size:14px!important}.admin-head{padding:1rem 0;background:#fff}.admin-nav{height:36px;line-height:36px}.admin-nav-a{padding-right:30px}.dropdown-menu{min-width:8rem;font-size:14px}.dropdown-item{padding:0 1rem;height:30px;line-height:30px;font-size:14px;color:#545b62!important}.logo,.form-control{height:36px}.login-from{margin:0 auto;width:500px}.login-box{padding:1.25rem;background:#fff;border-radius:.5rem}.login-power{padding-top:1rem}.form-control,.btn-md,.alert,.rounded{border-radius:.5rem!important}.input-group:not(.has-validation)>.custom-file:not(:last-child) .custom-file-label,.input-group:not(.has-validation)>.custom-file:not(:last-child) .custom-file-label::after,.input-group:not(.has-validation)>.custom-select:not(:last-child),.input-group:not(.has-validation)>.form-control:not(:last-child){border-top-right-radius:0!important;border-bottom-right-radius:0!important}.input-group>.input-group-append>.btn,.input-group>.input-group-append>.input-group-text,.input-group>.input-group-prepend:first-child>.btn:not(:first-child),.input-group>.input-group-prepend:first-child>.input-group-text:not(:first-child),.input-group>.input-group-prepend:not(:first-child)>.btn,.input-group>.input-group-prepend:not(:first-child)>.input-group-text{border-top-left-radius:0!important;border-bottom-left-radius:0!important}#validateimg{border-radius:0 .5rem .5rem 0;cursor:pointer}#browsehappy{padding:20px 30px;font-size:14px;line-height:16px;color:#856404;background:#fff3cd;border-radius:.25rem;border:0}.browsehappy-close{float:right;cursor:pointer}@media (max-width:760px){.admin-head{padding:1rem 15px}.admin-nav-a{display:none!important}.login-from{width:100%}}
body{line-height:1.6;letter-spacing:.6px;font:14px Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif;color:#545b62;background:#f5f5f5}a{color:#545b62}a:hover{color:#ff8400;text-decoration:none}h2{line-height:1.6;font-size:24px;color:#393d49;font-weight:600}.btn,input,select{font-size:14px!important}.admin-head{padding:1rem 0;background:#fff}.admin-nav{height:36px;line-height:36px}.admin-nav-a{padding-right:30px}.dropdown-menu{min-width:8rem;font-size:14px}.dropdown-item{padding:0 1rem;height:30px;line-height:30px;font-size:14px;color:#545b62!important}.logo,.form-control{height:36px}.login-from{margin:0 auto;width:500px}.login-box{padding:1.25rem;background:#fff}.login-power{padding-top:1rem}.login-box,.form-control,.btn-md,.alert,.rounded{border-radius:.5rem!important}.input-group:not(.has-validation)>.custom-file:not(:last-child) .custom-file-label,.input-group:not(.has-validation)>.custom-file:not(:last-child) .custom-file-label::after,.input-group:not(.has-validation)>.custom-select:not(:last-child),.input-group:not(.has-validation)>.form-control:not(:last-child){border-top-right-radius:0!important;border-bottom-right-radius:0!important}.input-group>.input-group-append>.btn,.input-group>.input-group-append>.input-group-text,.input-group>.input-group-prepend:first-child>.btn:not(:first-child),.input-group>.input-group-prepend:first-child>.input-group-text:not(:first-child),.input-group>.input-group-prepend:not(:first-child)>.btn,.input-group>.input-group-prepend:not(:first-child)>.input-group-text{border-top-left-radius:0!important;border-bottom-left-radius:0!important}#validateimg{border-radius:0 .5rem .5rem 0;cursor:pointer}#browsehappy{padding:20px 30px;font-size:14px;line-height:16px;color:#856404;background:#fff3cd;border-radius:.35rem;border:0}.browsehappy-close{float:right;cursor:pointer}@media (max-width:760px){.admin-head{padding:1rem 15px}.admin-nav-a{display:none!important}.login-from{width:100%}}

+ 6
- 4
src/static/web/css/admin.css View File

@@ -429,7 +429,6 @@ body.hidemenu .body-right {
.pubdlg {
background:#fff;
border:2px solid #1eb867;
border-radius:.5rem;
z-index:8888
}
.pubdlg .title {
@@ -601,7 +600,6 @@ body.hidemenu .body-right {
max-height:60px
}
.icon img {
margin-right:10px;
width:20px;
height:20px
}
@@ -623,7 +621,7 @@ span.page-link {
color:#fff;
background:#1eb867
}
table,input,select,textarea,.search,.menu-body,.coolbg,.mysource,.mywriter,.pubdlg,.quickselItem .topcat,.web-info,.cke_chrome,.cke_inner,.pagination,.card,.form-control,.btn-sm,.alert,.rounded {
table,input,select,textarea,.search,.menu-body,.coolbg,.mysource,.mywriter,.pubdlg,.colordlg,.quickselItem .topcat,.web-info,.cke_chrome,.cke_inner,.pagination,.card,.form-control,.btn-sm,.alert,.rounded {
border-radius:.5rem!important
}
.btn-xs {
@@ -646,13 +644,17 @@ table,input,select,textarea,.search,.menu-body,.coolbg,.mysource,.mywriter,.pubd
#timerange {
width:230px
}
#selColor {
padding:0;
width:50px
}
#browsehappy {
padding:20px 30px;
font-size:14px;
line-height:16px;
color:#856404;
background:#fff3cd;
border-radius:.25rem;
border-radius:.35rem;
border:0
}
.browsehappy-close {


+ 0
- 45
src/static/web/img/color.htm View File

@@ -1,45 +0,0 @@
<html>
<head>
<meta charset="utf-8">
<title>颜色选框</title>
</head>
<body bgcolor="#C4C4B4" leftmargin="0" topmargin="0">
<script>
function ColorSel(col)
{
window.returnValue = col;
window.close();
}
</script>
<table width="100" border="0" cellspacing="1" cellpadding="1">
<tr>
<td bgcolor="#FF0000" onClick="ColorSel('#FF0000');" width="20%">&nbsp;</td>
<td bgcolor="#0000FF" onClick="ColorSel('#0000FF');" width="20%">&nbsp;</td>
<td bgcolor="#006600" onClick="ColorSel('#006600');" width="20%">&nbsp;</td>
<td bgcolor="#333333" onClick="ColorSel('#333333');" width="20%">&nbsp;</td>
<td bgcolor="#FFFF00" onClick="ColorSel('#FFFF00');" width="20%">&nbsp;</td>
</tr>
<tr>
<td bgcolor="#CC0000" onClick="ColorSel('#CC0000');">&nbsp;</td>
<td bgcolor="#0033CC" onClick="ColorSel('#0033CC');">&nbsp;</td>
<td bgcolor="#339900" onClick="ColorSel('#339900');">&nbsp;</td>
<td bgcolor="#D1DDAA" onClick="ColorSel('#D1DDAA');">&nbsp;</td>
<td bgcolor="#FFCC33" onClick="ColorSel('#FFCC33');">&nbsp;</td>
</tr>
<tr>
<td bgcolor="#990000" onClick="ColorSel('#990000');">&nbsp;</td>
<td bgcolor="#000099" onClick="ColorSel('#000099');">&nbsp;</td>
<td bgcolor="#33CC00" onClick="ColorSel('#33CC00');">&nbsp;</td>
<td bgcolor="#999999" onClick="ColorSel('#999999');">&nbsp;</td>
<td bgcolor="#FF6633" onClick="ColorSel('#FF6633');">&nbsp;</td>
</tr>
<tr>
<td bgcolor="#660000" onClick="ColorSel('#660000');">&nbsp;</td>
<td bgcolor="#330099" onClick="ColorSel('#330099');">&nbsp;</td>
<td bgcolor="#66FF00" onClick="ColorSel('#66FF00');">&nbsp;</td>
<td bgcolor="#CCCCCC" onClick="ColorSel('#CCCCCC');">&nbsp;</td>
<td bgcolor="#ffffff" onClick="ColorSel('');" align="center">无</td>
</tr>
</table>
</body>
</html>

+ 30
- 31
src/static/web/img/colornew.htm View File

@@ -1,33 +1,32 @@
<table width="100" border="0" cellspacing="1" cellpadding="1">
<tr>
<td bgcolor="#FF0000" onClick="ColorSel('#FF0000', 'color');" width="20%">&nbsp;</td>
<td bgcolor="#0000FF" onClick="ColorSel('#0000FF', 'color');" width="20%">&nbsp;</td>
<td bgcolor="#006600" onClick="ColorSel('#006600', 'color');" width="20%">&nbsp;</td>
<td bgcolor="#333333" onClick="ColorSel('#333333', 'color');" width="20%">&nbsp;</td>
<td bgcolor="#ffffff" onClick="ColorSel('', 'color');" align="center">X</td>
</tr>
<tr>
<td bgcolor="#CC0000" onClick="ColorSel('#CC0000', 'color');">&nbsp;</td>
<td bgcolor="#0033CC" onClick="ColorSel('#0033CC', 'color');">&nbsp;</td>
<td bgcolor="#339900" onClick="ColorSel('#339900', 'color');">&nbsp;</td>
<td bgcolor="#D1DDAA" onClick="ColorSel('#D1DDAA', 'color');">&nbsp;</td>
<td bgcolor="#FFCC33" onClick="ColorSel('#FFCC33', 'color');">&nbsp;</td>
</tr>
<tr>
<td bgcolor="#990000" onClick="ColorSel('#990000', 'color');">&nbsp;</td>
<td bgcolor="#000099" onClick="ColorSel('#000099', 'color');">&nbsp;</td>
<td bgcolor="#33CC00" onClick="ColorSel('#33CC00', 'color');">&nbsp;</td>
<td bgcolor="#999999" onClick="ColorSel('#999999', 'color');">&nbsp;</td>
<td bgcolor="#FF6633" onClick="ColorSel('#FF6633', 'color');">&nbsp;</td>
</tr>
<tr>
<td bgcolor="#660000" onClick="ColorSel('#660000', 'color');">&nbsp;</td>
<td bgcolor="#330099" onClick="ColorSel('#330099', 'color');">&nbsp;</td>
<td bgcolor="#66FF00" onClick="ColorSel('#66FF00', 'color');">&nbsp;</td>
<td bgcolor="#CCCCCC" onClick="ColorSel('#CCCCCC', 'color');">&nbsp;</td>
<td bgcolor="#FFFF00" onClick="ColorSel('#FFFF00', 'color');" width="20%">&nbsp;</td>
</tr>
<tr>
<td colspan="5">自定义:<input type="color" id="selColor" style="width: 50px;padding: 0;"> <button class="btn btn-sm btn-success" onclick="ColorSel(document.querySelector('#selColor').value, 'color')">确定</button></td>
</tr>
<tr>
<td bgcolor="#FF0000" onClick="ColorSel('#FF0000', 'color');" width="20%">&nbsp;</td>
<td bgcolor="#0000FF" onClick="ColorSel('#0000FF', 'color');" width="20%">&nbsp;</td>
<td bgcolor="#006600" onClick="ColorSel('#006600', 'color');" width="20%">&nbsp;</td>
<td bgcolor="#333333" onClick="ColorSel('#333333', 'color');" width="20%">&nbsp;</td>
<td bgcolor="#ffffff" onClick="ColorSel('', 'color');" width="20%" align="center">X</td>
</tr>
<tr>
<td bgcolor="#CC0000" onClick="ColorSel('#CC0000', 'color');">&nbsp;</td>
<td bgcolor="#0033CC" onClick="ColorSel('#0033CC', 'color');">&nbsp;</td>
<td bgcolor="#339900" onClick="ColorSel('#339900', 'color');">&nbsp;</td>
<td bgcolor="#D1DDAA" onClick="ColorSel('#D1DDAA', 'color');">&nbsp;</td>
<td bgcolor="#FFCC33" onClick="ColorSel('#FFCC33', 'color');">&nbsp;</td>
</tr>
<tr>
<td bgcolor="#990000" onClick="ColorSel('#990000', 'color');">&nbsp;</td>
<td bgcolor="#000099" onClick="ColorSel('#000099', 'color');">&nbsp;</td>
<td bgcolor="#33CC00" onClick="ColorSel('#33CC00', 'color');">&nbsp;</td>
<td bgcolor="#999999" onClick="ColorSel('#999999', 'color');">&nbsp;</td>
<td bgcolor="#FF6633" onClick="ColorSel('#FF6633', 'color');">&nbsp;</td>
</tr>
<tr>
<td bgcolor="#660000" onClick="ColorSel('#660000', 'color');">&nbsp;</td>
<td bgcolor="#330099" onClick="ColorSel('#330099', 'color');">&nbsp;</td>
<td bgcolor="#66FF00" onClick="ColorSel('#66FF00', 'color');">&nbsp;</td>
<td bgcolor="#CCCCCC" onClick="ColorSel('#CCCCCC', 'color');">&nbsp;</td>
<td bgcolor="#FFFF00" onClick="ColorSel('#FFFF00', 'color');">&nbsp;</td>
</tr>
</table>
<span class="d-block my-2">自定义:<input type="color" id="selColor"></span>
<button class="btn btn-sm btn-success" onclick="ColorSel(document.querySelector('#selColor').value, 'color')">确定</button>

Loading…
Cancel
Save