Reverted back to previous state

.github/workflows/nextjs_init.yml

@@ -7,7 +7,7 @@ name: Deploy Next.js site to Pages
 on:
   # Runs on pushes targeting the default branch
   push:
-    branches: ["main"]
+    # branches: ["main"]
 
   # Allows you to run this workflow manually from the Actions tab
   workflow_dispatch:

next.config.mjs

@@ -1,10 +1,4 @@
 /** @type {import('next').NextConfig} */
-const nextConfig = {
-    reactStrictMode: true,
-    swcMinify: true,
-    images: {
-        domains: ["skillicons.dev", "github.com", "readme-typing-svg.demolab.com", "img.shields.io", "komarev.com", "avatars.githubusercontent.com", "api.codetime.dev", "images.unsplash.com", "img.shields.io"],
-    },
-};
+const nextConfig = {};
 
 export default nextConfig;

src/app/about/page.tsx

@@ -1,42 +1,10 @@
-import AboutMe from "@/components/about/AboutMe";
-import EducationDetail from "@/components/about/EducationDetail";
-import Thanks from "@/components/about/Thanks";
-
+import ResumePage from "@/components/about/Resume";
 import React from "react";
 
-
-const educationDetailsData = [
-  {
-    courseName: "Diploma Engineering",
-    schoolName: "Mymensingh Polytechnic Institute",
-    location: "Mymensingh, Bangladesh",
-    subjects: ["Mechanical Engineering"],
-    years: "2019 - 2023",
-    length: "4 years",
-    results: "3.08/4.00",
-    description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
-  },
-  {
-    courseName: "SSC-Secondary School Certificate",
-    schoolName: "Medha Bikash Maltilateral Technical High School",
-    location: "Ulipur, Kurigram, Dhaka, Bangladesh",
-    subjects: ["Computer Trade"],
-    years: "2017 - 2019",
-    length: "2 years",
-    results: "4.71/5.00",
-    description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
-  },
-  // Add more education details as needed
-];
-
-
 const AboutPage = () => {
   return (
     <div>
-      <AboutMe />
-
-      <EducationDetail educationDetails={educationDetailsData} />
-      <Thanks />
+      <ResumePage />
     </div>
   );
 };

src/app/github-stats/page.tsx

