Skip to content

Commit

Permalink
Merge pull request #71 from SpaceyaTech/felix-landing-page-redesign
Browse files Browse the repository at this point in the history 
Felix landing page redesign
  • Loading branch information
@Ase020
Ase020 authored Nov 3, 2023
2 parents c27fc77 + ac3fd54 commit 7be3ec6
Show file tree
Hide file tree
Showing 51 changed files with 965 additions and 314 deletions.
3 changes: 2 additions & 1 deletion .gitignore
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,4 +32,5 @@ build
coverage

# Ignore all HTML files:
*.html
*.html
.env
30 changes: 14 additions & 16 deletions src/APP/components/FAQ.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,12 @@

import { useState } from "react";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faChevronDown, faChevronUp } from "@fortawesome/free-solid-svg-icons";
import {
faChevronDown,
faChevronUp,
faArrowRight,
} from "@fortawesome/free-solid-svg-icons";
import { Link } from "react-router-dom";

const FAQ = () => {
const [activeQuestion, setActiveQuestion] = useState(null);
Expand All @@ -21,11 +26,11 @@ const FAQ = () => {
{
question: "Does SpaceYaTech pay mentors?",
answer:
"No, SpaceYaTech does not pay mentors. However, mentors do receive a number of benefits",
"No, SpaceYaTech does not pay mentors. However, mentors do receive a number of benefits.",
},
{
question: "Can I collaborate with SpaceYaTech?",
answer: "Yes, you can collaborate with SpaceYaTech in a number of ways",
answer: "Yes, you can collaborate with SpaceYaTech in a number of ways.",
},
{
question: "Can I join the mentorship sessions at any time?",
Expand Down Expand Up @@ -95,20 +100,13 @@ const FAQ = () => {
))}

<div className="flex justify-center mt-4 md:mt-8">
<a className="mt-3 text-[#00664E] inline-flex items-center bg-white p-3 rounded-lg cursor-pointer">
<Link
to="/about-us"
className="mt-3 text-[#00664E] inline-flex items-center bg-white p-3 rounded-lg cursor-pointer"
>
Learn More
<svg
fill="none"
stroke="currentColor"
strokeLinecap="round"
strokeLinejoin="round"
strokeWidth={2}
className="w-4 h-4 ml-2"
viewBox="0 0 24 24"
>
<path d="M5 12h14M12 5l7 7-7 7" />
</svg>
</a>
<FontAwesomeIcon icon={faArrowRight} className="ml-2" />
</Link>
</div>
</div>
);
Expand Down
75 changes: 48 additions & 27 deletions src/APP/components/Footer2.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,15 +1,14 @@
import React from "react";
import { Link } from "react-router-dom";

import logo from "../../assets/images/sytLogo.png";
import backup from "../../assets/images/backup.svg";
import {
facebook,
instagram,
linkedin,
twitter,
} from "../../assets/images/socials";

