重构代码:重写网站设置cache-item样式

This commit is contained in:
Argo-MacBookPro 2018-10-06 17:18:52 +08:00
parent c5ad8e2e04
commit d58410566b
3 changed files with 20 additions and 17 deletions

View File

@ -23,14 +23,16 @@
.cache-item > :nth-child(2) {
flex: 0 0 auto;
width: 136px;
}
.cache-item > :nth-child(3) {
.cache-item > :nth-child(4) {
flex: 1 1 auto;
display: block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
margin-left: 10px;
}
}

View File

@ -404,28 +404,29 @@ a, a:hover, a:focus {
border-width: 0 1px 1px 1px;
}
.cache-item > :not(:first-child) {
.cache-item > :nth-child(2) {
flex: 1 1 auto;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
margin-left: 10px;
}
.cache-item > :nth-child(4) {
display: none;
}
.cache-item > :nth-child(5) {
display: flex;
align-items: center;
}
.cache-item > :nth-child(2) {
flex: 1 1 auto;
}
.cache-item > :nth-child(2) span:not(.badge) {
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
width: 138px;
padding-right: 6px;
.cache-item > :nth-child(5) span {
margin-left: 6px;
width: 24px;
text-align: right;
}
.cache-item > :nth-child(3) {
display: none;
}
.cache-item .badge {
position: relative;
top: -8px;

View File

@ -60,7 +60,7 @@
cors: !item.Self,
callback: function (result) {
if ($.isArray(result)) {
var html = '<div class="cache-item"><i class="fa fa-ellipsis-v"></i><div><span data-toggle="tooltip" title="{2}">{2}</span><span class="badge badge-pill badge-success">{0}</span></div><span title="{3}">{3}</span><div><span>{6}</span><button class="btn btn-danger" title="{1}" data-url="{4}?cacheKey={1}" data-toggle="tooltip" data-self="{5}" data-placement="left"><i class="fa fa-trash-o"></i></button></div></div>';
var html = '<div class="cache-item"><i class="fa fa-ellipsis-v"></i><span data-toggle="tooltip" title="{2}">{2}</span><span class="badge badge-pill badge-success">{0}</span><span title="{3}">{3}</span><div><span>{6}</span><button class="btn btn-danger" title="{1}" data-url="{4}?cacheKey={1}" data-toggle="tooltip" data-self="{5}" data-placement="left"><i class="fa fa-trash-o"></i></button></div></div>';
var content = result.sort(function (x, y) {
return x.Key > y.Key ? 1 : -1;
}).map(function (ele) {