From 8572224688f4698b5523d74c079df0cf610e9a8c Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Wed, 8 Sep 2021 09:51:08 +0100
Subject: [PATCH] Revert preview border to 1px and fix exact size of preview on
 different devices

---
 packages/client/src/components/ClientApp.svelte | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/packages/client/src/components/ClientApp.svelte b/packages/client/src/components/ClientApp.svelte
index 0d0d847c27..63b5241168 100644
--- a/packages/client/src/components/ClientApp.svelte
+++ b/packages/client/src/components/ClientApp.svelte
@@ -187,19 +187,20 @@
   }
 
   /* Preview styles */
+  /* The additional 6px of size is to account for 4px padding and 2px border */
   #device-root.preview {
     padding: 2px;
   }
   #device-root.tablet-preview {
-    width: calc(1024px + 8px);
-    height: calc(768px + 8px);
+    width: calc(1024px + 6px);
+    height: calc(768px + 6px);
   }
   #device-root.mobile-preview {
-    width: calc(390px + 8px);
-    height: calc(844px + 8px);
+    width: calc(390px + 6px);
+    height: calc(844px + 6px);
   }
   .preview #app-root {
-    border: 2px solid var(--spectrum-global-color-gray-300);
+    border: 1px solid var(--spectrum-global-color-gray-300);
     border-radius: 4px;
   }
 </style>