Merge pull request #129 from Calinou/fix-typos

Fix several typos

client/pages/MadeOf.tsx

@@ -42,7 +42,7 @@ this
         expect(r).is(superFastWebsite);
         expect(r).is(seoFriendly);
     })
-    .finall(() => {
+    .finally(() => {
         /* Give me 1 Github star 🎉 */
     });
 `}

client/patterns/mega-menu/Details.tsx

@@ -25,7 +25,7 @@ const Details: React.FC<{}> = () => {
             </Helmet>
             <div className='p-8 pb-20'>
                 <div style={{ lineHeight: 1.5, marginBottom: '16px' }}>
-                    Move the mouse over the seccond navigation item to see the mega menu.
+                    Move the mouse over the second navigation item to see the mega menu.
                 </div>
                 <BrowserFrame
                     content={(

client/patterns/presence-indicator/Details.tsx

@@ -62,7 +62,7 @@ const Details: React.FC<{}> = () => {
     <!-- Other element such as avatar -->
     ...
 
-    <!-- The presense indicator -->
+    <!-- The presence indicator -->
     <div style="
         /* Shown at the bottom right corner */
         bottom: 0,

client/patterns/rating/Details.tsx

@@ -74,7 +74,7 @@ Note that we use \`flex-direction: row-reverse\` on the container
     margin: 0 2px;
     padding: 0;
 
-    /* Used to postion the hover state */
+    /* Used to position the hover state */
     position: relative;
 }
 </style>

client/patterns/watermark/Details.tsx

@@ -14,8 +14,8 @@ const Details: React.FC<{}> = () => {
     return (
         <DetailsLayout title="Watermark">
             <Helmet>
-                <meta name="description" content="Create a watermask with CSS" />
-                <meta name="keywords" content="css watermask" />
+                <meta name="description" content="Create a watermark with CSS" />
+                <meta name="keywords" content="css watermark" />
             </Helmet>
             <div className='p-8 pb-20'>
                 <BrowserFrame