Add drive SMART attributes and health status

assets/page.erb

@@ -39,8 +39,13 @@
     .card {
       background: #161b27;
       border-radius: 12px;
-      padding: 2rem;
+      padding: 1rem 1.1rem;
       border: 1px solid #1e2433;
+      transition: border-color 0.2s;
+    }
+
+    .card.auth {
+      padding: 2rem;
       width: 100%;
       max-width: 400px;
       box-sizing: border-box;
@@ -52,10 +57,17 @@
       text-transform: uppercase;
       letter-spacing: 0.06em;
       color: #94a3b8;
+    }
+
+    .card.auth .card-title {
       margin-bottom: 1.5rem;
       text-align: center;
     }
 
+    #content {
+      align-self: stretch;
+    }
+
     .form-group {
       margin-bottom: 1rem;
     }
@@ -355,7 +367,7 @@
 </header>
 
 <% if authenticated %>
-  <div id="content"><div class="spinner"></div></div>
+  <div id="content" class="grid"><div class="spinner"></div></div>
   <script>
     fetch("?content", { credentials: "same-origin" })
       .then(function(response) {
@@ -372,7 +384,7 @@
 <% end %>
 
 <% unless authenticated %>
-  <div class="card">
+  <div class="card auth">
     <div class="card-title">Sign In</div>
     <form method="post">
       <div class="form-group">