Skip to content

Commit

Permalink
Merge pull request ajay-dhangar#841 from ajay-dhangar/dev-2
Browse files Browse the repository at this point in the history 
adde footer logo
  • Loading branch information
@ajay-dhangar
ajay-dhangar authored Oct 16, 2024
2 parents 4c690d5 + b0b934b commit b12a5a2
Show file tree
Hide file tree
Showing 7 changed files with 162 additions and 36 deletions.
13 changes: 13 additions & 0 deletions src/css/custom.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,19 @@ a:hover {
text-decoration: none;
}

.gradient-text {
background: linear-gradient(
90deg,
rgb(255, 169, 8) 0%,
rgb(246, 41, 41) 40%,
rgb(152, 0, 255) 100%
);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
color: transparent;
}

.footer{
background-color: #001;
}
Expand Down
185 changes: 149 additions & 36 deletions src/theme/Footer/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,60 +1,173 @@
import React from "react";
import { FaGithub, FaLinkedin, FaDiscord } from "react-icons/fa";
import { FaXTwitter } from 'react-icons/fa6';
import { FaGithub, FaLinkedin, FaDiscord, FaTwitter } from "react-icons/fa";
import Link from "@docusaurus/Link";

const Footer = () => {
return (
<footer className="bg-[#1a1b26] text-gray-300 py-12">
<div className="container mx-auto px-4">
<div className="grid grid-cols-1 md:grid-cols-4 gap-8 mb-8">
<div className="col-span-1 md:col-span-2">
<div className="flex items-center mb-4">
<img src="/algo/logo/algo.png" alt="Algo Logo" className="h-8 w-8 mr-3" />
<h2 className="text-3xl font-bold text-[#6366F1]">Algo</h2>
<div className="container mx-auto px-6 md:px-8">
<div className="grid grid-cols-1 md:grid-cols-3 gap-12 mb-8">
<div className="md:col-span-1">
<div className="mb-6">
<img
src="/algo/logo/logo.png"
alt="Algo Logo"
className="w-16 h-16"
/>

<span className="relative top-[-25px] text-3xl text-bold font-semibold ml-2 gradient-text">
Algo
</span>

<div>
{/* <h2 className="text-xl font-semibold text-white">Algo</h2> */}
<p className="text-gray-300 mt-1">
A platform to learn and practice DSA with a collection of
algorithms and data structures in various languages.
</p>
</div>
</div>
<p className="text-sm mb-4">
Your go-to platform for exploring algorithms, open-source
collaboration, and learning by doing.
</p>
<div className="flex space-x-4">
<Link to="https://github.com/ajay-dhangar" target="_blank" rel="noopener noreferrer" className="text-gray-400 hover:text-white transition duration-200">
<FaGithub className="w-5 h-5" />
{/* Social Media Links */}
<div className="flex space-x-4 mt-4">
<Link
to="https://github.com/ajay-dhangar"
target="_blank"
aria-label="GitHub"
rel="noopener noreferrer"
className="text-gray-400 hover:text-[#6366F1] transition-colors duration-300"
>
<FaGithub className="w-6 h-6" />
</Link>
<Link
to="https://linkedin.com/in/ajay-dhangar"
target="_blank"
aria-label="LinkedIn"
rel="noopener noreferrer"
className="text-gray-400 hover:text-[#6366F1] transition-colors duration-300"
>
<FaLinkedin className="w-6 h-6" />
</Link>
<Link to="https://linkedin.com/in/ajay-dhangar" target="_blank" rel="noopener noreferrer" className="text-gray-400 hover:text-white transition duration-200">
<FaLinkedin className="w-5 h-5" />
<Link
to="https://twitter.com/CodesWithAjay"
target="_blank"
aria-label="Twitter"
rel="noopener noreferrer"
className="text-gray-400 hover:text-[#6366F1] transition-colors duration-300"
>
<FaTwitter className="w-6 h-6" />
</Link>
<Link to="https://twitter.com/CodesWithAjay" target="_blank" rel="noopener noreferrer" className="text-gray-400 hover:text-white transition duration-200">
<FaXTwitter className="w-5 h-5" />
<Link
to="#"
target="_blank"
aria-label="Discord"
rel="noopener noreferrer"
className="text-gray-400 hover:text-[#6366F1] transition-colors duration-300"
>
<FaDiscord className="w-6 h-6" />
</Link>
</div>
</div>

{/* Resources */}
<div>
<h3 className="text-lg font-semibold mb-3 text-white">Resources</h3>
<ul className="space-y-2 text-sm text-[#6366F1]">
<li><Link to="/algo/docs/" className="hover:text-[#61dafb] transition duration-200">Documentation</Link></li>
<li><Link to="/algo/blog/" className="hover:text-[#61dafb] transition duration-200">Blog</Link></li>
<li><Link to="#" className="hover:text-[#61dafb] transition duration-200">Tutorials</Link></li>
<h3 className="text-lg font-semibold mb-4 text-white">Resources</h3>
<ul className="space-y-3">
<li className="list-none">
<Link
to="/algo/docs/"
className="text-gray-400 hover:text-[#61dafb] transition-colors duration-300"
>
Documentation
</Link>
</li>
<li className="list-none">
<Link
to="/algo/blog/"
className="text-gray-400 hover:text-[#61dafb] transition-colors duration-300"
>
Blog
</Link>
</li>
<li className="list-none">
<Link
to="#"
className="text-gray-400 hover:text-[#61dafb] transition-colors duration-300"
>
Tutorials
</Link>
</li>
</ul>
</div>

{/* Community */}
<div>
<h3 className="text-lg font-semibold mb-3 text-white">Community</h3>
<ul className="space-y-2 text-sm text-[#6366F1]">
<li><Link to="#" className="hover:text-[#61dafb] transition duration-200 flex items-center">Join Discord</Link></li>
<li><Link to="#" className="hover:text-[#61dafb] transition duration-200">Contributors</Link></li>
<li><Link to="#" className="hover:text-[#61dafb] transition duration-200">Events</Link></li>
<h3 className="text-lg font-semibold mb-4 text-white">Community</h3>
<ul className="space-y-3">
<li className="list-none">
<Link
to="#"
className="text-gray-400 hover:text-[#61dafb] transition-colors duration-300"
>
Join Discord
</Link>
</li>
<li className="list-none">
<Link
to="#"
className="text-gray-400 hover:text-[#61dafb] transition-colors duration-300"
>
Contributors
</Link>
</li>
<li className="list-none">
<Link
to="#"
className="text-gray-400 hover:text-[#61dafb] transition-colors duration-300"
>
Events
</Link>
</li>
</ul>
</div>
</div>

{/* Bottom Section */}
<div className="border-t border-gray-700 pt-8 flex flex-col md:flex-row justify-between items-center">
<ul className="flex flex-wrap justify-center md:justify-start space-x-6 mb-4 md:mb-0 text-[#6366F1]">
<li><Link to="#" className="text-sm hover:text-[#61dafb] transition duration-200">Features</Link></li>
<li><Link to="/algo/about/" className="text-sm hover:text-[#61dafb] transition duration-200">About Us</Link></li>
<li><Link to="/algo/contact/" className="text-sm hover:text-[#61dafb] transition duration-200">Contact</Link></li>
<li><Link to="#" className="text-sm hover:text-[#61dafb] transition duration-200">Privacy Policy</Link></li>
<li><Link to="/algo/terms/" className="text-sm hover:text-[#61dafb] transition duration-200">Terms and Condition</Link></li>
<ul className="flex flex-wrap justify-center md:justify-start space-x-6 mb-4 md:mb-0 text-sm text-gray-400">
<li className="list-none">
<Link
to="#"
className="hover:text-[#61dafb] transition-colors duration-300"
>
Features
</Link>
</li>
<li className="list-none">
<Link
to="/algo/about/"
className="hover:text-[#61dafb] transition-colors duration-300"
>
About Us
</Link>
</li>
<li className="list-none">
<Link
to="/algo/contact/"
className="hover:text-[#61dafb] transition-colors duration-300"
>
Contact
</Link>
</li>
<li className="list-none">
<Link
to="#"
className="hover:text-[#61dafb] transition-colors duration-300"
>
Privacy Policy
</Link>
</li>
</ul>
<p className="text-sm text-gray-500">
<p className="text-sm text-gray-500 mt-4 md:mt-0">
&copy; {new Date().getFullYear()} Algo, Inc. Built with Docusaurus.
</p>
</div>
Expand Down
Binary file removed static/logo/cpy-logo.jpg
View file
Binary file not shown.
Binary file removed static/logo/footer-logo.png
View file
Binary file not shown.
Binary file removed static/logo/logo-1.png
View file
Binary file not shown.
Binary file removed static/logo/logo-2.png
View file
Binary file not shown.
Binary file modified static/logo/logo.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit b12a5a2

Please sign in to comment.