done with commenting up ballot info

client/src/pages/ballotInfo/ballotInitDropDown.tsx

@@ -1,3 +1,7 @@
+/* Hardcoded drop down for ballot initatives. Styles the outer dropdown as well
+ * as the contents.
+*/
+
 import * as React from 'react';
 import Accordion from '@mui/material/Accordion';
 import AccordionSummary from '@mui/material/AccordionSummary';

client/src/pages/ballotInfo/districtForm.tsx

@@ -7,15 +7,14 @@ import axios from 'axios';
 import { Button, Grid, TextField } from '@mui/material';
 import { localExpressURL, deployedExpressURL, setGlobalDistrictNum } from '@/common';
 
-// localExpressURL is the URL for the local express server
-// deployedExpressURL is the URL for the deployed express server
 
 // Set base URL for Axios
 const api = axios.create({
-    baseURL: localExpressURL, // Point this to server URL
+    baseURL: localExpressURL,
 });
 
 
+// On submit, set the district to be the result of api call
 interface DistrictFormProps {
     onFormSubmit: (district: string) => void;
 }

client/src/pages/ballotInfo/index.tsx

@@ -1,8 +1,5 @@
 import ButtonFill from "@/components/button/ButtonFill"
-import Checkbox from '@mui/material/Checkbox';
 import * as React from 'react';
-import DropDown from './whatsOnTheBallot/dropDown';
-import BoxAddress from "../../components/button/boxAddress";
 import NavBar from "@/components/nav/NavBar";
 import BallotInitDropDown from "./ballotInitDropDown";
 import ButtonFillEx from "@/components/button/ButtonFillEx";
@@ -11,8 +8,8 @@ import ElectionCheckbox from "./electionCheckBox/electionCheckbox";
 import CandidateData from "./whatsOnTheBallot/candidateData";
 
 
-
 export default function BallotInfo() {
+    // Below are checks for form submission and election checkbox completion
     const [isFormSubmitted, setIsFormSubmitted] = React.useState<string | null>(null);
     const [selectedElection, setSelectedElection] = React.useState<string | null>(null);
 
@@ -52,7 +49,7 @@ export default function BallotInfo() {
                 <h1 className='font-bold text-center mx-6 my-4 text-4xl text-blue-700' style={{ fontFamily: 'Arial, sans-serif' }}><strong>What&apos;s on the Ballot?</strong></h1>
 
                 <h1 className='font-semibold text-left text-2xl mt-4'>Candidates</h1>
-                {/*Testing*/}
+                {/* Don't make instance of candidate data till form and election are done */}
                 {isFormSubmitted && selectedElection && <CandidateData />}
                 {(!isFormSubmitted || !selectedElection) && <div>Please fill out the address form above and select an election to see your ballot information</div>}
 

client/src/pages/ballotInfo/whatsOnTheBallot/peopleCard.tsx

@@ -1,4 +1,7 @@
-/* Card for each individual candidate. 
+/* Card for each individual candidate. Includes name, party, picture as a short
+ * profile to be displayed in the dropdown. When clicked, it takes you to a
+ * deeper profile including the rest of the info from strapi. Styles the small
+ * profile card.
 */
 
 'use client';
@@ -20,7 +23,6 @@ type Props = {
 
 
 const PeopleCard = ({ name, affiliation, picture, link }: Props) => {
-
     const router = useRouter();
     const handleClick = (page: string) => {
         const candidatePath = `/ballotInfo/${name.replace(/\s+/g, '')}`;
@@ -29,7 +31,8 @@ const PeopleCard = ({ name, affiliation, picture, link }: Props) => {
 
     return (
         <Card onClick={() => handleClick(link)} sx={{
-            width: 300, height: 250, margin: 'auto', backgroundColor: '#f4f4f4', // Blue background color
+            width: 300, height: 250, margin: 'auto',
+            backgroundColor: '#f4f4f4', // Blue background color
             color: 'white', // Text color
             transition: 'background-color 0.3s ease', // Smooth transition
             '&:hover': {
@@ -53,5 +56,4 @@ const PeopleCard = ({ name, affiliation, picture, link }: Props) => {
     );
 }
 
-
 export default PeopleCard;