"My Checks" page uses the same markup for desktop and mobile.

hc/front/tests/test_my_checks.py

@@ -24,13 +24,8 @@ class MyChecksTestCase(BaseTestCase):
 
         self.client.login(username="alice@example.org", password="password")
         r = self.client.get("/checks/")
-
-        # Desktop
         self.assertContains(r, "icon-up")
 
-        # Mobile
-        self.assertContains(r, "label-up")
-
     def test_it_shows_red_check(self):
         self.check.last_ping = timezone.now() - td(days=3)
         self.check.status = "up"
@@ -38,13 +33,8 @@ class MyChecksTestCase(BaseTestCase):
 
         self.client.login(username="alice@example.org", password="password")
         r = self.client.get("/checks/")
-
-        # Desktop
         self.assertContains(r, "icon-down")
 
-        # Mobile
-        self.assertContains(r, "label-down")
-
     def test_it_shows_amber_check(self):
         self.check.last_ping = timezone.now() - td(days=1, minutes=30)
         self.check.status = "up"
@@ -52,13 +42,8 @@ class MyChecksTestCase(BaseTestCase):
 
         self.client.login(username="alice@example.org", password="password")
         r = self.client.get("/checks/")
-
-        # Desktop
         self.assertContains(r, "icon-grace")
 
-        # Mobile
-        self.assertContains(r, "label-grace")
-
     def test_it_hides_add_check_button(self):
         self.profile.check_limit = 0
         self.profile.save()

static/css/my_checks_mobile.css

@@ -1,63 +0,0 @@
-#checks-list {
-    list-style: none;
-    padding: 0;
-    margin-top: 48px;
-}
-
-#checks-list li {
-    margin-bottom: 48px;
-    position: relative;
-}
-
-#checks-list h2 {
-    font-size: 18px;
-    font-weight: 400;
-}
-
-#checks-list h2 code {
-    display: block;
-    font-size: 12px;
-    margin-top: 4px;
-    padding: 0;
-}
-
-#checks-list .remove-link {
-    color: #AAA;
-    position: absolute;
-    top: 0;
-    right: 0;
-    font-size: 20px;
-}
-
-#checks-list .unnamed {
-    color: #999;
-    font-style: italic;
-}
-
-#checks-list th {
-    width: 100px;
-}
-
-#checks-list .label {
-    text-transform: uppercase;
-}
-
-.label-new, .label-paused {
-    background-color: #777777;
-}
-
-.label-up {
-    background-color: #22bc66;
-}
-
-.label-grace {
-    background-color: #f0ad4e;
-}
-
-.label-down {
-    background-color: #d9534f;
-}
-
-#checks-list .base {
-    color: #888;
-}

static/js/checks.js

