feat: update Home page (#122)

flix · Dec 22, 2023 · 6a15c6d · 6a15c6d
1 parent a39d820
commit 6a15c6d
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 38 deletions.
diff --git a/src/App.js b/src/App.js
@@ -84,12 +84,6 @@ class App extends Component {
                             <NavLink tag={Link} to="/">Home</NavLink>
                         </NavItem>
 
-                        {/*
-                        <NavItem className="pl-1 pr-1">
-                            <NavLink tag={Link} to="/about/">About</NavLink>
-                        </NavItem>
-                        */}
-
                         <NavItem className="pl-1 pr-1">
                             <NavLink tag={Link} to="/get-started/">Get Started</NavLink>
                         </NavItem>

diff --git a/src/page/Home.js b/src/page/Home.js
@@ -1,6 +1,5 @@
 import React, {Component} from 'react';
 import {
-    Button,
     Card,
     CardBody,
     CardImg,
@@ -11,7 +10,6 @@ import {
     Row,
     UncontrolledCarousel
 } from 'reactstrap';
-import {Link} from "react-router-dom";
 import Codebox from "../util/Codebox";
 import InlineEditor from "../util/InlineEditor";
 
@@ -73,28 +71,6 @@ class Home extends Component {
                             elimination. A VSCode plugin for Flix is available.
                         </p>
 
-                        <p>
-                            <Button color="success" tag={Link} to="/get-started/">
-                                Get Started
-                            </Button>
-
-                            <a href="https://play.flix.dev/">
-                                <Button color="info" className="ml-2">
-                                    Playground
-                                </Button>
-                            </a>
-
-                            <Button color="info" tag={Link} to="/documentation/" className="ml-2">
-                                Documentation
-                            </Button>
-
-                            <a href="https://api.flix.dev/">
-                                <Button color="info" className="ml-2">
-                                    Library
-                                </Button>
-                            </a>
-                        </p>
-
                     </Col>
                     <Col md="6">
                         <Codebox flix={this.props.flix}/>
@@ -868,12 +844,12 @@ let r = query p select (c, d) from ReadyDate(c; d)
                 </Row>
 
                 <Row>
-                    <Col>
+                    <Col md="3">
                         <Card className="border-0 p-3">
                             <CardImg src="/logo/aarhusu.png" alt="Aarhus University"/>
                         </Card>
                     </Col>
-                    <Col>
+                    <Col md="4">
                         <Card className="border-0 p-3">
                             <CardImg src="/logo/uwaterloo.png" alt="University of Waterloo"/>
                         </Card>

diff --git a/src/util/Codebox.js b/src/util/Codebox.js
@@ -47,18 +47,18 @@ class Codebox extends Component {
     };
 
     getRunButton() {
-        let enabled = this.props.flix.connected;
-        return <Button color="success" onClick={this.onRunClick} size="sm" disabled={!enabled}>
-            Run <FontAwesome name="play" className="ml-2"/>
-        </Button>;
+        return <a href={"http://play.flix.dev/"}><Button color="success" size="sm" >
+            Play <FontAwesome name="external-link" className="ml-2"/>
+        </Button>
+        </a>;
     }
 
     getDropDown() {
         return <select
             value={this.state.choice}
             onChange={this.onDropdownChoice.bind(this)}
             style={{"textOverflow": "ellipsis"}}
-            className="ml-2 w-75">
+            className="mr-2 w-75">
             {this.state.samples.map((sample, index) =>
                 <option key={index} value={index}>{sample.name}</option>)
             }
@@ -111,8 +111,8 @@ class Codebox extends Component {
         return (
             <div>
                 <InputGroup className="mt-2 mb-3">
-                    {this.getRunButton()}
                     {this.getDropDown()}
+                    {this.getRunButton()}
                 </InputGroup>
                 {this.getEditor()}
                 {this.getOutput()}