diff --git a/static/css/my_checks.css b/static/css/my_checks.css index 1f93bd5e..e83fda83 100644 --- a/static/css/my_checks.css +++ b/static/css/my_checks.css @@ -1,22 +1,32 @@ -#my-checks-tags button.up { +#my-checks-tags div { + margin-bottom: 4px; +} + +#my-checks-tags .up { color: #333; background-color: #fff; border-color: #ccc; } -#my-checks-tags button.grace { +#my-checks-tags .grace { color: #fff; background-color: #f0ad4e; border-color: #eea236; } - -#my-checks-tags button.down { +#my-checks-tags .down { color: #fff; background-color: #d9534f; border-color: #d43f3a; } +#my-checks-tags .checked { + box-shadow: 0 0 3px #ddd; + background: #333; + color: #eee; + border-color: #000; +} + @media (min-width: 992px) { #update-timeout-modal .modal-dialog, #ping-details-modal .modal-dialog { width: 800px; diff --git a/static/js/checks.js b/static/js/checks.js index aa9fbafb..33780070 100644 --- a/static/js/checks.js +++ b/static/js/checks.js @@ -231,14 +231,14 @@ $(function () { // Filtering by tags - $("#my-checks-tags button").click(function() { + $("#my-checks-tags div").click(function() { // .active has not been updated yet by bootstrap code, // so cannot use it $(this).toggleClass('checked'); // Make a list of currently checked tags: var checked = []; - $("#my-checks-tags button.checked").each(function(index, el) { + $("#my-checks-tags .checked").each(function(index, el) { checked.push(el.textContent); }); @@ -331,11 +331,13 @@ $(function () { } } - $("#my-checks-tags button").each(function(a) { + $("#my-checks-tags div").each(function(a) { var status = data.tags[this.innerText]; - if (status) { - this.setAttribute("class", "btn btn-xs " + status); - } + if (lastStatus[this.innerText] == status) + return; + + $(this).removeClass("up grace down").addClass(status); + lastStatus[this.innerText] = status; }); if (document.title != data.title) { diff --git a/templates/front/my_checks.html b/templates/front/my_checks.html index 6915bed9..81cef31a 100644 --- a/templates/front/my_checks.html +++ b/templates/front/my_checks.html @@ -8,7 +8,7 @@ {% if tags %}
{% for tag, status in tags %} - +
{{ tag }}
{% endfor %}
{% endif %}