From 004ff58c21c85db045ce87db972167cb05b331d4 Mon Sep 17 00:00:00 2001
From: Bram Kragten <mail@bramkragten.nl>
Date: Tue, 4 Feb 2020 13:34:14 +0100
Subject: [PATCH] Update hassio-style.ts

---
 hassio/src/resources/hassio-style.ts | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/hassio/src/resources/hassio-style.ts b/hassio/src/resources/hassio-style.ts
index a12a21b954..91a8782b6b 100644
--- a/hassio/src/resources/hassio-style.ts
+++ b/hassio/src/resources/hassio-style.ts
@@ -28,12 +28,19 @@ export const hassioStyle = css`
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
     grid-gap: 8px;
   }
-  .card-group > * {
-    max-width: 450px;
+  @media screen and (min-width: 640px) {
+    .card-group {
+      grid-template-columns: repeat(auto-fit, minmax(300px, 0.5fr));
+    }
   }
-  @media screen and (max-width: 800px) {
-    .card-group > * {
-      max-width: 100%;
+  @media screen and (min-width: 1020px) {
+    .card-group {
+      grid-template-columns: repeat(auto-fit, minmax(300px, 0.333fr));
+    }
+  }
+  @media screen and (min-width: 1300px) {
+    .card-group {
+      grid-template-columns: repeat(auto-fit, minmax(300px, 0.25fr));
     }
   }
   ha-call-api-button {