diff options
| -rw-r--r-- | web/src/App.css | 26 | ||||
| -rw-r--r-- | web/src/App.tsx | 22 |
2 files changed, 47 insertions, 1 deletions
diff --git a/web/src/App.css b/web/src/App.css index a1ca687..78cbbe0 100644 --- a/web/src/App.css +++ b/web/src/App.css @@ -5,6 +5,10 @@ text-align: center; } +h1 { + margin-bottom: 0.25em; +} + .card { margin: 2em; padding: 1.5em; @@ -23,4 +27,24 @@ .item-container { margin-top: 1em; -}
\ No newline at end of file +} + +.group-title { + margin: 0 0 0.25em; +} + +.group-table { + border-collapse: collapse; + margin-left: 1em; + text-align: left; +} + +.group-table td { + padding: 0.5em; + white-space: nowrap; + border-top: 1px solid #ccc +} + +.group-table tbody tr:last-child td { + border-bottom: 1px solid #ccc; +} diff --git a/web/src/App.tsx b/web/src/App.tsx index e2cd151..91a615c 100644 --- a/web/src/App.tsx +++ b/web/src/App.tsx @@ -3,6 +3,14 @@ import Doc from "./Doc.tsx"; import './App.css' import {isResultDoc, ResultDoc} from "./resultdoc.ts"; +const group_members = [ + {name: "Anshul Gupta", sid: "862319580", nid: "agupt109"}, + {name: "Nikhil Mahendrakar", sid: "862464249", nid: "nmahe008"}, + {name: "Ishaan Bijor", sid: "862128714", nid: "ibijo001"}, + {name: "Junbo Yang", sid: "862234040", nid: "jyang389"}, + {name: "Junyan Hou", sid: "862394589", nid: "jhou038"}, +] + function App() { const [query, setQuery] = useState(''); const [data, setData] = useState<ResultDoc[]>([]); @@ -29,6 +37,20 @@ function App() { return ( <> <h1>CS172 Project</h1> + {data.length == 0 && query.length == 0 && + <div> + <h2 className="group-title">Group 10</h2> + <table className="group-table"> + <tbody> + {group_members.map(member => <tr> + <td>{member.name}</td> + <td><a href={`mailto:${member.nid}@ucr.edu`}>{member.nid}</a></td> + <td>{member.sid}</td> + </tr>)} + </tbody> + </table> + </div> + } <div className="card"> <input className="searchbox" type="text" value={query} onChange={(e) => setQuery(e.target.value)}/> {/*Add this later if search becomes too long*/} |