github/karma
1
0
Fork 0
mirror of https://github.com/prymitive/karma synced 2026-05-07 03:26:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add badges to selects

Browse Source 
This gives the user a hint when a label contains more than one value in the select
This commit is contained in:
Łukasz Mierzwa
2017-04-24 14:08:11 -07:00
parent bfabf514ab
commit 03e793dd74
3 changed files with 38 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
assets/static/base.css
View File

@@ -396,6 +396,15 @@ span.alert-group-link > a {
.bootstrap-select > button {
padding: 0;
}
table.silence-label-selects {
width: auto;
}
table.table.silence-label-selects > tbody > tr > td {
padding-left: 0;
padding-right: 4px;
padding-top: 0;
padding-bottom: 0;
}
.silence-label-select > .bs-caret {
margin-left: -6px;
}

47
assets/templates/silence.html
View File

@@ -2,26 +2,33 @@
<div id="newSilenceAlert" class="alert alert-danger hidden" role="alert"></div>
<form id="newSilenceForm">
<label class="control-label">Labels to match</label>
<% _.each(Alerts.SortMapByKey(labels), function(label) { %>
<div>
<label>
<select class="selectpicker silence-label-picker"
data-label-key="<%= label.key %>"
data-style="silence-label-select"
<% if (Object.keys(label.value).length > 10) { %>data-live-search="true"<% } %>
<% if (Object.keys(label.value).length > 1) { %>data-actions-box="true"<% } %>
multiple>
<% _.each(Alerts.SortMapByKey(label.value), function(label_val) { %>
<option <% if (label_val.value.selected) { %>selected="selected"<% } %>
value="<%= label_val.key %>"
data-content="<span class='<%= label_val.value.attrs.class %>' style='<%= label_val.value.attrs.style %>'><%- label_val.value.attrs.text %></span>">
<%- label_val.value.attrs.text %>
</option>
<% }) %>
</select>
</label>
</div>
<% }) %>
<table class="table table-condensed silence-label-selects">
<% _.each(Alerts.SortMapByKey(labels), function(label) { %>
<tr>
<td align="center">
<span class="badge select-label-badge">
<%- Object.keys(label.value).length %>
</span>
</td>
<td>
<select class="selectpicker silence-label-picker"
data-label-key="<%= label.key %>"
data-style="silence-label-select"
<% if (Object.keys(label.value).length > 10) { %>data-live-search="true"<% } %>
<% if (Object.keys(label.value).length > 1) { %>data-actions-box="true"<% } %>
multiple>
<% _.each(Alerts.SortMapByKey(label.value), function(label_val) { %>
<option <% if (label_val.value.selected) { %>selected="selected"<% } %>
value="<%= label_val.key %>"
data-content="<span class='<%= label_val.value.attrs.class %>' style='<%= label_val.value.attrs.style %>'><%- label_val.value.attrs.text %></span>">
<%- label_val.value.attrs.text %>
</option>
<% }) %>
</select>
</td>
</tr>
<% }) %>
</table>
<hr class="separator">

4
bindata_assetfs.go
View File

File diff suppressed because one or more lines are too long