From e12a652ae7d9cbf6cfdf577a3ee240ffb52f76ed Mon Sep 17 00:00:00 2001
From: Sebastien Clement <seb6596@gmail.com>
Date: Sun, 16 Feb 2020 19:22:27 +0100
Subject: [PATCH] :hammer: Make the app responsive

---
 .../rootfs/opt/nextcloud_backup/views/backupSnaps.ejs     | 2 +-
 .../rootfs/opt/nextcloud_backup/views/index.ejs           | 8 +++++---
 .../rootfs/opt/nextcloud_backup/views/localSnaps.ejs      | 2 +-
 3 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/nextcloud_backup/rootfs/opt/nextcloud_backup/views/backupSnaps.ejs b/nextcloud_backup/rootfs/opt/nextcloud_backup/views/backupSnaps.ejs
index 05aacf4..f689897 100644
--- a/nextcloud_backup/rootfs/opt/nextcloud_backup/views/backupSnaps.ejs
+++ b/nextcloud_backup/rootfs/opt/nextcloud_backup/views/backupSnaps.ejs
@@ -3,7 +3,7 @@
     <% for(const index in backups) { %>
     <a class="collection-item local-snap-listener modal-trigger" href="#modal-<%=backups[index].etag%>"
         data-id="<%= backups[index].etag %>">
-        <div><%= backups[index].basename%><div class="secondary-content">
+        <div><%= backups[index].basename%><div class="secondary-content hide-on-small-and-down">
                 <%= moment(backups[index].lastmod).format('MMM D, YYYY HH:mm')  %></div>
         </div>
     </a>
diff --git a/nextcloud_backup/rootfs/opt/nextcloud_backup/views/index.ejs b/nextcloud_backup/rootfs/opt/nextcloud_backup/views/index.ejs
index 89aaa84..827aec2 100644
--- a/nextcloud_backup/rootfs/opt/nextcloud_backup/views/index.ejs
+++ b/nextcloud_backup/rootfs/opt/nextcloud_backup/views/index.ejs
@@ -30,8 +30,10 @@
       margin-bottom: 0;
     }
 
-    .header-box {
-      height: 150px;
+    @media (min-width: 601px) {
+      .header-box {
+        height: 150px;
+      }
     }
 
     .header-box .col {
@@ -84,7 +86,7 @@
         <li id="setting-trigger"><a class="dropdown-trigger" href="#" data-target="dropdown-settings"><i
               class="material-icons">settings</i></a></li>
       </ul>
-      <div style="height: 64px; display: table; margin-left: 130px;">
+      <div style="height: 64px; display: table; margin-left: 130px;" class="hide-on-med-and-down">
         <h4 style="display: table-cell; vertical-align: middle;">Nextcloud Backup</h4>
       </div>
     </div>
diff --git a/nextcloud_backup/rootfs/opt/nextcloud_backup/views/localSnaps.ejs b/nextcloud_backup/rootfs/opt/nextcloud_backup/views/localSnaps.ejs
index a04d88a..dd8cc93 100644
--- a/nextcloud_backup/rootfs/opt/nextcloud_backup/views/localSnaps.ejs
+++ b/nextcloud_backup/rootfs/opt/nextcloud_backup/views/localSnaps.ejs
@@ -3,7 +3,7 @@
     <% for(const index in snaps) { %>
     <a class="collection-item local-snap-listener modal-trigger" href="#modal-<%=snaps[index].slug%>"
         data-id="<%= snaps[index].slug %>">
-        <div><%= snaps[index].name ? snaps[index].name : snaps[index].slug %><div class="secondary-content">
+        <div><%= snaps[index].name ? snaps[index].name : snaps[index].slug %><div class="secondary-content hide-on-small-and-down">
                 <%= moment(snaps[index].date).format('MMM D, YYYY HH:mm')  %></div>
         </div>
     </a>