@@ -3,7 +3,7 @@ import React from "react";
 
 const GithubStatsPage = () => {
   return (
-    <div className="">
+    <div>
       <GithubStats />
     </div>
   );

src/app/page.tsx

@@ -5,7 +5,6 @@ const HomePage: React.FC = () => {
   return (
     <div>
       <Home />
-
     </div>
   );
 };

src/app/skills/page.tsx

@@ -1,10 +1,10 @@
-import Skills from "@/components/skills/Skills";
+import SkillCard from "@/components/skills/SkillsCared";
 import React from "react";
 
 const SkillsPage = () => {
   return (
     <div>
-      <Skills />
+      <SkillCard />
     </div>
   );
 };

src/components/about/AboutMe.tsx

@@ -1,36 +1,16 @@
-import React from 'react';
-import Image from 'next/image';
+import React from "react";
 
-const AboutMe = () => {
+interface AboutMeProps {
+  about: string;
+}
+
+const AboutMeComponent: React.FC<AboutMeProps> = ({ about }) => {
   return (
-    <div className="  bg-gray-100 dark:bg-gray-800 flex justify-center items-center">
-      <div className="lg:w-[80%] sm:w-[80%] xs:w-[90%] mx-auto flex flex-col lg:flex-row gap-8 items-center">
-        {/* Image Section */}
-        <div className="w-full lg:w-1/3 flex justify-center lg:justify-end">
-          <Image
-            width={300}
-            height={300}
-            src="https://avatars.githubusercontent.com/u/105772384?v=4"
-            alt="About Me"
-            className="w-32 h-32 lg:w-48 lg:h-48 object-cover rounded-full shadow-xl border-green-400 border-4"
-          />
-        </div>
-        {/* Article Section */}
-        <div className="w-full lg:w-3/1 flex flex-col gap-4 text-dark dark:text-white p-4 rounded-lg border border-green-300 shadow-xl shadow-green-400/30">
-          <h5 className="text-sm text-green-500 font-semibold">About Me</h5>
-          <h2 className="text-3xl font-semibold uppercase font-serif">Samuel Abera</h2>
-          <hr className="w-[50%] h-1 rounded-full border-t-green-500 bg-green-500" />
-          <p className="text-sm">
-            Hello! I am Samuel Abera, a versatile developer specializing in bridging the gap between front-end design and back-end functionality. My expertise lies in creating seamless user experiences by transforming lines of code into interactive and intuitive digital solutions. I excel in solving complex problems and collaborating effectively with diverse teams to deliver innovative solutions.
-          </p>
-          <p className="text-sm">
-            I thrive on embracing the latest technologies to build efficient and scalable applications. Passionate about coding and committed to excellence, I am dedicated to crafting the future of digital experiences. With a strong foundation in Node.js, JavaScript, and TypeScript, I consistently push the boundaries of what’s possible in web development, ensuring that each project not only meets but exceeds user expectations.
-          </p>
-        </div>
-      </div>
-
+    <div className="bg-lime-100 dark:bg-slate-600 shadow rounded-lg p-6">
+      <h2 className="text-xl font-bold mb-16">About Me</h2>
+      <p className="text-gray-700 dark:text-white">{about}</p>
     </div>
   );
 };
 
-export default AboutMe;
+export default AboutMeComponent;

src/components/about/AboutMeTabs.tsx

@@ -0,0 +1,125 @@
+"use client";
+import { useState } from "react";
+import { Tab } from "@headlessui/react";
+
+function classNames(...classes: string[]) {
+  return classes.filter(Boolean).join(" ");
+}
+
+export default function Example() {
+  let [categories] = useState({
+    Recent: [
+      {
+        id: 1,
+        title: "Does drinking coffee make you smarter?",
+        date: "5h ago",
+        commentCount: 5,
+        shareCount: 2,
+      },
+      {
+        id: 2,
+        title: "So you've bought coffee... now what?",
+        date: "2h ago",
+        commentCount: 3,
+        shareCount: 2,
+      },
+    ],
+    Popular: [
+      {
+        id: 1,
+        title: "Is tech making coffee better or worse?",
+        date: "Jan 7",
+        commentCount: 29,
+        shareCount: 16,
+      },
+      {
+        id: 2,
+        title: "The most innovative things happening in coffee",
+        date: "Mar 19",
+        commentCount: 24,
+        shareCount: 12,
+      },
+    ],
+    Trending: [
+      {
+        id: 1,
+        title: "Ask Me Anything: 10 answers to your questions about coffee",
+        date: "2d ago",
+        commentCount: 9,
+        shareCount: 5,
+      },
+      {
+        id: 2,
+        title: "The worst advice we've ever heard about coffee",
+        date: "4d ago",
+        commentCount: 1,
+        shareCount: 2,
+      },
+    ],
+  });
+
+  return (
+    <div className="w-full h-screen  px-2 py-16 sm:px-0">
+      <Tab.Group>
+        <Tab.List className="flex space-x-1 rounded-xl bg-blue-900 p-1">
+          {Object.keys(categories).map((category) => (
+            <Tab
+              key={category}
+              className={({ selected }) =>
+                classNames(
+                  "w-full rounded-lg py-2.5 text-sm font-medium leading-5",
+                  "ring-white/60 ring-offset-2 ring-offset-blue-400 focus:outline-none focus:ring-2",
+                  selected
+                    ? "bg-white text-blue-700 shadow"
+                    : "text-blue-100 hover:bg-white/[0.12] hover:text-white"
+                )
+              }
+            >
+              {category}
+            </Tab>
+          ))}
+        </Tab.List>
+        <Tab.Panels className="mt-2">
+          {Object.values(categories).map((posts, idx) => (
+            <Tab.Panel
+              key={idx}
+              className={classNames(
+                "rounded-xl bg-white p-3",
+                "ring-white/60 ring-offset-2 ring-offset-blue-400 focus:outline-none focus:ring-2"
+              )}
+            >
+              <ul>
+                {posts.map((post) => (
+                  <li
+                    key={post.id}
+                    className="relative rounded-md p-3 hover:bg-gray-100"
+                  >
+                    <h3 className="text-sm font-medium leading-5">
+                      {post.title}
+                    </h3>
+
+                    <ul className="mt-1 flex space-x-1 text-xs font-normal leading-4 text-gray-500">
+                      <li>{post.date}</li>
+                      <li>&middot;</li>
+                      <li>{post.commentCount} comments</li>
+                      <li>&middot;</li>
+                      <li>{post.shareCount} shares</li>
+                    </ul>
+
+                    <a
+                      href="#"
+                      className={classNames(
+                        "absolute inset-0 rounded-md",
+                        "ring-blue-400 focus:z-10 focus:outline-none focus:ring-2"
+                      )}
+                    />
+                  </li>
+                ))}
+              </ul>
+            </Tab.Panel>
+          ))}
+        </Tab.Panels>
+      </Tab.Group>
+    </div>
+  );
+}

src/components/about/Disclosure.tsx

@@ -0,0 +1,7 @@
+import React from "react";
+
+const Disclosure = () => {
+  return <div>Disclosure</div>;
+};
+
+export default Disclosure;