💄 feat(pages/about): better buttons UI

Author: ythecombinator

src/content/misc/life.mdx

@@ -19,14 +19,6 @@ classmates and ever since I was a speaker at the many meetups I attended.
 I've now delivered dozens of talks on topics including JavaScript/TypeScript,
 React, Performance, Programming Languages, and more.
 
-## Traveling
-
-As I started working as a remote developer, in late 2017, besides exploring a
-lot more Brazil, I decided to travel and live a little around the world for a
-while – not staying for too long on any city.
-
-In 2019, my wife and I moved to Prague, Czech Republic 🇨🇿.
-
 ## Other Stuff
 
 Here are some random fun facts, unique things about me and activities I love:
@@ -40,5 +32,3 @@ Here are some random fun facts, unique things about me and activities I love:
 - Finding new places to watch the sunset 🌇
 - Gathering friends and family by the beach 🏖️
 - Being #1 fan of my lovely wife, Jheniffer 💑
-
-The rest is history!

src/pages/about/index.tsx

@@ -1,6 +1,6 @@
 import { InferGetStaticPropsType, NextPage } from 'next';
 import { NextSeo as Metadata } from 'next-seo';
-import { FaHammer, FaLaptopCode } from 'react-icons/fa';
+import { FaHammer, FaLaptopCode, FaPlane } from 'react-icons/fa';
 import { GiCardRandom, GiTakeMyMoney } from 'react-icons/gi';
 
 import { Routes, siteMetadata } from 'config/constants';
@@ -130,10 +130,13 @@ const Page: NextPage<PageProps> = ({ openGraphImage }) => {
             Curious to know further details about the stuff I mentioned above? I keep some pages updated with these!
           </Typography.p>
 
-          <div className="flex flex-col gap-2 md:flex-row md:gap-2">
+          <div className="grid sm:grid-cols-2 grid-cols-1 gap-2">
             <ButtonLink href={`/${Routes.life}`} icon={<GiCardRandom aria-hidden />}>
               Life
             </ButtonLink>
+            <ButtonLink href={`/${Routes.traveling}`} icon={<FaPlane aria-hidden />}>
+              Traveling
+            </ButtonLink>
             <ButtonLink href={`/${Routes.experience}`} icon={<FaLaptopCode aria-hidden />}>
               Experience
             </ButtonLink>

src/pages/about/traveling.tsx

@@ -74,10 +74,15 @@ const Page: NextPage<PageProps> = ({ openGraphImage, flights, airlines, airports
 
         <SectionContainer className="prose dark:prose-invert">
           <Typography.p>
-            As I started working as a remote developer, in late 2017, besides exploring a lot more Brazil, I decided to
-            travel and live a little around the world for a while – not staying for too long on any city.
+            Since becoming a remote developer in late 2017, I’ve embraced the freedom of working from anywhere, which
+            sparked my passion for traveling. I began by exploring more of Brazil, and soon after, I took the leap to
+            live and travel around the world, immersing myself in different cultures without lingering too long in any
+            one place.
+          </Typography.p>
+          <Typography.p>
+            In 2019, my wife and I made a significant move to Prague, Czech Republic, marking the start of an exciting
+            new chapter in our journey. The world is vast, and we're determined to see it all!
           </Typography.p>
-          <Typography.p>In 2019, my wife and I moved to Prague, Czech Republic.</Typography.p>
         </SectionContainer>
 
         <SectionContainer className="prose dark:prose-invert">

src/pages/index.tsx

@@ -2,13 +2,14 @@ import { NextPage } from 'next';
 
 import { siteMetadata, socialNetworks } from 'config/constants';
 
+import ForbesCurrencyConverter from 'services/providers/forbes-currency-converter';
+
 import Badge from 'components/shared/badge';
 import ButtonLink from 'components/shared/button-link';
 import SectionContainer from 'components/shared/section-container';
 import Typography from 'components/shared/typography';
 
 import Layout from 'components/layouts/page';
-import ForbesCurrencyConverter from 'services/providers/forbes-currency-converter';
 
 //  ---------------------------------------------------------------------------
 //  NEXT
@@ -17,7 +18,7 @@ import ForbesCurrencyConverter from 'services/providers/forbes-currency-converte
 const currencyServiceInstance = ForbesCurrencyConverter.getInstance();
 
 export async function getStaticProps() {
-  await currencyServiceInstance.generateCurrencyTable()
+  await currencyServiceInstance.generateCurrencyTable();
   return {
     props: {},
   };