Merge remote-tracking branch 'origin' into refactor/card-columns

Author: cherylli

components/ContactUsCards.js

@@ -43,9 +43,9 @@ export default function ContactUsCards() {
           ]}
           altTags={['FAQ', 'Blog', 'Repository']}
           content={[
-            'You can find the main questions about the project.',
-            'You can share your projects and ideas to all our community.',
-            'You can see most used codes, guidelines and more.',
+            'Find the main questions about the project.',
+            'Share your projects and ideas with our community.',
+            'Check out our codebase and guidelines.',
           ]}
           links={[
             'https://github.com/Web-Dev-Path/web-dev-path/wiki/FAQ',

components/containers/Card.js

@@ -6,6 +6,13 @@ export default function Card({
   card: { image, altTag, title, content, link, linkText },
   customClass,
 }) {
+  const LinkComponent = link?.startsWith('http') ? (
+    <a href={link} target='_blank' rel='noopener noreferrer'>
+      {linkText}
+    </a>
+  ) : (
+    <Link href={link}>{linkText}</Link>
+  );
   return (
     <div
       className={
@@ -27,7 +34,7 @@ export default function Card({
       <h2 className={styles.title}>{title}</h2>
       <div className={styles.content}>
         <p>
-          {content} {link && <Link href={link}>{linkText}</Link>}
+          {content} {link && LinkComponent}
         </p>
       </div>
     </div>