Merge branch 'main' of https://github.com/wwsalmon/hacklytics-cecil-c…

…ovid

README.md

@@ -1,9 +1,42 @@
-# Web Dev for Makers NextJS + Tailwind Template
+<img width="100" alt="A syringe-shaped rocket doodle" src="https://user-images.githubusercontent.com/77285010/218306834-22f8b223-07a0-4804-a4a3-b89593177f9a.png"> 
 
-Use to bootstrap class (or future out-of-class) projects.
+# Hacklytics project: COVID vaccine effectiveness tracker - BoostOnTime!
 
-To use this template, first make sure you have Node installed, and then run in your terminal:
+Team *Cecil Separated Values (Pomona College)*
 
-```
-npx create-next-app -e https://github.com/webdevformakers/webdevformakers-tailwind-template
-```
+> Please reorder and rename these titles and delete my silly comments before submitting thx
+
+## Try our tracker!
+
+> The link to the website
+
+## Motivation
+
+Lorem Ipsum
+
+## Project structure
+
+## Data source
+
+## Data processing
+The raw data has multiple columns containing mixed datatypes, especially the time data. The time data are given in different units such as weeks or months and some are also given in intervals (e.g. 2-6 months, >14 weeks). As our project focuses on the vaccine effectiveness over time so as to remind users to take booster shots on time, we would like to quantify these string entries into numerical entries with a unit of days.
+
+To ensure the accuracy of our visual display, we matched and eliminated the data entries that only provide an open interval (e.g. > 2 weeks), as it would not provide the most time-sensitive data point. For a closed interval (e.g. 8-10 days), we again used regex expressions to extract the upper and lower bounds. We then multiplied the numeros in the substring by 7 or 30 days if the substrings 'week' and 'month' are matched in these entries so as to convert them into units of days.
+
+Similarly, we unified and filtered the data entries for dosage sequence, vaccine brand and represented groups. The processed data are then imported into the webapp.
+
+## <@samson maybe you could write some more sections about web dev?>
+
+## Demo & 1-minute tutorial
+
+> Maybe we can even plug the video link here.
+
+## Future Plans & Applications
+<img width="300" alt="A calendar doodle" src="https://user-images.githubusercontent.com/77285010/218306356-ead545bf-13ed-43a4-8e2c-909be0b865df.png">
+
+
+## Boost it up!
+> idk why I made this section, maybe just put in some whitty catch phrases
+
+## Citations
+Lin D, Gu Y, Xu Y, et al. Association of Primary and Booster Vaccination and Prior Infection With SARS-CoV-2 Infection and Severe COVID-19 Outcomes. JAMA. 2022;328(14):1415–1426. doi:10.1001/jama.2022.17876

components/H1.tsx

@@ -6,6 +6,6 @@ export default function H1(props: ComponentProps<"h1">) {
     delete domProps.className;
 
     return (
-        <h1 className={classNames("font-bold text-2xl", props.className)} {...domProps}/>
+        <h1 className={classNames("font-semibold text-5xl font-garamond", props.className)} {...domProps}/>
     )
 }

components/Navbar.tsx

@@ -0,0 +1,14 @@
+import { HydratedDocument } from "mongoose";
+import { signOut } from "next-auth/react";
+
+import { IUser } from "../models/models";
+
+export default function Navbar({thisUser}: {thisUser: HydratedDocument<IUser>}) {
+    return (
+        <div className="w-full fixed top-0 left-0 h-16 flex items-center px-4">
+            <img src={thisUser.image} className="w-8 h-8 rounded-full" alt={`Profile picture of ${thisUser.name}`} />
+            <span className="ml-4">{thisUser.name}</span>
+            <button className="ml-auto" onClick={() => signOut()}>Sign out</button>
+        </div>
+    )
+}