Medicare

A modern, responsive hospital and healthcare website built using HTML, CSS, SCSS, and JavaScript.
Live Site: webmedicare.netlify.app

---

Overview

Medicare is a comprehensive hospital website designed to provide information about treatments, doctors, testimonials, and contact details. It offers a user-friendly experience with a clean design and interactive features. The site is ideal for hospitals, clinics, and medical professionals looking to establish an online presence.

---

Features

• Landing/Home Page: Presents the hospital's name, branding, and a welcoming hero section with background images and animated effects.
• Navigation: Intuitive navbar with links to Home, Treatment, Doctors, Testimonials, Contact Us, and About pages.
• Treatment Section: Details various medical specialties (Nephrology, Eye Care, Pediatric Clinic, Parental Care), each with images and descriptions.
• Doctors Page: Profiles of medical professionals, including contact information and social media links.
• Testimonials: Carousel of patient reviews to build trust and credibility.
• Contact Page: Contact form for inquiries, location information, and social media integration.
• About Page: Overview of the hospital, its mission, and services.
• OTP Verification: Custom-styled OTP input form (main otp.html) for secure access or appointment booking.
• Live Chat: Integrated Tawk.to chat widget for real-time support.
• Footer: Consistent footer across all pages displaying copyright.

---

Technologies Used

• HTML5: Structure of all web pages.
• CSS3 & SCSS: Custom styles, responsive layouts, and third-party libraries (Bootstrap, Font Awesome, OwlCarousel).
• JavaScript/jQuery: Interactive elements, carousels, date pickers, and form validations.
• Bootstrap: Grid system and components for responsive design.
• External Libraries:
  • OwlCarousel for testimonials.
  • Tawk.to for live chat support.
  • ResponsiveVoice for potential voice features.
  • Nice Select for styled selects.

---

Code Structure

• index.html: Main landing page.
• about.html: Hospital details and mission.
• doctor.html / doctor2.html: Doctor profiles and information.
• treatment.html: Medical specialties and treatments.
• testimonial.html: Patient testimonials carousel.
• contact.html: Contact form and information.
• home.html: Alternate landing page with branding and visuals.
• main otp.html: OTP verification form.
• css/: Stylesheets (Bootstrap, Font Awesome, OwlCarousel, custom styles).
• js/: JavaScript files for interactions and plugins.
• images/: Visual assets and icons.

---

Live Site Analysis

Visit webmedicare.netlify.app to see:

• Professional look and feel, tailored for healthcare.
• Fully functional navigation and content sections.
• Responsive design for mobile and desktop.
• Real-time chat for patient engagement.
• Visually appealing doctor and treatment listings.
• Patient testimonials for social proof.
• OTP functionality for added security (appointments/registration).

---

How to Use / Deploy

1. Clone the Repo:

   git clone https://github.com/Adarshpan-02/Medicare.git

2. Open index.html:

   • Use any web browser to preview locally.

3. Customize:

   • Update content in HTML files for your hospital/clinic.
   • Replace images in the images/ folder.
   • Modify styles in css/style3.css and other CSS files.

4. Host Online:

   • Deploy to Netlify, GitHub Pages, or any static hosting provider.

---

Credits

• Developed by Adarshpan-02
• UI inspired by Creative Tim's Paper Kit 2 and select open-source libraries.

---

License

This project is MIT licensed.