Mobify index.tsx and Header.tsx for the new layuout

Author: nikohoffren

CONTRIBUTING.md

@@ -1,12 +1,12 @@
-# Contributing to devgallery.io repository
+# Contributing to Fork, Commit, Merge web repository
 
 First off, thanks for taking the time to contribute!
 
 The following is a set of guidelines for contributing to this project. These are mostly guidelines, not rules. Use your best judgment, and feel free to propose changes to this document in a pull request.
 
 ## Code of Conduct
 
-This project and everyone participating in it are governed by the [devgallery.io Code of Conduct](code_of_conduct.md). By participating, you are expected to uphold this code. Please report unacceptable behavior to [[email protected]](mailto:[email protected]).
+This project and everyone participating in it are governed by the [Fork, Commit, Merge Code of Conduct](code_of_conduct.md). By participating, you are expected to uphold this code. Please report unacceptable behavior to [[email protected]](mailto:[email protected]).
 
 ## How Can I Contribute?
 

README.md

@@ -1,14 +1,14 @@
 <div align="center">
 
-![Dev Gallery Screenshot](/public/devgallerybanner.png)
+![Dev Gallery Screenshot](/public/fork-commit-merge-web-banner.png)
 [![LICENSE](https://img.shields.io/badge/license-MIT-blue.svg)](LICENSE)
-[![Version 1.0.0](https://img.shields.io/badge/Version-1.0.0-brightgreen.svg)](https://github.com/nikohoffren/devgallery.io/pulls)
-[![Issues](https://img.shields.io/github/issues/nikohoffren/devgallery.io.svg?style=flat)](https://github.com/nikohoffren/devgallery.io/issues)
-[![PR:s Welcome](https://img.shields.io/badge/PR:s-Welcome-green.svg)](https://github.com/nikohoffren/devgallery.io/pulls)
-[![Contributors Welcome](https://img.shields.io/badge/Contributors-Welcome-green.svg)](https://github.com/nikohoffren/devgallery.io/pulls)
-![GitHub repo size](https://img.shields.io/github/repo-size/nikohoffren/devgallery.io)
+[![Version 1.0.0](https://img.shields.io/badge/Version-1.0.0-brightgreen.svg)](https://github.com/nikohoffren/fork-commit-merge-web/pulls)
+[![Issues](https://img.shields.io/github/issues/nikohoffren/fork-commit-merge-web.svg?style=flat)](https://github.com/nikohoffren/fork-commit-merge-web/issues)
+[![PR:s Welcome](https://img.shields.io/badge/PR:s-Welcome-green.svg)](https://github.com/nikohoffren/fork-commit-merge-web/pulls)
+[![Contributors Welcome](https://img.shields.io/badge/Contributors-Welcome-green.svg)](https://github.com/nikohoffren/fork-commit-merge-web/pulls)
+![GitHub repo size](https://img.shields.io/github/repo-size/nikohoffren/fork-commit-merge-web)
 
-devgallery.io serves as a platform where talented developers can spotlight their projects. It allows developers to not only feature their works but also create personal profiles for added visibility.
+Welcome to Fork Commit Merge, your one-stop resource hub for mastering GitHub contributions! Whether you're a novice coder or an experienced developer, our comprehensive guides are designed to streamline your GitHub journey. We delve into everything from basic Git commands to intricate pull request processes, making collaboration seamless and efficient. Learn the ins and outs of forking, committing, and merging with our easy-to-follow tutorials and expert advice. At Fork Commit Merge, we're passionate about empowering you to contribute confidently and effectively to the open-source world. Let's code, collaborate, and create together!
 
 </div>
 
@@ -24,9 +24,21 @@ devgallery.io serves as a platform where talented developers can spotlight their
 
 ## Features
 
--   Browse various development projects
--   Add your own projects
--   Create personal profiles
+-   **Comprehensive Guides**: Easy to follow step-by-step guides for various GitHub processes, from creating a repository to managing pull requests.
+
+-   **Command Tutorials**: Detailed tutorials on Git commands to enhance your productivity and workflow efficiency.
+
+-   **Best Practices**: Recommendations on Git and GitHub best practices to promote high-quality code and effective collaboration.
+
+-   **Contribution Guidelines**: Detailed guides on how to properly contribute to open-source projects, including etiquette and effective communication with project maintainers.
+
+-   **FAQs and Troubleshooting**: A comprehensive section dedicated to frequently asked questions and common issues users face while contributing on GitHub.
+
+-   **Community Forum**: A dedicated space for users to interact, share their experiences, ask questions, and learn from each other.
+
+-   **Resource Library**: An extensive collection of external resources such as books, blog posts, and video tutorials on Git and GitHub.
+
+-   **Regular Updates**: Stay up-to-date with the latest features and changes in GitHub's dynamic ecosystem with our regular update notifications.
 
 ## Tech Stack
 
@@ -44,13 +56,13 @@ Follow these steps to run the application in your local environment:
 1. Clone this repository.
 
     ```bash
-    git clone https://github.com/yourusername/devgallery.io.git
+    git clone https://github.com/yourusername/fork-commit-merge-web.git
     ```
 
 2. Install the project dependencies.
 
     ```bash
-    cd devgallery.io
+    cd fork-commit-merge-web
     npm i
     ```
 
@@ -110,14 +122,14 @@ Follow these steps to run the application in your local environment:
 
 ## Contributing
 
-Contributions to devgallery.io are always welcome, whether it be improvements to the documentation, new features, bug fixes, or even feedback on the project.
+Contributions to fork-commit-merge-web are always welcome, whether it be improvements to the documentation, new features, bug fixes, or even feedback on the project.
 
 **1.** Fork the project.
 
 **2.** Add a reference to the original repository:
 
 ```bash
-git remote add upstream https://github.com/nikohoffren/devgallery.io.git
+git remote add upstream https://github.com/nikohoffren/fork-commit-merge-web.git
 ```
 
 **3.** Check the remotes for this repository:
@@ -180,7 +192,7 @@ These roadmap items are subject to change based on user feedback and development
 
 ## Questions
 
-If you have any questions about the repo, open an issue or contact us directly at devgallery.io@gmail.com
+If you have any questions about the repo, open an issue or contact us directly at niko.hoffren@gmail.com
 
 ## License
 

components/Header.tsx

@@ -49,8 +49,8 @@ const Header = () => {
                             <Link href="/">
                                 <div className="py-2 px-6 block text-sm cursor-pointer hover:scale-105">
                                     <Image
-                                        src="/dev-gallery.png"
-                                        alt="devgallery.io logo"
+                                        src="/fork-commit-merge-logo.jpg"
+                                        alt="Fork, Commit, Merge -logo"
                                         width={40}
                                         height={40}
                                     />
@@ -167,7 +167,7 @@ const Header = () => {
                 </div>
             )}
             <header className="bg-slate-950 text-slate-50 sticky top-0 z-10 hidden md:block">
-                <div className="container mx-auto px-6 py-1 pb-6">
+                <div className="mx-auto px-12 py-1 pb-6 shadow-bottom">
                     <div className="mt-3 md:flex items-center space-x-1 justify-end">
                         <div className="relative" ref={node}>
                             <button

pages/index.tsx

@@ -26,35 +26,35 @@ export default function Home({ projects }: { projects: Project[] }) {
                     style={{ width: 180, height: 180 }}
                 >
                     <Image
-                        src="/dev-gallery.png"
-                        alt="Dev Gallery Logo"
+                        src="/fork-commit-merge-logo.jpg"
+                        alt="Fork, Commit, Merge -logo"
                         width={180}
                         height={180}
                         priority
                     />
                 </div>
                 <h1 className="mt-5 text-5xl font-bold text-slate-50">
-                    Welcome to devgallery.io
+                    Welcome to Fork, Commit, Merge
                 </h1>
-                <p className="mt-2 mb-20 text-lg font-light text-gray-100">
-                    Explore amazing projects developed by talented developers
+                <p className="mt-4 mb-20 text-lg font-light text-gray-100">
+                    Your one-stop resource hub for mastering GitHub
+                    contributions
                 </p>
                 <div className="bg-slate-900 w-full py-2">
                     <div className="my-5 text-xl font-light text-gray-100 mx-auto max-w-2xl">
-                        <code>devgallery.io</code> is a platform for showcasing
-                        and discovering amazing projects created by talented
-                        developers around the globe.
-                        <br />
-                        <br />
-                        By joining our community and adding your projects and
-                        profiles, you&apos;re not just increasing your
-                        visibility but also inspiring and motivating other
-                        developers.
-                        <br />
-                        <br />
-                        Don&apos;t miss out on this chance to be a part of a
-                        vibrant and supportive community. Register and upload
-                        your projects now. Let the world see your capabilities!
+                        <code>Fork, Commit, Merge</code> is your one-stop
+                        resource hub for mastering GitHub contributions! Whether
+                        you&apos;re a novice coder or an experienced developer,
+                        our comprehensive guides are designed to streamline your
+                        GitHub journey. We delve into everything from basic Git
+                        commands to intricate pull request processes, making
+                        collaboration seamless and efficient. Learn the ins and
+                        outs of forking, committing, and merging with our
+                        easy-to-follow tutorials and expert advice. At Fork
+                        Commit Merge, we&apos;re passionate about empowering you
+                        to contribute confidently and effectively to the
+                        open-source world. Let&apos;s code, collaborate, and
+                        create together!
                     </div>
                     <div className="my-10">
                         <Link

tailwind.config.js

@@ -1,26 +1,31 @@
 // tailwind.config.js
 module.exports = {
-  purge: ['./pages/**/*.{js,ts,jsx,tsx}', './components/**/*.{js,ts,jsx,tsx}'],
-  darkMode: false, // or 'media' or 'class'
-  theme: {
-    extend: {
-      colors: {
-        'slate': {
-          '960': '#191730',
-        }
-      },
-      backdropBlur: {
-        'none': '0',
-        'blur': 'blur(2px)',
-        'blur-lg': 'blur(4px)',
-        'blur-xl': 'blur(8px)',
-        'blur-2xl': 'blur(12px)',
-        'blur-3xl': 'blur(16px)',
-      }
+    content: [
+        "./pages/**/*.{js,ts,jsx,tsx}",
+        "./components/**/*.{js,ts,jsx,tsx}",
+    ],
+    theme: {
+        extend: {
+            colors: {
+                slate: {
+                    960: "#191730",
+                },
+            },
+            backdropBlur: {
+                none: "0",
+                blur: "blur(2px)",
+                "blur-lg": "blur(4px)",
+                "blur-xl": "blur(8px)",
+                "blur-2xl": "blur(12px)",
+                "blur-3xl": "blur(16px)",
+            },
+            boxShadow: {
+                bottom: "0 13px 10px -10px rgba(0.8, 0.8, 0.8, 0.8)",
+            },
+        },
     },
-  },
-  variants: {
-    extend: {},
-  },
-  plugins: [],
-}
+    variants: {
+        extend: {},
+    },
+    plugins: [],
+};