Playground improvements (#342)

Remove previews, add vs code task, open in chrome

.vscode/tasks.json

@@ -15,6 +15,13 @@
       "type": "shell",
       "command": "yarn tsc --build --watch ./devEnv/typecheck-all-projects/tsconfig.all.json",
       "problemMatcher": ["$tsc-watch"]
+    },
+    {
+      "type": "npm",
+      "script": "playground",
+      "problemMatcher": [],
+      "label": "Playground",
+      "detail": "yarn workspace playground run serve"
     }
   ]
 }

packages/playground/devEnv/home/ItemSectionWithPreviews.tsx

@@ -15,9 +15,9 @@ export const ItemSectionWithPreviews = (props: {
           return (
             <ItemContainer key={`li-${moduleName}`}>
               <ItemLink href={href}>
-                <PreviewContainer>
+                {/* <PreviewContainer>
                   <iframe src={href} frameBorder="0" tabIndex={-1} />
-                </PreviewContainer>
+                </PreviewContainer> */}
                 <ItemDesc>
                   <h3>{moduleName}</h3>
                   <p>{href}</p>
@@ -80,9 +80,9 @@ const ItemContainer = styled.div`
 `
 
 const ItemListContainer = styled.div`
-  display: flex;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
   gap: 1rem;
-  flex-wrap: wrap;
 
   margin-bottom: 2rem;
 `

packages/playground/devEnv/openForOS.ts

@@ -2,7 +2,7 @@ import {spawn} from 'child_process'
 
 export function openForOS(hostedAt: string) {
   const open = {
-    darwin: ['open'],
+    darwin: ['open', '-a', 'Google Chrome'],
     linux: ['xdg-open'],
     win32: ['cmd', '/c', 'start'],
   }