From dffdc1d24190054fa933217d5621228bedbc230d Mon Sep 17 00:00:00 2001
From: e26chiu <e26chiu@csc.uwaterloo.ca>
Date: Sun, 11 Dec 2022 18:34:29 -0500
Subject: [PATCH] Change data formatting + edit blurbs + mobile adjustments

---
 data/friends.ts   | 10 ++++----
 pages/friends.tsx | 63 ++++++++++++++++++++++++++++++++---------------
 2 files changed, 48 insertions(+), 25 deletions(-)

diff --git a/data/friends.ts b/data/friends.ts
index 3333edb..698ee8d 100644
--- a/data/friends.ts
+++ b/data/friends.ts
@@ -47,7 +47,7 @@ export const F2 = [
     value: 53,
   },
   {
-    category: "Entrovert",
+    category: "Extrovert",
     value: 11,
   },
   {
@@ -57,6 +57,10 @@ export const F2 = [
 ];
 
 export const F3 = [
+  {
+    category: "None",
+    value: 5,
+  },
   {
     category: "Half",
     value: 25,
@@ -73,10 +77,6 @@ export const F3 = [
     category: "All",
     value: 3,
   },
-  {
-    category: "None",
-    value: 5,
-  },
 ];
 
 export const F4 = [
diff --git a/pages/friends.tsx b/pages/friends.tsx
index e49257e..192b9d7 100644
--- a/pages/friends.tsx
+++ b/pages/friends.tsx
@@ -48,20 +48,24 @@ export default function Demographics() {
       <Header />
       <SectionHeader
         title="Friends"
-        subtitle="The friends you make in college are friends you’ll have for life."
+        subtitle="The friends you make in university are friends you’ll have for life."
       />
 
       <ComponentWrapper
         heading="Rate how social you are."
-        bodyText="Looks like most people consider themselves in the middle."
+        bodyText="Looks like most people consider themselves to be in the middle."
         align="center"
       >
-        <BarGraphVertical data={F1} {...barGraphProps(isMobile, pageWidth)} />
+        <BarGraphVertical
+          data={F1}
+          {...barGraphProps(isMobile, pageWidth)}
+          lowerLabelDy="0"
+        />
       </ComponentWrapper>
 
       <ComponentWrapper
         heading="How would you describe yourself?"
-        bodyText="Ambiverts and introverts dominate CS at waterloo."
+        bodyText="Ambiverts and introverts dominate CS at UWaterloo. Still, contrary to a popular Reddit opinion, it seems that introverted people do not necessarily comprise such a big majority of the CS student population. Extroverts and ambiverts are almost a half of the CS student population!"
         align="right"
       >
         <div className={styles.graphContainer}>
@@ -71,14 +75,15 @@ export default function Demographics() {
 
       <ComponentWrapper
         heading="How many close friends throughout university were also in your program?"
-        bodyText="Most people had friends in the same program as them. For a lot of people, the majority of their friends are in the ssame program. Perhaps this makes scheduling and conversations easier."
+        bodyText="Most people had friends in the same program as them. For a lot of people, the majority of their friends are in the same program. Perhaps the shared classes, career goals, and pain from shared assignments make scheduling and conversations easier."
+        noBackground
       >
         <BarGraphVertical data={F3} {...barGraphProps(isMobile, pageWidth)} />
       </ComponentWrapper>
 
       <ComponentWrapper
         heading="How often do you keep in touch with high school friends?"
-        bodyText="Most people are still in touch with their friends in some form or another!"
+        bodyText="Most people are still in touch with their friends in some form or another! Keeping in touch with high school friends can be especially difficult, given that high school friends often drift away from each other due to different career and/or academic paths."
         align="right"
       >
         <div className={styles.graphContainer}>
@@ -89,13 +94,14 @@ export default function Demographics() {
       <ComponentWrapper
         heading="How many friends are going to be in the same city as you post-grad?"
         bodyText="It is nice to know that the majority of our respondents have a few friends that are going to be in their city post-grad."
+        noBackground
       >
         <BarGraphVertical data={F5} {...barGraphProps(isMobile, pageWidth)} />
       </ComponentWrapper>
 
       <ComponentWrapper
-        heading="How often do you stay in touch with friends that you made on co-op?"
-        bodyText="Many people do not really keep in touch with friends made on co-op. This makes sense as each co-op only lasts a short period of time."
+        heading="How often do you stay in touch with friends that you made during co-op?"
+        bodyText="Many people do not really keep in touch with friends made during co-op. This makes sense as each co-op only lasts a short period of time. Interns are not necessarily given the opportunity to interact with each other during the co-op term either. A remote co-op experience can also affect friendships. To sum up, the ease of maintaining friends from co-ops varies on each co-op!"
         align="right"
       >
         <div className={styles.graphContainer}>
@@ -105,7 +111,8 @@ export default function Demographics() {
 
       <ComponentWrapper
         heading="How often do you stay in touch with friends that you made during school terms?"
-        bodyText="Now, more people keep in touch with friends made during the school terms. This could be because they can hang out during multiple different school terms while on campus."
+        bodyText="Now, more people keep in touch with friends made during school terms. This could be because they can hang out during multiple school terms while on campus."
+        noBackground
       >
         <div className={styles.graphContainer}>
           <PieChart data={F7} {...pieChartProps(isMobile, pageWidth)} />
@@ -114,7 +121,7 @@ export default function Demographics() {
 
       <ComponentWrapper
         heading="Which term(s) did you meet most of your friends?"
-        bodyText="Establishing friendships is generally easier during the beginning of university. But, it is definitely still possible to make friends in the later terms."
+        bodyText="Establishing friendships is generally easier during the beginning of university as many core introductory courses are shared and all sequences have 1A and 1B at the same time. However, it is definitely still possible to make friends in later terms.😉"
         align="right"
       >
         <BarGraphHorizontal
@@ -127,29 +134,43 @@ export default function Demographics() {
 
       <ComponentWrapper
         heading="How many friend groups do you have?"
-        bodyText="According to our data, most people have 3-4 friend groups."
+        bodyText="According to our data, most people have 3-4 friend groups. These friend groups can come from classes, extracurriculars, high school friends, etc."
+        noBackground
       >
-        <BarGraphVertical data={F9} {...barGraphProps(isMobile, pageWidth)} />
+        <BarGraphVertical
+          data={F9}
+          {...barGraphProps(isMobile, pageWidth)}
+          lowerLabelDy="0"
+        />
       </ComponentWrapper>
 
       <ComponentWrapper
         heading="What is the average size of your friend groups?"
-        bodyText="Those friend groups typically consists of 3-4 people."
+        bodyText="UW's CS2022's friend groups typically consists of 3-4 people which is pretty normal. Groups of friends of this size allow people to do group activities while maintaining a sense of closeness between them."
         align="right"
       >
-        <BarGraphVertical data={F10} {...barGraphProps(isMobile, pageWidth)} />
+        <BarGraphVertical
+          data={F10}
+          {...barGraphProps(isMobile, pageWidth)}
+          lowerLabelDy="0"
+        />
       </ComponentWrapper>
 
       <ComponentWrapper
         heading="How open are you to meeting new people?"
-        bodyText="Although graduating, most of our respondents are still somewhat open to meeting new people."
+        bodyText="Even though they are graduating, most of our respondents are still somewhat open to meeting new people. Meeting new people can make your life more exciting and make you discover new perspectives that change the way you approach life!"
+        noBackground
       >
-        <BarGraphVertical data={F11} {...barGraphProps(isMobile, pageWidth)} />
+        <BarGraphVertical
+          data={F11}
+          {...barGraphProps(isMobile, pageWidth)}
+          lowerLabelDy="0"
+        />
       </ComponentWrapper>
 
       <ComponentWrapper
         heading="How many of your friendships were made after starting university?"
-        bodyText="For a lot of people, most or at least some friendships are made during university."
+        bodyText="For a lot of people, most or at least some friendships are made during university. This goes to show how university is an important point in life where people form their most valuable relationships!"
         align="right"
       >
         <div className={styles.graphContainer}>
@@ -160,6 +181,7 @@ export default function Demographics() {
       <ComponentWrapper
         heading="How did you meet most of your friends after starting university?"
         bodyText="There are countless ways to meet new friends in university. Some of the most common ways include classes, mutual friends, and extracurriculars."
+        noBackground
       >
         <BarGraphHorizontal
           data={F13}
@@ -171,7 +193,7 @@ export default function Demographics() {
 
       <ComponentWrapper
         heading="Where do you and your friends usually hang out on campus? "
-        bodyText="There are many buildings on campus for students to chill and hand out in. Looking at our data, at someone’s residence seems where most people like to hang out."
+        bodyText="There are many buildings on campus for students to chill and hang out. Looking at our data, hanging out at someone’s residence seems to be the most popular option. It makes sense as having fun outside of school buildings enable people to take their mind off from schoolwork. MC and DC are also fairly popular spots since they are where most classes take place for CS students and DC is the library where most students study at due to its nice vibes while MC has all the club offices."
         align="right"
       >
         <BarGraphVertical data={F14} {...barGraphProps(isMobile, pageWidth)} />
@@ -179,7 +201,8 @@ export default function Demographics() {
 
       <ComponentWrapper
         heading="What is your go-to activity when hanging out with friends?"
-        bodyText="There is a variety of activities enjoyed by everyone!"
+        bodyText="There is a variety of activities enjoyed by everyone! Most people enjoy eating food with their friends (Who doesn't love to eat or try out new restaurants?). Talking and going to the gym are the next social activities that are favoured the most by students. Hanging out with friends doesn't have to be complicated! 😉"
+        noBackground
       >
         <WordCloud
           data={F15}
@@ -193,7 +216,7 @@ export default function Demographics() {
 
       <ComponentWrapper
         heading="What proportion of friends will you keep in contact with post graduation?"
-        bodyText="Some or even most friendships will be kept by our students post-grad!"
+        bodyText="Some or even most friendships will be kept by our students post-grad! As mentioned previously, university is an experience where people make most of their long-term friends! This pie chart demonstrates it!"
         align="right"
       >
         <div className={styles.graphContainer}>