Updated README

README.md

@@ -12,15 +12,15 @@ In the project directory, you can run
 ```
 npm install
 ```
-to install all dependencies. Then run.\
+to install all dependencies. Then run.
 ```
 npm start
 ```
+Add your 3D objects to the public folder, use `.gltf` files. We suggest and [OBJ coverter](https://github.com/CesiumGS/obj2gltf), then optimize
+your glTF assets with `gltf-pipeline`, [more info](https://www.npmjs.com/package/gltf-pipeline) 
 
 ### `npm start`
 
-Add your 3D objects to the public folder, use `.gltf` files.
-
 Runs the app in the development mode.\
 Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
 

src/components/OutputContainer.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Container, Row } from "react-bootstrap";
+import { Container, Row, Col, Button } from "react-bootstrap";
 import { useAnnotationStore } from '../stores/AnnotationStore';
 
 const OutputContainer = () => {
@@ -10,12 +10,16 @@ const OutputContainer = () => {
     return (
       <Container fluid="md" className="mt-2">
         <Row className="section-wrapper">
-          <div className="output">
-            <code>Output: </code>
-            <br/>
-            <code>{outputJSON}</code>
-
-          </div>
+          <Col md="10">
+            <div className="output">
+              <code>Output: </code>
+              <br/>
+              <code>{outputJSON}</code>       
+            </div>
+          </Col>
+          <Col md="2">
+            <Button size="sm" variant="light">Edit</Button> <Button size="sm" variant="dark">Generate</Button>
+          </Col>
         </Row>
       </Container>
     )