Merge branch 'main' into feat/enrollment

client/src/components/TweetShare/index.css

@@ -0,0 +1,13 @@
+.share-tweet {
+    display: inline-block;
+    padding: 0.5rem 1rem;
+    border-radius: 5px;
+    background: rgb(21, 152, 239);
+    box-shadow: rgb(0 0 0 / 8%) 0px 8px 28px;
+    font-size: 0.9rem;
+}
+
+.share-tweet i {
+    margin-left: 0.65rem;
+    font-size: 1rem;
+}

client/src/components/TweetShare/index.jsx

@@ -0,0 +1,24 @@
+import React from "react";
+import "./index.css";
+
+const ShareTweet = ({
+  shareText = "Hello there 👋 I'm following and learning through the roadmaps. Join my journey!",
+}) => {
+  function shareProgressUrl() {
+    return "http://twitter.com/share?text=" + encodeURIComponent(shareText);
+  }
+
+  return (
+    <a
+      className="share-tweet"
+      href={shareProgressUrl()}
+      target="_blank"
+      rel="noreferrer"
+    >
+      Share your progress
+      <i className="fa-brands fa-twitter"></i>
+    </a>
+  );
+};
+
+export default ShareTweet;

client/src/pages/Home/index.css

@@ -3,6 +3,9 @@
     height: 100%
 }
 
+.home-container h1 {
+    margin-bottom: 1rem;
+}
 
 .home-container>div:nth-child(2) {
     min-width: 30%;
@@ -26,7 +29,7 @@
     padding-left: 0;
     gap: 1rem;
     text-align: center;
-    margin-top: 1rem;
+    margin-top: 0.5rem;
 }
 
 .home-container .stats-card .card {