const Footer2 = () => {
var now = new Date();
var year = now.getFullYear();
import { linkedin, twitter, spotify } from "../../assets/images/socials";

function Footer2() {
const now = new Date();
const year = now.getFullYear();

return (
<footer className="bg-[#252533] text-white md:p-12 py-8 px-4 relative">
<div className="flex md:flex-row flex-col md:gap-16 gap-8 ">
Expand All @@ -23,19 +22,31 @@ const Footer2 = () => {

{/* socials */}
<div className="flex items-center md:gap-5 gap-3 py-4">
<a href="/" target="_blank" rel="noopener noreferrer">
<img src={facebook} alt="facebook" className="w-7 h7" />
<a
href="https://open.spotify.com/show/4nUYzhacDAw1v9ClqPY89n"
target="_blank"
rel="noopener noreferrer"
>
<img src={spotify} alt="spotify" className="w-7 h7" />
</a>

<a href="/" target="_blank" rel="noopener noreferrer">
{/* <a href="/" target="_blank" rel="noopener noreferrer">
<img src={instagram} alt="instagram" className="w-7 h7" />
</a>
</a> */}

<a href="/" target="_blank" rel="noopener noreferrer">
<a
href="https://twitter.com/SpaceyaTech"
target="_blank"
rel="noopener noreferrer"
>
<img src={twitter} alt="twiiter" className="w-7 h7" />
</a>

<a href="/" target="_blank" rel="noopener noreferrer">
<a
href="https://linkedin.com/company/spaceyatech"
target="_blank"
rel="noopener noreferrer"
>
<img src={linkedin} alt="linkedin" className="w-7 h7" />
</a>
</div>
Expand All @@ -49,13 +60,19 @@ const Footer2 = () => {
</h2>

<ul className="flex flex-col gap-5 list-none text-sm font-light">
<li>About Us</li>
<li>FAQs</li>
<li>Community</li>
<li>
<Link to="/about-us">About Us</Link>
</li>
<li>
<a href="/#faq">FAQs</a>
</li>
<li>
<Link to="/community">Community</Link>
</li>
</ul>
</div>

<div className="flex flex-col gap-8">
{/* <div className="flex flex-col gap-8">
<h2 className="text-[#00FFC3] font-bold sm:text-xl text-lg leading-9">
Resources
</h2>
Expand All @@ -65,9 +82,9 @@ const Footer2 = () => {
<li>Events</li>
<li>Mentorship</li>
</ul>
</div>
</div> */}

<div className="flex flex-col gap-8">
{/* <div className="flex flex-col gap-8">
<h2 className="text-[#00FFC3] font-bold sm:text-xl text-lg leading-9">
Quick Links
</h2>
Expand All @@ -78,7 +95,7 @@ const Footer2 = () => {
<li>Privacy Policy</li>
<li>Terms of Use</li>
</ul>
</div>
</div> */}
</div>
<div className="flex-2">
<div className="flex flex-col gap-8">
Expand All @@ -88,8 +105,10 @@ const Footer2 = () => {

<div className="flex flex-col gap-5 text-sm font-light">
<p className="text-sm left-6">
Subscribe to our newsletter to get your <br />
weekly dose of news, updates, tips and even <br />
Subscribe to our newsletter to get your
<br />
weekly dose of news, updates, tips and even
<br />
special offers
</p>

Expand All @@ -113,7 +132,9 @@ const Footer2 = () => {

<div className="sm:mt-14 mt-10">
<h1 className="text-center text-[#00FFC3] my-4 md:my-8">
&copy; {year} SpaceYaTech | All Rights Reserved.
&copy;
{year}
SpaceYaTech | All Rights Reserved.
</h1>
</div>

Expand All @@ -124,6 +145,6 @@ const Footer2 = () => {
/>
</footer>
);
};
}

export default Footer2;
86 changes: 51 additions & 35 deletions src/APP/components/Header2.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,7 @@ const Header2 = () => {
const [showNavlinks, setShowNavlinks] = useState(false);

return (
<header className="py-5 md:px-10 px-5 flex items-center justify-between md:shadow-none shadow-md relative">

<header className="py-5 md:px-10 px-5 flex items-center justify-between md:shadow-none shadow-md relative max-w-[1440px] md:mx-auto">
{/* logo */}
<Link to="/">
<img src={logo} alt="logo" className="md:w-16 w-12" />
Expand All @@ -25,117 +24,134 @@ const Header2 = () => {

{/* mobile navlinks */}
<nav
className="flex-col items-start gap-8 text-base absolute top-[90px] left-0 bg-white w-full h-[480px] z-[1] p-5 pl-12"
style={showNavlinks ? { display: "flex" } : { display: "none" }}
className="flex flex-col items-start justify-start gap-6 text-base absolute top-[90px] left-0 bg-white border-b w-full h-fit z-[1] p-5 pl-12"
style={
showNavlinks
? { display: "flex", height: "calc(100vh - 90px)" }
: { display: "none" }
}
>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/"
onClick={() => setShowNavlinks(false)}
>
Home
</Link>

<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/about-us"
onClick={() => setShowNavlinks(false)}
>
About Us
</Link>

<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
to="/resources"
onClick={() => setShowNavlinks(false)}
>
Resources
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/community"
onClick={() => setShowNavlinks(false)}
>
Community
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"

{/* <Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/products"
onClick={() => setShowNavlinks(false)}
>
Products
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/blogs"
onClick={() => setShowNavlinks(false)}
>
Blog
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/resources"
onClick={() => setShowNavlinks(false)}
>
Resources
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/shop"
onClick={() => setShowNavlinks(false)}
>
Shop
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/donate"
onClick={() => setShowNavlinks(false)}
>
Donate
</Link>
</Link> */}
</nav>

{/* navlinks */}
<nav className="md:flex hidden items-center gap-5 text-base">
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline focus:text-[#009975] focus:underline transition-all duration-300 cursor-pointer"
to="/"
>
Home
</Link>

<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/about-us"
>
About Us
</Link>

<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
to="/resources"
>
Resources
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/community"
>
Community
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"

{/* <Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/products"
>
Products
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/blogs"
>
Blog
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/resources"
>
Resources
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/shop"
>
Shop
</Link>
<Link
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer"
className="text-gray-900 hover:text-[#009975] hover:underline transition-all duration-300 cursor-pointer focus:text-[#009975] focus:underline"
to="/donate"
>
Donate
</Link>
</Link> */}
</nav>
</header>
);
Expand Down
Loading

1 comment on commit 7be3ec6

@vercel
Copy link

@vercel vercel bot commented on 7be3ec6 Nov 3, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

syt-web-redesign – ./

syt-web-redesign.vercel.app
syt-web-redesign-git-main-sytweb.vercel.app
syt-web-redesign-sytweb.vercel.app

Please sign in to comment.