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

login button, navi, news letter in the footer, navigation background,… #399

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

login button, navi, news letter in the footer, navigation background,… #399

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
7 changes: 3 additions & 4 deletions frontend/src/App.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ function App() {
<Routes>
<Route path="/" element={<HomePage />} />
<Route path="/alldoctors" element={<AllDoctorsPage />} />
{/* <Route path="/appointment" element={<Appointment />} /> */}
{<Route path="/appointment" element={<Appointment />} /> }

<Route path="/specialities" element={<SpecialitiesPage />} />

Expand All @@ -52,14 +52,13 @@ function App() {

<Route path="/login" element={<LoginPage />} />
<Route path="/signup" element={<SignupPage />} />
<Route path="/termsandconditions" element={<TermsAndConditionsPage />} />

<Route path="/*" element={<ErrorPage />} />
<Route path="/faqs" element={<FaqsPage />} />
<Route path="/aboutus" element={<AboutUsPage />} />
<Route path="/privacypolicy" element={<PrivacyPolicyPage />} />
<Route
path="/termsandconditions"
element={<TermsAndConditionsPage />}
<Route path="/termsandconditions" element={<TermsAndConditionsPage />}
/>
</Routes>
<Bot />
Expand Down
182 changes: 58 additions & 124 deletions frontend/src/components/Footer.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,173 +1,107 @@
import React from "react";
import React, { useState } from "react";
import { axios } from "../import-export/ImportExport";
import { NavLink } from "react-router-dom";
import { useState } from "react";

import { toast } from "react-toastify";
// icons
import { FaInstagram } from "react-icons/fa";
import { FaLinkedin } from "react-icons/fa";
import { FaInstagram, FaLinkedin } from "react-icons/fa";
import { FaXTwitter } from "react-icons/fa6";

function Footer() {
const navLinks = [
{
path: "/",
display: "Home",
},
{
path: "/aboutus",
display: "About Us",
},
{
path: "/privacypolicy",
display: "Privacy Policy",
},
{
path: "/termsandconditions",
display: "Terms and Conditions",
},
{ path: "/", display: "Home" },
{ path: "/aboutus", display: "About Us" },
{ path: "/privacypolicy", display: "Privacy Policy" },
{ path: "/termsandconditions", display: "Terms and Conditions" },
];

const [email, setEmail] = useState("");
const [message, setMessage] = useState("");
const [newsletterEmail, setNewsletterEmail] = useState("");

const handleMessage = async (e) => {
const handleNewsletterSubscription = async (e) => {
e.preventDefault();
// Dummy validation check
if (!newsletterEmail.includes("@")) {
toast.error("Please enter a valid email address.");
return;
}
try {
await axios
.post(
"/message/send",
{ email, message },
{
withCredentials: true,
headers: { "Content-Type": "application/json" },
}
)
.then((res) => {
toast.success(res.data.message);
setEmail("");
setMessage("");
});
await axios.post("/newsletter/subscribe", { email: newsletterEmail });
toast.success("Subscribed successfully!");
setNewsletterEmail("");
} catch (error) {
toast.error(error.response.data.message);
toast.error("Failed to subscribe. Please try again.");
}
};

return (
<div className="bg-light_theme w-full text-center">
<div className="bg-light_theme w-full text-center">
<div className="max-w-screen-2xl mx-auto flex flex-col items-center justify-center px-3 space-y-9 pt-8">
{/* footer top */}
<div className="w-full grid grid-cols-1 md:grid-cols-12 gap-6">
{/* Title */}
<div className="cols-span-1 md:col-span-4 text-left">
<h1 className="text-lg lg:text-xl font-bold text-black/80 mb-6">
MediHub
</h1>
{/* desc */}
<p className="text-md lg:text-lg text-black/70 font-medium">
MediHub is a web-based platform facilitating seamless management
of healthcare services, including appointments, patient records,
and doctor interactions.
<h1 className="text-lg lg:text-xl font-bold text-black/80 mb-6">MediHub</h1>
<p className="text-md lg:text-lg text-black/70 font-medium">
MediHub is a web-based platform facilitating seamless management of healthcare services.
</p>
{/* icons */}
<div className="flex items-center gap-4 mt-10">
<div className=" border border-white/70 rounded-full px-2 py-2 hover:bg-slate-700/30 cursor-pointer">
<a
href="https://www.linkedin.com/in/itsmohit097/"
target="_blank"
>
<FaInstagram />
</a>
</div>
<div className=" border border-white/70 rounded-full px-2 py-2 hover:bg-slate-700/30 cursor-pointer">
<a
href="https://www.linkedin.com/in/itsmohit097/"
target="_blank"
>
<FaLinkedin />
</a>
</div>
<div className=" border border-white/70 rounded-full px-2 py-2 hover:hover:bg-slate-700/30 cursor-pointer">
<a
href="https://www.linkedin.com/in/itsmohit097/"
target="_blank"
>
<FaXTwitter />
</a>
</div>
<a href="https://www.instagram.com" target="_blank" className="border border-white/70 rounded-full px-2 py-2 hover:bg-slate-700/30 cursor-pointer">
<FaInstagram />
</a>
<a href="https://www.linkedin.com" target="_blank" className="border border-white/70 rounded-full px-2 py-2 hover:bg-slate-700/30 cursor-pointer">
<FaLinkedin />
</a>
<a href="https://www.twitter.com" target="_blank" className="border border-white/70 rounded-full px-2 py-2 hover:bg-slate-700/30 cursor-pointer">
<FaXTwitter />
</a>
</div>
</div>

{/* Quick links */}
<div className="cols-span-1 md:col-span-3">
<h1 className="text-lg text-left md:text-center lg:text-xl font-semibold mb-6">
Quick Links
</h1>
<ul className="flex flex-col justify-between gap-3 md:items-center text-md font-semibold md:gap-y-4 text-left">
<h1 className="text-lg text-left md:text-center lg:text-xl font-semibold mb-6">Quick Links</h1>
<ul className="flex flex-col justify-between gap-3 md:items-center text-md font-semibold md:gap-y-4 text-left">
{navLinks.map((link, index) => (
<li key={index}>
<NavLink
to={link.path}
className="text-black/70 text-md relative cursor-pointer before:block before:absolute before:bottom-[-4px] before:left-0 before:w-0 before:h-0.5 before:rounded-full before:bg-main_theme before:transition-all before:delay-150 before:ease-in-out hover:before:w-full hover:text-black"
className="text-black/70 text-md relative cursor-pointer hover:before:w-full hover:text-black"
>
{link.display}
</NavLink>
</li>
))}
</ul>
</div>
{/* Contact US */}
{/* <form
onSubmit={handleMessage}
className="cols-span-1 md:col-span-5 grid gap-y-5"
>
<h1 className="text-left text-xl font-bold text-black/80">
Contact Us
</h1>
<div className="relative flex justify-left space-y-7">
<label
htmlFor="email"
className="text-md font-normal absolute top-0 left-0"
>
Email
</label>
<input
type="text"
placeholder="Enter you email address"
value={email}
onChange={(e) => setEmail(e.target.value)}
className="px-3 py-3 rounded-md grow"
/>
</div>
<div className="relative flex justify-left space-y-7">
<label
htmlFor="message"
className="text-md font-normal absolute top-0 left-0"
>
Message
</label>
<textarea
rows={7}
placeholder="Write Your Message Here"
value={message}
onChange={(e) => setMessage(e.target.value)}
className="px-3 py-3 rounded-md grow"
/>
</div>
<button
type="submit"
className="grow bg-main_theme text-white py-3 rounded-md"
>
Send Message
</button>
</form> */}

{/* Newsletter Section */}
<div className="cols-span-1 md:col-span-5">
<h1 className="text-left text-xl font-bold text-black/80">Subscribe to our Newsletter</h1>
<form onSubmit={handleNewsletterSubscription} className="grid gap-y-5">
<div className="relative flex flex-col justify-left space-y-3">
<label htmlFor="newsletter-email" className="text-md font-normal">
Email Address
</label>
<input
type="email"
id="newsletter-email"
placeholder="Enter your email"
value={newsletterEmail}
onChange={(e) => setNewsletterEmail(e.target.value)}
className="px-3 py-3 rounded-md grow"
/>
</div>
<button type="submit" className="grow bg-main_theme text-white py-3 rounded-md">
Subscribe
</button>
</form>
</div>
</div>

{/* footer bottom */}
<div className="w-full py-4">
{/* copyright */}
<p className="text-sm lg:text-[1rem] font-medium text-center">
© {new Date().getFullYear()} Mohit kumar. All rights reserved.
© {new Date().getFullYear()} Your Company. All rights reserved.
</p>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/components/Navbar.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -88,7 +88,7 @@ function Navbar() {
];

return (
<div className="w-full h-[8vh] sticky top-0 z-50">
<div className="w-full h-[8vh] sticky top-0 z-50 bg-[#333]">
<div className="max-w-7xl mx-auto flex items-center justify-between px-3 md:px-4 h-full">
{/* logo */}
<NavLink to="/">
Expand Down
2 changes: 2 additions & 0 deletions frontend/src/pages/login_signup_page/SignupPage.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ function SignupPage() {
password: "",
cpassword: "",
});
const[showDropdown, setShowDrowdown] = useState(true);

const handleInputChange = (e) => {
const { name, value } = e.target;
Expand All @@ -29,6 +30,7 @@ function SignupPage() {
}));
};


const handleSignup = async (e) => {
e.preventDefault();
const { password, cpassword, ...data } = formData;
Expand Down
93 changes: 91 additions & 2 deletions frontend/src/pages/terms_&_conditions_page/TermsAndConditionsPage.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,96 @@
import React from "react";
import { BrowserRouter as Router, Route, Switch, Link } from "react-router-dom";

// Home Page Component
function HomePage() {
return (
<div>
<h1>Welcome to Our Website</h1>
<p>This is the home page. Please explore the content or visit our Terms and Conditions page for more details.</p>
</div>
);
}

// Terms and Conditions Page Component
function TermsAndConditionsPage() {
return <div>Terms and Conditions</div>;
return (
<div style={{ padding: "20px" }}>
<h1>Terms and Conditions</h1>
<p>Welcome to our website. These terms and conditions outline the rules and regulations for the use of our website.</p>

<h2>1. Acceptance of Terms</h2>
<p>
By accessing this website, we assume you accept these terms and conditions. Do not continue to use the website if you do not agree to all the terms and conditions stated on this page.
</p>

<h2>2. Cookies</h2>
<p>
We employ the use of cookies. By using this website, you consent to the use of cookies in accordance with our privacy policy.
</p>

<h2>3. License</h2>
<p>
Unless otherwise stated, we own the intellectual property rights for all material on the website. All intellectual property rights are reserved.
</p>

<h2>4. User Obligations</h2>
<ul>
<li>Do not republish material from the website without proper credit.</li>
<li>Do not sell, rent, or sub-license material from the website.</li>
<li>Do not reproduce, duplicate or copy material from the website.</li>
</ul>

<h2>5. Limitation of Liability</h2>
<p>
We shall not be held responsible for any loss, damage, or injury caused by using our website, as far as applicable law permits.
</p>

<h2>6. Changes to Terms</h2>
<p>
We reserve the right to modify these terms and conditions at any time. Users will be notified of changes and updates as they occur.
</p>

<p>If you have any questions or concerns about these Terms, please contact us.</p>
</div>
);
}

// Footer Component with Link to Terms & Conditions
function Footer() {
const [email, setEmail] = useState("");
const [message, setMessage] = useState("");

const handleSubscribe = () => {
const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; // Simple email validation
if (emailPattern.test(email)) {
// Simulate a successful subscription
setMessage("Successfully subscribed to the newsletter!");
setEmail(""); // Clear the input field
} else {
setMessage("Please enter a valid email address.");
}
};

return (
<footer className="footer">
{/* Other existing footer content */}
<div className="newsletter-section">
<h2>Subscribe to Our Newsletter</h2>
<input
type="email"
value={email}
onChange={(e) => setEmail(e.target.value)}
placeholder="Enter your email"
required
className="email-input"
/>
<button onClick={handleSubscribe} className="subscribe-button">
Subscribe
</button>
{message && <p className="message">{message}</p>}
</div>
</footer>
);
}

export default TermsAndConditionsPage;
export default Footer;