@@ -328,7 +328,6 @@ $(function () {
                     if (lastPing[el.code] != el.last_ping) {
                         lastPing[el.code] = el.last_ping;
                         $("#lpd-" + el.code).html(el.last_ping);
-                        $("#lpm-" + el.code).html(el.last_ping);
                     }
                 }
 

templates/base.html

@@ -30,7 +30,6 @@
     <link rel="stylesheet" href="{% static 'css/docs_cron.css' %}" type="text/css">
     <link rel="stylesheet" href="{% static 'css/welcome.css' %}" type="text/css">
     <link rel="stylesheet" href="{% static 'css/my_checks.css' %}" type="text/css">
-    <link rel="stylesheet" href="{% static 'css/my_checks_mobile.css' %}" type="text/css">
     <link rel="stylesheet" href="{% static 'css/my_checks_desktop.css' %}" type="text/css">
     <link rel="stylesheet" href="{% static 'css/pricing.css' %}" type="text/css">
     <link rel="stylesheet" href="{% static 'css/syntax.css' %}" type="text/css">

templates/front/my_checks.html

@@ -17,7 +17,6 @@
 <div class="row">
     <div class="col-sm-12">
     {% if checks %}
-        {% include "front/my_checks_mobile.html" %}
         {% include "front/my_checks_desktop.html" %}
     {% else %}
     <div class="alert alert-info">You don't have any checks yet.</div>

templates/front/my_checks_desktop.html

@@ -1,5 +1,5 @@
 {% load hc_extras staticfiles %}
-<table id="checks-table" class="table hidden-xs hidden-sm">
+<table id="checks-table" class="table">
     <tr>
         <th></th>
         <th class="th-name">
@@ -17,9 +17,9 @@
             </a>
             {% endif %}
         </th>
-        <th>Ping URL</th>
+        <th class="hidden-xs hidden-sm">Ping URL</th>
-        <th class="th-integrations">Integrations</th>
+        <th class="th-integrations hidden-xs">Integrations</th>
-        <th class="th-period">
+        <th class="th-period hidden-xs">
             Period <br />
             <span class="checks-subline">Grace</span>
         </th>
@@ -38,7 +38,7 @@
             </a>
             {% endif %}
         </th>
-        <th></th>
+        <th class="hidden-xs"></th>
     </tr>
     {% for check in checks %}
     <tr
@@ -65,7 +65,7 @@
                 {% endfor %}
             </div>
         </td>
-        <td class="url-cell">
+        <td class="url-cell hidden-xs hidden-sm">
             <span class="my-checks-url">
                 <span class="base">{{ ping_endpoint }}</span>{{ check.code }}
             </span>
@@ -75,7 +75,7 @@
                 copy
             </button>
         </td>
-        <td class="integrations-cell">
+        <td class="integrations-cell hidden-xs">
             {% if channels|length < 8 %}
                 <div class="integrations">
                 {% spaceless %}
@@ -88,7 +88,7 @@
                 {{ check.channel_set.all|length }} of {{ channels|length }}
             {% endif %}
         </td>
-        <td class="timeout-cell">
+        <td class="timeout-cell hidden-xs">
             <div
                 data-url="{% url 'hc-update-timeout' check.code %}"
                 data-kind="{{ check.kind }}"
@@ -113,7 +113,7 @@
                 {% include "front/last_ping_cell.html" with check=check %}
             </div>
         </td>
-        <td>
+        <td class="hidden-xs">
             <div class="check-menu dropdown">
                 <button class="btn btn-sm btn-default dropdown-toggle" type="button" data-toggle="dropdown">
                 <span class="icon-settings" aria-hidden="true"></span>

templates/front/my_checks_mobile.html

@@ -1,102 +0,0 @@
-{% load hc_extras humanize %}
-
-<ul id="checks-list" class="visible-xs visible-sm">
-    {% for check in checks %}
-    <li>
-        <h2>
-            <span class="{% if not check.name %}unnamed{% endif %}">
-                {{ check.name|default:"unnamed" }}
-            </span>
-
-            <code>
-                <span class="base hidden-xs">{{ ping_endpoint }}</span>{{ check.code }}
-            </code>
-        </h2>
-
-        <a
-            href="#"
-            class="btn remove-link check-menu-remove"
-            data-name="{{ check.name_then_code }}"
-            data-url="{% url 'hc-remove-check' check.code %}">
-            <span class="icon-close"></span>
-        </a>
-
-        <table class="table">
-            <tr>
-                <th>Status</th>
-                <td>
-                    {% if check.in_grace_period %}
-                        <span id="sl-{{ check.code }}" class="label label-grace">grace</span>
-                    {% else %}
-                        {% with status=check.get_status %}
-                        <span id="sl-{{ check.code }}" class="label label-{{ status }}">{{ status }}</span>
-                        {% endwith %}
-                    {% endif %}
-                </td>
-            </tr>
-            {% if check.tags %}
-            <tr>
-                <th>Tags</th>
-                <td>
-                    {% for tag in check.tags_list %}
-                    <span class="label label-tag">{{ tag }}</span>
-                    {% endfor %}
-                </td>
-            </tr>
-            {% endif %}
-            {% if check.kind == "simple" %}
-            <tr>
-                <th>Period</th>
-                <td>{{ check.timeout|hc_duration }}</td>
-            </tr>
-            {% elif check.kind == "cron" %}
-            <tr>
-                <th>Schedule</th>
-                <td>{{ check.schedule }}</td>
-            </tr>
-            {% endif %}
-            <tr>
-                <th>Grace Time</th>
-                <td>{{ check.grace|hc_duration }}</td>
-            </tr>
-            <tr>
-                <th>Last Ping</th>
-                <td id="lpm-{{ check.code}}">
-                    {% include "front/last_ping_cell.html" with check=check %}
-                </td>
-            </tr>
-        </table>
-
-
-        <div>
-            <a
-                href="#"
-                data-name="{{ check.name }}"
-                data-tags="{{ check.tags }}"
-                data-url="{% url 'hc-update-name' check.code %}"
-                class="btn btn-default my-checks-name">
-                Rename
-            </a>
-
-            <a
-                href="#"
-                data-kind="{{ check.kind }}"
-                data-url="{% url 'hc-update-timeout' check.code %}"
-                data-timeout="{{ check.timeout.total_seconds }}"
-                data-grace="{{ check.grace.total_seconds }}"
-                data-schedule="{{ check.schedule }}"
-                data-tz="{{ check.tz }}"
-                class="btn btn-default timeout-grace">
-                {% if check.kind == "simple" %}
-                Change Period
-                {% elif check.kind == "cron" %}
-                Change Schedule
-                {% endif %}
-            </a>
-
-            <a href="{% url 'hc-log' check.code %}" class="btn btn-default">Log</a>
-        </div>
-
-    </li>
-    {% endfor %}
-</ul>