From 0b857fa70a60c03df69185ab1d1ad71293768354 Mon Sep 17 00:00:00 2001
From: Matilde Park <matilde@tlon.io>
Date: Wed, 27 May 2020 18:30:36 -0400
Subject: [PATCH] launch: restore tile flexbox

---
 pkg/interface/src/apps/launch/app.js            |  7 +++----
 .../src/apps/launch/components/tiles.js         | 17 ++++++++---------
 2 files changed, 11 insertions(+), 13 deletions(-)

diff --git a/pkg/interface/src/apps/launch/app.js b/pkg/interface/src/apps/launch/app.js
index f330ab826a..5c5c79d30d 100644
--- a/pkg/interface/src/apps/launch/app.js
+++ b/pkg/interface/src/apps/launch/app.js
@@ -9,7 +9,6 @@ import './css/custom.css';
 import Tiles from './components/tiles';
 import Welcome from './components/welcome';
 
-
 export default class LaunchApp extends React.Component {
   constructor(props) {
     super(props);
@@ -48,13 +47,13 @@ export default class LaunchApp extends React.Component {
     const { state } = this;
 
     return (
-      <div style={{ height: 'calc(100vh - 45px)'}}
-           className='h-100 w-100 bg-gray0-d'>
+      <div className='v-mid ph2 dtc-m dtc-l dtc-xl flex justify-between flex-wrap' style={{ maxWidth: '40rem' }}>
         <Welcome firstTime={state.launch.firstTime} api={this.api} />
         <Tiles
           tiles={state.launch.tiles}
           tileOrdering={state.launch.tileOrdering}
-          api={this.api} />
+          api={this.api}
+        />
       </div>
     );
   }
diff --git a/pkg/interface/src/apps/launch/components/tiles.js b/pkg/interface/src/apps/launch/components/tiles.js
index 69bd752494..e8c378c740 100644
--- a/pkg/interface/src/apps/launch/components/tiles.js
+++ b/pkg/interface/src/apps/launch/components/tiles.js
@@ -1,28 +1,27 @@
 import React from 'react';
-import classnames from 'classnames';
 
 import BasicTile from './tiles/basic';
 import CustomTile from './tiles/custom';
 import ClockTile from './tiles/clock';
 import WeatherTile from './tiles/weather';
 
-
 export default class Tiles extends React.PureComponent {
   render() {
     const { props } = this;
 
-    let tiles = props.tileOrdering.filter((key) => {
+    const tiles = props.tileOrdering.filter((key) => {
       return props.tiles[key].isShown;
     }).map((key) => {
-      let tile = props.tiles[key];
+      const tile = props.tiles[key];
       if ('basic' in tile.type) {
-        let basic = tile.type.basic;
+        const basic = tile.type.basic;
         return (
           <BasicTile
             key={key}
             title={basic.title}
             iconUrl={basic.iconUrl}
-            linkedUrl={basic.linkedUrl} />
+            linkedUrl={basic.linkedUrl}
+          />
         );
       } else if ('custom' in tile.type) {
         if (key === 'weather') {
@@ -36,10 +35,10 @@ export default class Tiles extends React.PureComponent {
     });
 
     return (
-      <div>{tiles}</div>
+      <React.Fragment>
+      {tiles}
+      </React.Fragment>
     );
   }
 }
 
-
-