Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

chore: Added star on GitHub image 🌟🚀 #1953

Merged
merged 8 commits into from
Aug 4, 2023
Merged

chore: Added star on GitHub image 🌟🚀 #1953

Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
c2a0114
feat: "Start Contribution" with "Star on GitHub" Added
Nishitbaria Aug 3, 2023
8b08a60
Merge branch 'main' into #1810
Nishitbaria Aug 3, 2023
e0dcfbf
Fix
Nishitbaria Aug 3, 2023
48a481f
Fix Heading Alignment
Nishitbaria Aug 4, 2023
8e6694f
Heading Alignment Fix
Nishitbaria Aug 4, 2023
a2d46a0
Github Star Button Alignment Fix
Nishitbaria Aug 4, 2023
9784a4c
Fix : Final 🤝🤝
Nishitbaria Aug 4, 2023
5f3b3b4
Fix : Final 2 🤝🤝
Nishitbaria Aug 4, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
121 changes: 85 additions & 36 deletions components/Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,83 +1,95 @@
import React from "react";
import { SiTwitter, SiGithub, SiLinkedin } from "react-icons/si";
import Link from "next/link";

import Image from "next/image";
function Footer() {
const getCurrentYear = () => new Date().getFullYear();


const footerLinks = [
{
name: "Twitter",
link: "https://twitter.com/priyankarpal",
icon: <SiTwitter aria-label="Follow us on Twitter" title="Twitter(External Link)" />,
icon: (
<SiTwitter
aria-label="Follow us on Twitter"
title="Twitter(External Link)"
/>
),
hover: " text-xl text-gray-200 cursor-pointer hover:text-purple-500 ",
},
{
name: "GitHub",
link: "https://github.com/priyankarpal",
icon: <SiGithub aria-label="Follow us on GitHub" title="GitHub(External Link)" />,
icon: (
<SiGithub
aria-label="Follow us on GitHub"
title="GitHub(External Link)"
/>
),
hover: " text-xl text-gray-200 cursor-pointer hover:text-purple-500 ",
},
{
name: "Linkedin",
link: "https://linkedin.com/in/priyankarpal",
icon: <SiLinkedin aria-label="Follow us on LinkedIn" title="LinkedIn(External Link)" />,
icon: (
<SiLinkedin
aria-label="Follow us on LinkedIn"
title="LinkedIn(External Link)"
/>
),
hover: " text-xl text-gray-200 cursor-pointer hover:text-purple-700 ",
}
]
},
];

const footerdocsLinks = [
{
title: "Documentation",
child: [
{
name: "Contributing Guide",
link: "https://github.com/priyankarpal/ProjectsHut/blob/main/contributing.md"
link: "https://github.com/priyankarpal/ProjectsHut/blob/main/contributing.md",
},
{
name: "Add projects via GitHub",
link: "https://github.com/priyankarpal/ProjectsHut/blob/main/contributing.md#how-to-add-your-projects-to-projectshut"
link: "https://github.com/priyankarpal/ProjectsHut/blob/main/contributing.md#how-to-add-your-projects-to-projectshut",
},
{
name: "Run the project locally",
link: "https://github.com/priyankarpal/ProjectsHut/blob/main/contributing.md#note-alternatively-if-you-prefer-to-run-the-project-locally-follow-these-steps"
}

]
}

]
link: "https://github.com/priyankarpal/ProjectsHut/blob/main/contributing.md#note-alternatively-if-you-prefer-to-run-the-project-locally-follow-these-steps",
},
],
},
];

const footerServiceLinks = [
{

title: "License",
child: [
{
name: "MIT License",
link: "https://github.com/priyankarpal/ProjectsHut/blob/main/LICENSE"
link: "https://github.com/priyankarpal/ProjectsHut/blob/main/LICENSE",
},
{
name: "Code of Conduct",
link: "https://github.com/priyankarpal/ProjectsHut/blob/main/CODE_OF_CONDUCT.md"
link: "https://github.com/priyankarpal/ProjectsHut/blob/main/CODE_OF_CONDUCT.md",
},
]
}


]
],
},
];

