issue ui update
This commit is contained in:
FuXiaoHei
parent
bf5fcfb49c
commit
e0a6e6dd1a
3 changed files with 71 additions and 6 deletions
|
|
@ -1355,6 +1355,10 @@ html, body {
|
|||
color: #444;
|
||||
}
|
||||
|
||||
#issue .issue-item h5 .labels .label {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
#issue .issue-item .info span {
|
||||
margin-right: 12px;
|
||||
color: #888;
|
||||
|
|
@ -1589,6 +1593,14 @@ html, body {
|
|||
text-shadow: 0 0 2px #444;
|
||||
}
|
||||
|
||||
#issue .label-selected .count, #issue .label-selected a {
|
||||
color: #FAFAFA;
|
||||
}
|
||||
|
||||
#issue .label-selected a {
|
||||
text-shadow: 0 0 2px #444;
|
||||
}
|
||||
|
||||
#issue .issue-bar .labels .label-white {
|
||||
color: #FFF;
|
||||
}
|
||||
|
|
@ -1625,6 +1637,16 @@ html, body {
|
|||
margin-left: 26px;
|
||||
}
|
||||
|
||||
#label-color-ipt2, #label-color-change-ipt2 {
|
||||
width: 120px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
#label-color-change-ipt2{
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
/* wrapper and footer */
|
||||
|
||||
#wrapper {
|
||||
|
|
|
|||
|
|
@ -647,18 +647,45 @@ function initIssue() {
|
|||
$('#label-name-change-ipt').val($this.find('.name').text());
|
||||
var color = $this.find('.color').data("color");
|
||||
$('.label-change-color-picker').colorpicker("setValue", color);
|
||||
$('#label-color-change-ipt').val(color);
|
||||
$('#label-color-change-ipt,#label-color-change-ipt2').val(color);
|
||||
$('#label-change-id-ipt').val($this.data("id"));
|
||||
return false;
|
||||
});
|
||||
}
|
||||
});
|
||||
var colorRegex = new RegExp("^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$");
|
||||
$('#label-color-ipt2').on('keyup', function () {
|
||||
var val = $(this).val();
|
||||
if (val.length > 7) {
|
||||
$(this).val(val.substr(0, 7));
|
||||
}
|
||||
if (colorRegex.test(val)) {
|
||||
$('.label-color-picker').colorpicker("setValue", val);
|
||||
}
|
||||
return true;
|
||||
});
|
||||
$('#label-color-change-ipt2').on('keyup', function () {
|
||||
var val = $(this).val();
|
||||
console.log(val);
|
||||
if (val.length > 7) {
|
||||
$(this).val(val.substr(0, 7));
|
||||
}
|
||||
if (colorRegex.test(val)) {
|
||||
$('.label-change-color-picker').colorpicker("setValue", val);
|
||||
}
|
||||
return true;
|
||||
});
|
||||
$("#label-list").on('click', '.del', function () {
|
||||
var $p = $(this).parent();
|
||||
removeLabels.push($p.data('id'));
|
||||
$p.remove();
|
||||
return false;
|
||||
});
|
||||
$('.label-selected').each(function (i, item) {
|
||||
var $item = $(item);
|
||||
var color = $item.find('.color').data('color');
|
||||
$item.css('background-color', color);
|
||||
});
|
||||
$('.issue-bar .labels .dropdown-menu').on('click', 'li', function (e) {
|
||||
var url = $('.issue-bar .labels').data("ajax");
|
||||
var id = $(this).data('id');
|
||||
|
|
|
|||
|
|
@ -17,11 +17,11 @@
|
|||
<h4>Label</h4>
|
||||
<ul class="list-unstyled" id="label-list" data-ajax="{{$.RepoLink}}/issues/labels/delete">
|
||||
{{range .Labels}}
|
||||
<li class="label-item" id="label-{{.Id}}" data-id="{{.Id}}">
|
||||
<li class="label-item{{if eq $.SelectLabels .Id}} label-selected{{end}}" id="label-{{.Id}}" data-id="{{.Id}}">
|
||||
<a href="?type={{$.ViewType}}&state={{$.State}}{{if not (eq $.SelectLabels .Id)}}&labels={{.Id}}{{end}}">
|
||||
<span class="pull-right count">{{if $.IsShowClosed}}{{.NumClosedIssues}}{{else}}{{.NumOpenIssues}}{{end}}</span>
|
||||
<span class="color" style="background-color: {{.Color}}" data-color="{{.Color}}"></span>
|
||||
<span class="name">{{.Name}}{{if eq $.SelectLabels .Id}}*{{end}}</span>
|
||||
<span class="name">{{.Name}}</span>
|
||||
</a>
|
||||
<a class="del pull-right" href="#" data-id="{{.Id}}"><i class="fa fa-times-circle-o"></i></a>
|
||||
</li>
|
||||
|
|
@ -36,6 +36,7 @@
|
|||
<input type="hidden" name="id" id="label-change-id-ipt" value="0"/>
|
||||
</div>
|
||||
<div class="form-group text-right">
|
||||
<input class="form-control input-sm" type="text" id="label-color-change-ipt2" value="#444444"/>
|
||||
<button class="btn btn-default btn-sm">Save</button>
|
||||
</div>
|
||||
</form>
|
||||
|
|
@ -52,6 +53,7 @@
|
|||
<span class="input-group-addon"><i></i></span>
|
||||
</div>
|
||||
<div class="form-group text-right">
|
||||
<input class="form-control input-sm" type="text" id="label-color-ipt2" value="#444444"/>
|
||||
<button class="btn btn-default btn-sm">Create</button>
|
||||
</div>
|
||||
</form>
|
||||
|
|
@ -69,7 +71,11 @@
|
|||
{{range .Issues}}{{if .Poster}}
|
||||
<div class="list-group-item issue-item{{if not .IsRead}} unread{{end}}" id="issue-{{.Id}}">
|
||||
<span class="number pull-right">#{{.Index}}</span>
|
||||
<h5 class="title"><a href="{{$.RepoLink}}/issues/{{.Index}}">{{.Name}}</a></h5>
|
||||
<h5 class="title"><a href="{{$.RepoLink}}/issues/{{.Index}}">{{.Name}}</a>
|
||||
<span class="labels">
|
||||
<span class="label" style="background-color: #28a1c5">tag</span>
|
||||
</span>
|
||||
</h5>
|
||||
<p class="info">
|
||||
<span class="author"><img class="avatar" src="{{.Poster.AvatarLink}}" alt="" width="20"/>
|
||||
<a href="/user/{{.Poster.Name}}">{{.Poster.Name}}</a></span>
|
||||
|
|
@ -88,9 +94,19 @@
|
|||
$(function(){
|
||||
$('.label-color-picker').colorpicker({
|
||||
input: $('#label-color-ipt')
|
||||
}).on('changeColor', function (ev) {
|
||||
var $ipt = $('#label-color-ipt2');
|
||||
if ($ipt.val().length != 4) {
|
||||
$ipt.val(ev.color.toHex());
|
||||
}
|
||||
});
|
||||
$('.label-change-color-picker').colorpicker({
|
||||
input:$('#label-color-change-ipt')
|
||||
}).on('changeColor', function (ev) {
|
||||
var $ipt = $('#label-color-change-ipt2');
|
||||
if ($ipt.val().length != 4) {
|
||||
$ipt.val(ev.color.toHex());
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in a new issue