Add Protogarden image to Home stats

webclient/src/App.js

@@ -27,6 +27,7 @@ import { Subscribe } from './PayPal.js';
 import { PasswordReset, ConfirmReset } from './PasswordReset.js';
 import { NotFound, PleaseLogin } from './Misc.js';
 import { Debug } from './Debug.js';
+import { Garden } from './Garden.js';
 import { Footer } from './Footer.js';
 
 const APP_VERSION = 3;  // TODO: automate this
@@ -263,6 +264,10 @@ function App() {
 								<Classes token={token} user={user} refreshUser={refreshUser} />
 							</Route>
 
+							<Route path='/garden'>
+								<Garden />
+							</Route>
+
 							{user && user.member.set_details ?
 								<Switch>
 									<Route path='/account'>

webclient/src/Garden.js

@@ -0,0 +1,15 @@
+import React, { useState, useEffect, useReducer, useContext } from 'react';
+import { BrowserRouter as Router, Switch, Route, Link, useParams, useHistory } from 'react-router-dom';
+import { Button, Container, Checkbox, Dimmer, Divider, Dropdown, Form, Grid, Header, Icon, Image, Menu, Message, Segment, Table } from 'semantic-ui-react';
+import { apiUrl, statusColor, BasicTable, staticUrl, requester } from './utils.js';
+import { NotFound } from './Misc.js';
+
+export function Garden(props) {
+	return (
+		<Container>
+			<Header size='large'>Protogarden</Header>
+
+			<Image src={staticUrl + '/garden-large.jpg'} />
+		</Container>
+	);
+};

webclient/src/Home.js

@@ -351,6 +351,12 @@ export function Home(props) {
 
 							<SignForm token={token} />
 
+							<p>Protogarden:</p>
+
+							<Link to='/garden'>
+								<Image src={staticUrl + '/garden-medium.jpg'} />
+							</Link>
+
 						</Segment>
 					}
 				</Grid.Column>

webclient/src/Sign.js

@@ -36,16 +36,18 @@ export function SignForm(props) {
 		<Form onSubmit={handleSubmit}>
 			<p>Send a message to the sign:</p>
 
-			<Form.Input
-				name='sign'
-				onChange={handleChange}
-				value={sign}
-				error={error.sign}
-			/>
+			<Form.Group>
+				<Form.Input
+					name='sign'
+					onChange={handleChange}
+					value={sign}
+					error={error.sign}
+				/>
 
-			<Form.Button loading={loading} error={error.non_field_errors}>
-				Submit
-			</Form.Button>
+				<Form.Button loading={loading} error={error.non_field_errors}>
+					Submit
+				</Form.Button>
+			</Form.Group>
 			{success && <div>Success!</div>}
 		</Form>
 	);