gamelist scroll

src/App.css

@@ -212,8 +212,12 @@ div.login button:hover {
 }
 
 .gamelist {
+  border: 2px solid white;
+  max-width: 800px;
+}
+
+.gamelist-item {
   background-color: #1d1d1b;
-  max-width: 500px;
   padding: 10px;
 }
 

src/components/GameList.js

@@ -80,20 +80,21 @@ class GameList extends React.Component {
   };
 
   render() {
-    let gamelistItems = this.props.games.map(game => {
-      return (
-        <GameCard
-          key={game.id}
-          gameId={game.id}
-          onEditSave={this.props.onEditSave}
-        />
-      );
-    });
+    let gamelistItems = this.props.games.map(game => (
+      <GameCard
+        key={game.id}
+        gameId={game.id}
+        onEditSave={this.props.onEditSave}
+      />
+    ));
 
     return (
-      <Fragment>
-        <div className="gamelist">{gamelistItems}</div>
-      </Fragment>
+      <div
+        className="gamelist"
+        style={{ maxHeight: "500px", overflow: "scroll" }}
+      >
+        <div className="gamelist-item">{gamelistItems}</div>
+      </div>
     );
   }
 }