Snigdha-OS/snigdhaos-web-dev
2
0
Fork 0
mirror of https://github.com/Snigdha-OS/snigdhaos-web-dev.git synced 2025-09-07 21:35:13 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

✨ style(ui*): changes

Browse Source
This commit is contained in:
Eshan Roy
2024-12-08 23:55:52 +05:30
parent 90e2e1ba46
commit 8b69fd2b0d
1 changed files with 42 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
src/components/layout/Footer.tsx
View File

@@ -3,7 +3,6 @@ import { Github } from 'lucide-react';
export function Footer() { export function Footer() {
const [githubFollowers, setGithubFollowers] = useState<number | null>(null); const [githubFollowers, setGithubFollowers] = useState<number | null>(null);
// const [gitlabFollowers, setGitlabFollowers] = useState<number | null>(null);
// Fetch GitHub follower count // Fetch GitHub follower count
useEffect(() => { useEffect(() => {
@@ -18,34 +17,44 @@ export function Footer() {
}, []); }, []);
return ( return (
<footer className="bg-gradient-to-r from-gray-900 via-gray-800 to-gray-900 text-white py-10"> <footer className="bg-gradient-to-r from-gray-900 via-gray-800 to-gray-900 text-white py-16">
<div className="container mx-auto px-6"> <div className="container mx-auto px-6">
<div className="grid grid-cols-1 md:grid-cols-4 gap-8"> <div className="grid grid-cols-1 md:grid-cols-4 gap-10">
{/* Snigdha OS Section */} {/* Snigdha OS Section */}
<div> <div>
<h3 className="font-extrabold text-lg mb-4">Snigdha OS</h3> <h3 className="font-bold text-xl mb-6 text-indigo-400">Snigdha OS</h3>
<p className="text-sm text-gray-400 leading-relaxed"> <p className="text-sm text-gray-400 leading-relaxed">
Arch based Linux Distribution for Penetration Testing and Ethical Hacking! Arch-based Linux Distribution for Penetration Testing and Ethical Hacking! Experience power and simplicity
like never before.
</p> </p>
</div> </div>
{/* Quick Links */} {/* Quick Links */}
<div> <div>
<h3 className="font-extrabold text-lg mb-4">Quick Links</h3> <h3 className="font-bold text-xl mb-6 text-indigo-400">Quick Links</h3>
<ul className="space-y-3 text-sm"> <ul className="space-y-4 text-sm">
<li> <li>
<a href="https://blog.snigdhaos.org/" className="hover:text-indigo-400 transition-colors"> <a
Blog <sup> upcoming!</sup> href="https://blog.snigdhaos.org/"
className="hover:text-indigo-400 transition-colors"
>
Blog <span className="text-xs text-gray-400">(Upcoming!)</span>
</a> </a>
</li> </li>
<li> <li>
<a href="https://forum.snigdhaos.org/" className="hover:text-indigo-400 transition-colors"> <a
Forums<sup> maintenance!</sup> href="https://forum.snigdhaos.org/"
className="hover:text-indigo-400 transition-colors"
>
Forums <span className="text-xs text-gray-400">(Maintenance!)</span>
</a> </a>
</li> </li>
<li> <li>
<a href="#" className="hover:text-indigo-400 transition-colors"> <a
Community<sup> upcoming!</sup> href="#"
className="hover:text-indigo-400 transition-colors"
>
Community <span className="text-xs text-gray-400">(Upcoming!)</span>
</a> </a>
</li> </li>
</ul> </ul>
@@ -53,16 +62,14 @@ export function Footer() {
{/* Documentation */} {/* Documentation */}
<div> <div>
<h3 className="font-extrabold text-lg mb-4">Documentation</h3> <h3 className="font-bold text-xl mb-6 text-indigo-400">Documentation</h3>
<ul className="space-y-3 text-sm"> <ul className="space-y-4 text-sm">
<li> <li>
<a <a
href="https://snigdha-os.github.io/documentation/category/installation" href="https://snigdha-os.github.io/documentation/category/installation"
className="hover:text-indigo-400 transition-colors" className="hover:text-indigo-400 transition-colors"
> >
Installation Guide <sup> Installation Guide
<a href="https://snigdha-os.github.io/documentation/category/installation">git-version</a>
</sup>
</a> </a>
</li> </li>
<li> <li>
@@ -70,7 +77,7 @@ export function Footer() {
href="https://snigdha-os.github.io/documentation/category/user-guide" href="https://snigdha-os.github.io/documentation/category/user-guide"
className="hover:text-indigo-400 transition-colors" className="hover:text-indigo-400 transition-colors"
> >
User Guide <sup>git-version</sup> User Guide
</a> </a>
</li> </li>
<li> <li>
@@ -78,7 +85,7 @@ export function Footer() {
href="https://snigdha-os.github.io/documentation/introduction/release_notes" href="https://snigdha-os.github.io/documentation/introduction/release_notes"
className="hover:text-indigo-400 transition-colors" className="hover:text-indigo-400 transition-colors"
> >
Release Notes <sup>git-version</sup> Release Notes
</a> </a>
</li> </li>
</ul> </ul>
@@ -86,33 +93,31 @@ export function Footer() {
{/* Connect Section */} {/* Connect Section */}
<div> <div>
<h3 className="font-extrabold text-lg mb-4">Connect</h3> <h3 className="font-bold text-xl mb-6 text-indigo-400">Connect</h3>
<div className="flex space-x-5"> <div className="flex items-center space-x-5">
{/* GitHub Follower Count Card */} <a
<div className="bg-gray-800 p-4 rounded-lg shadow-lg flex items-center space-x-3"> href="https://github.com/Snigdha-OS"
<a target="_blank"
href="https://github.com/Snigdha-OS" rel="noopener noreferrer"
className="hover:text-indigo-400 transition-all" className="flex items-center space-x-3 bg-gray-800 hover:bg-indigo-500 transition-colors px-4 py-3 rounded-lg shadow-lg"
target="_blank" >
rel="noopener noreferrer" <Github className="h-7 w-7 text-white" />
>
<Github className="h-7 w-7 text-white" />
</a>
{githubFollowers !== null && ( {githubFollowers !== null && (
<div className="text-white"> <div className="text-white">
<span className="block text-sm">Followers</span> <span className="text-sm">Followers</span>
<span className="text-lg font-bold">{githubFollowers}</span> <span className="block text-lg font-bold">{githubFollowers}</span>
</div> </div>
)} )}
</div> </a>
</div> </div>
</div> </div>
</div> </div>
{/* Footer Bottom */} {/* Footer Bottom */}
<div className="mt-12 pt-8 border-t border-gray-700 text-center text-sm text-gray-500"> <div className="mt-16 pt-8 border-t border-gray-700 text-center text-sm text-gray-400">
<p> <p>
© {new Date().getFullYear()} Snigdha OS℠ & Tonmoy Infrastructure™. All rights reserved. © {new Date().getFullYear()} <span className="text-indigo-400">Snigdha OS</span> & Tonmoy Infrastructure™.
All rights reserved.
</p> </p>
<p className="mt-2">Built with ❤️ by the Snigdha OS team.</p> <p className="mt-2">Built with ❤️ by the Snigdha OS team.</p>
</div> </div>