Redesign cluster index

app/assets/stylesheets/pages/clusters.scss

@@ -86,6 +86,31 @@
   .top-area .nav-controls > .btn.btn-add-cluster {
     margin-right: 0;
   }
+
+  .clusters-table {
+    background-color: $gray-light;
+    padding: $gl-padding-8;
+  }
+
+  .badge-light {
+    background-color: $white-normal;
+  }
+
+  .gl-responsive-table-row {
+    padding: $gl-padding;
+    border: 0;
+
+    &.table-row-header {
+      background-color: none;
+      border: 0;
+      font-weight: bold;
+      color: $gl-gray-500;
+    }
+  }
+}
+
+.cluster-warning {
+  @include alert-variant(theme-color-level('warning', $alert-bg-level), theme-color-level('warning', $alert-border-level), theme-color-level('warning', $alert-color-level));
 }
 
 .gcp-signup-offer {

app/views/clusters/clusters/_cluster.html.haml

-.gl-responsive-table-row
+.card
+  .card-body.gl-responsive-table-row
     .table-section.section-60
       .table-mobile-header{ role: "rowheader" }= s_("ClusterIntegration|Kubernetes cluster")
       .table-mobile-content

app/views/clusters/clusters/index.html.haml

@@ -11,7 +11,7 @@
       .nav-text
         = s_("ClusterIntegration|Kubernetes clusters can be used to deploy applications and to provide Review Apps for this project")
       = render 'clusters/clusters/buttons'
-    .ci-table.js-clusters-list
+    .clusters-table.js-clusters-list
       .gl-responsive-table-row.table-row-header{ role: "row" }
         .table-section.section-60{ role: "rowheader" }
           = s_("ClusterIntegration|Kubernetes cluster")