Added about-committee documentation and guiding comments

- Added documentation for the about/committee page, especially mentioning what file the hardcoded content is
- Added helpful comments in about.tsx surrounding the hardcoded areas that are to be altered by the committee

Author: Games4Doritos

client/documentation/admin-dashboard/committee.md

@@ -11,5 +11,3 @@ Profiles of the Committee Members of the club that are displayed on the about pa
 ## Other Notes
 
 Before making a Committee object in the Committee table, you must make a Member object for the person that's on the committee and then link it through the id (just to clarify)
-
-The Committee Members are always displayed in the same order on the about page, which is the order previously mentioned. If a certain Committee object can't be retreived, a placeholder Committee Member portrait will be displayed to maintain the same order.

client/documentation/pages/about-committee.md

@@ -0,0 +1,11 @@
+## About/Committee Page
+
+Has a description of the club, it's aim's etc, along with a big feature photo, intended to be a group photo of the committee or a big event? Then below is a display of all the current committee members of the club, showing name, role and pronouns.
+
+## Hardcoded content to be modified by committee members
+
+The club description and feature photo are the only things hardcoded into the website's front-end. Starting from the root directory of this website's source, this code to modify can be found in /client/src/pages/about.tsx
+
+## Other Notes
+
+The Committee Members are always displayed in the same order on the about page, which is the order mentioned in admin-dashboard/committee.md. If a certain Committee object can't be retreived, a placeholder Committee Member portrait will be displayed to maintain the same order.

client/src/pages/about.tsx

@@ -30,19 +30,25 @@ export default function AboutPage() {
             <div className="mb-6 w-full border-t" aria-hidden="true" />
             <div className="space-y-4 font-sans text-base leading-relaxed text-white md:text-lg">
               <p>
+                {/*>>Hardcoded description of the club to be altered<<*/}
                 Description of the clubs aims, why it exists, its mission, etc
                 etc. Second paragraph here, a second paragraph would be pretty
                 cool. The more info the better yippee!!
+                {/*>>Hardcoded description of the club to be altered<<*/}
               </p>
               <p>
+                {/*>>Hardcoded description of the club to be altered<<*/}
                 Lorem ipsum dolor such and such I can&apos;t remember the rest.
+                {/*>>Hardcoded description of the club to be altered<<*/}
               </p>
             </div>
           </div>
           <div className="relative aspect-[4/3] w-full flex-shrink-0 overflow-hidden rounded-2xl bg-light_2 md:w-96 lg:w-[32rem]">
             <div className="flex h-full w-full items-center justify-center">
               <Image
+                /*>>Hardcoded feature image to be altered. Only alter 'src', 'alt' is supposed to be a placeholder<<*/
                 src="/landing_placeholder.png"
+                /*>>Hardcoded feature image to be altered. Only alter 'src', 'alt' is supposed to be a placeholder<<*/
                 alt="/landing_placeholder.png"
                 fill={true}
               />