return (
<footer className="border-t border-gray-800">
<div className="mx-auto max-w-screen-xl pt-16 sm:px-4 sm:pb-[5.65rem] lg:px-8 lg:pb-8">
<div className="mt-16 grid grid-cols-1 gap-8 lg:grid-cols-2 lg:gap-32">
<div className="mx-auto max-w-sm lg:max-w-none">
<div className="flex h-10 items-center justify-center lg:justify-start text-white rounded-lg font-extrabold text-[2rem] text-center"> Ph <span className="text-primary">.</span></div>
<p
className="mt-4 text-center text-gray-200 dark:text-gray-400 lg:text-left lg:text-lg"
>
Projectshut is an open source web app that enables users to freely publish their projects and create user profiles within the platform
<div className="flex h-10 items-center justify-center lg:justify-start text-white rounded-lg font-extrabold text-[2rem] text-center">
{" "}
Ph <span className="text-primary">.</span>
</div>
<p className="mt-4 text-center text-gray-200 dark:text-gray-400 lg:text-left lg:text-lg">
Projectshut is an open source web app that enables users to freely
publish their projects and create user profiles within the
platform
</p>

{/* for footer nav links */}
Expand All @@ -97,16 +109,26 @@ function Footer() {
</div>
</div>

<div className="grid grid-cols-1 gap-8 lg:grid-cols-2 lg:text-left">
<div className="grid grid-cols-1 gap-8 lg:grid-cols-3 lg:text-left">
{/* for footer docs links */}
<ul className="font-medium text-gray-200 pt-5">
{footerdocsLinks.map((section, index) => (
<div key={index}>
<h3 className="text-xl font-extrabold mb-4 text-gray-200">{section.title}</h3>
<h3 className="text-xl font-extrabold mb-4 text-gray-200">
{section.title}
</h3>
<ul>
{section.child.map((link, linkIndex) => (
<li key={linkIndex} className="pt-2">
<Link href={link.link} className="hover:text-primary " rel="noopener noreferrer" target="_blank" aria-label="footer docs link" >{link.name}</Link>
<Link
href={link.link}
className="hover:text-primary "
rel="noopener noreferrer"
target="_blank"
aria-label="footer docs link"
>
{link.name}
</Link>
</li>
))}
</ul>
Expand All @@ -118,17 +140,45 @@ function Footer() {
<ul className="font-medium text-gray-200">
{footerServiceLinks.map((section, index) => (
<div key={index}>
<h3 className="text-xl font-extrabold mt-4 mb-4 text-gray-200">{section.title}</h3>
<h3 className="text-xl font-extrabold mt-5 mb-4 text-gray-200">
{section.title}
</h3>
<ul>
{section.child.map((link, linkIndex) => (
<li key={linkIndex} className="pt-2">
<Link href={link.link} className="hover:text-primary " rel="noopener noreferrer" target="_blank" aria-label="footer service link">{link.name}</Link>
<Link
href={link.link}
className="hover:text-primary "
rel="noopener noreferrer"
target="_blank"
aria-label="footer service link"
>
{link.name}
</Link>
</li>
))}
</ul>
</div>
))}
</ul>
{/* GitHub link */}
<div className="mt-[25px]">
<div className="p-2 bg-white rounded-lg max-w-[170px] mx-auto ">
<Link
href="https://github.com/priyankarpal/ProjectsHut"
target="_blank"
rel="noreferrer"
aria-label="GitHub repository"
>
<Image
src="https://github.com/priyankarpal/ProjectsHut/assets/88102392/0fa9e8f0-349d-4cc8-8e01-1b6e2c27dbbb"
alt="Github-Share-Button"
width={144}
height={46}
/>
</Link>
</div>
</div>
</div>
</div>

Expand All @@ -139,8 +189,7 @@ function Footer() {
</div>
</div>
</footer>

);
}

export default Footer;
export default Footer;