Update bio

Fix issue with navigating back to About from Socials

Author: forkball

src/components/Handheld/Components/Screen/Screen.scss

@@ -109,6 +109,8 @@
         }
       }
       &__body {
+          hyphens: auto;
+          margin-bottom: 16px;
           &__section {
             margin-bottom: 16px;
             h2 {

src/components/Handheld/Device/Device.js

@@ -103,18 +103,19 @@ function Device({ classes }) {
       setPanelSet(mI);
       setShowMenu(false);
       setPanel(0);
-    }
-    // handle a button behavior based on panel set
-    switch (panelSet) {
-      case 1: {
-        const anchors = document
-          .getElementsByClassName('panel-social')[0]
-          .getElementsByTagName('a');
-        anchors[socialPanelIndex].click();
-        break;
+    } else {
+      // handle a button behavior based on panel set
+      switch (panelSet) {
+        case 1: {
+          const anchors = document
+            .getElementsByClassName('panel-social')[0]
+            .getElementsByTagName('a');
+          anchors[socialPanelIndex].click();
+          break;
+        }
+        default:
+          break;
       }
-      default:
-        break;
     }
   };
 

src/components/Handheld/Panels/BioPanel.js

@@ -20,12 +20,21 @@ const BioPanel = forwardRef(({ image, scrollDirection }, ref) => {
         <img src={image} alt="me" />
       </div>
       <div className="handheld-screen__interface__content__body flex flex-col">
-        <div className="handheld-screen__content__body flex flex-col text-left">
+        <div className="handheld-screen__content__body flex flex-col text-left gap-2 hyphens">
+          <p>Hey! </p>
           <p>
-            In all areas of the stack, Eros is well equipped to address any challenge, whether it be
-            deve&shy;loping elegant, responsive websites, creating intuitive mobile application
-            experien&shy;ces, or building robust, efficient backend solutions.
+            I&apos;m Eros, and I like making physical and digital games, and websites like this one!{' '}
           </p>
+          <p>I earned a Bachelor of Computer Science from Carleton U. (Ottawa) in 2021. </p>
+          <p>
+            I&apos;m currently employed at a Else Labs (an IoT startup) doing fullstack software
+            development.
+          </p>
+          <p>
+            I also like comics, music, film, rock climbing, karate, and of course, playing physical
+            and digital games.
+          </p>
+          <p>Feel free to connect through my social platforms. [press start!]</p>
         </div>
       </div>
       <div className="handheld-screen__interface__content__page flex mt-auto">

src/styles/font-size.scss

@@ -14,6 +14,6 @@ $h4-font-size-desktop: 36px;
 $h4-font-size-tablet: 28px;
 $h4-font-size-mobile: 18px;
 
-$p-font-size-desktop: 16px;
-$p-font-size-tablet: 16px;
-$p-font-size-mobile: 16px;
+$p-font-size-desktop: 18px;
+$p-font-size-tablet: 18px;
+$p-font-size-mobile: 18px;

src/styles/mixins/typography.scss

@@ -74,6 +74,7 @@
 @mixin body {
   font-size: $p-font-size-desktop;
   line-height: $p-font-size-desktop * 2;
+  letter-spacing: 0.25em;
   font-weight: normal;
   display: flex;
   align-items: center;