diff --git a/Css-Files/helpline.css b/Css-Files/helpline.css new file mode 100644 index 00000000..a6ee44aa --- /dev/null +++ b/Css-Files/helpline.css @@ -0,0 +1,170 @@ +/* Helpline Container Styles */ +.helpline-container { + background-color: #022a2d; + padding: 20px; + box-shadow: 0 0 20px rgba(0, 0, 0, 0.3); + transition: all 0.3s ease-in-out; +} + +.helpline-container:hover { + transform: scale(1.02); + box-shadow: 0 0 30px rgba(0, 0, 0, 0.5); +} + +.container { + display: flex; + flex-direction: column; + align-items: center; +} + +.helpline-text { + color: #3fbcc0; + font-size: 40px; + font-weight: bold; + animation: slideInLeft 0.5s ease-in-out; +} + +.helpline-content-wrapper { + display: flex; + flex-direction: column; + justify-content: space-between; + width: 100%; + margin-top: 20px; + box-shadow: 0 0 20px rgba(63, 188, 192, 0.3); + border-radius: 10px; +} + +.emergency-form-container, +.contact-details-container { + animation: fadeIn 0.5s ease-in-out; + padding: 20px; +} + +.helpline-form { + display: flex; + align-items: center; +} + +.helpline-form input { + margin-right: 10px; + padding: 5px 10px; + border: none; + border-radius: 5px; + background-color: #3fbcc051; + color: #959DA5; +} + +.helpline-form button { + background-color: #2F81CF; + color: #fff; + padding: 5px 10px; + border: none; + border-radius: 5px; + cursor: pointer; + transition: background-color 0.3s ease-in-out; +} + +.helpline-form button:hover { + background-color: #1e6bba; +} + +.contact-details-container { + animation: fadeIn 0.5s ease-in-out 0.3s forwards; + opacity: 0; +} + +.helpline-contacts { + display: flex; + flex-direction: column; + align-items: flex-start; + color: rgba(0, 0, 0, 0.3); +} + +.contact-item { + display: flex; + align-items: center; + margin-bottom: 10px; +} + +.helpline-link { + color: #2F81CF; + font-size: 18px; + text-decoration: none; + transition: color 0.3s ease-in-out; +} + +.helpline-link:hover { + color: #3fbcc051; +} + +.helpline-link i { + margin-right: 5px; +} + +/* Popup Styles */ +.popup-container { + margin-top: 100px; + margin-bottom: 100px; + display: none; + justify-content: center; + align-items: center; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgba(0, 0, 0, 0.5); + z-index: 999; +} + +.popup { + background-color: #fff; + padding: 30px; + border-radius: 10px; + box-shadow: 0 0 20px rgba(0, 0, 0, 0.3); +} + +.popup h3 { + color: #3fbcc0; + margin-bottom: 20px; +} + +.popup p { + font-size: 18px; + color: #022a2d; + margin-bottom: 20px; +} + +.close-button { + background-color: #2F81CF; + color: #fff; + padding: 10px 20px; + border: none; + border-radius: 5px; + cursor: pointer; + transition: background-color 0.3s ease-in-out; +} + +.close-button:hover { + background-color: #1e6bba; +} +@keyframes fadeIn { + 0% { + opacity: 0; + } + 100% { + opacity: 1; + } +} + +@keyframes slideInLeft { + 0% { + transform: translateX(-50px); + opacity: 0; + } + 100% { + transform: translateX(0); + opacity: 1; + } +} + diff --git a/Html-Files/Doctor Experience.html b/Html-Files/Doctor Experience.html index 84b48b17..ce08847a 100644 --- a/Html-Files/Doctor Experience.html +++ b/Html-Files/Doctor Experience.html @@ -186,7 +186,7 @@

Explore


  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/Html-Files/appointment.html b/Html-Files/appointment.html index 77acf83b..3c003886 100644 --- a/Html-Files/appointment.html +++ b/Html-Files/appointment.html @@ -1108,7 +1108,7 @@

    Explore

  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/Html-Files/blood.html b/Html-Files/blood.html index c2289762..53e2acad 100644 --- a/Html-Files/blood.html +++ b/Html-Files/blood.html @@ -141,7 +141,7 @@

    Explore


  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/Html-Files/bloodtest.html b/Html-Files/bloodtest.html index dfcefa53..58cc7f38 100644 --- a/Html-Files/bloodtest.html +++ b/Html-Files/bloodtest.html @@ -1,4 +1,5 @@ - + + @@ -129,7 +130,7 @@

    Explore


  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/Html-Files/cardio.html b/Html-Files/cardio.html index 480a4c6f..42aa6ade 100644 --- a/Html-Files/cardio.html +++ b/Html-Files/cardio.html @@ -788,7 +788,7 @@

    Explore


  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/Html-Files/news.html b/Html-Files/news.html index f6f69874..ccac2d8e 100644 --- a/Html-Files/news.html +++ b/Html-Files/news.html @@ -265,7 +265,7 @@

    Explore


  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/dex.html b/dex.html index 4d3a6424..884d20f7 100644 --- a/dex.html +++ b/dex.html @@ -534,7 +534,7 @@

    Explore


  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/faq.html b/faq.html index 096fd3fa..76fcea8f 100644 --- a/faq.html +++ b/faq.html @@ -1346,7 +1346,7 @@

    Explore


  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/helpline.html b/helpline.html new file mode 100644 index 00000000..1f98867b --- /dev/null +++ b/helpline.html @@ -0,0 +1,318 @@ + + + + + + RapiDoc + + + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    +
    + +

    + Need help? Contact our Helpline +

    + +
    + + +
    +
    +
    +
    Need help? Contact our Helpline
    +
    +
    +

    Emergency Form

    +
    + + +
    +
    +
    +

    Contact Details

    + +
    +
    +
    +
    + + + + + + + diff --git a/index.css b/index.css index b0021b54..3a29b65a 100644 --- a/index.css +++ b/index.css @@ -225,6 +225,7 @@ option { @media (max-width: 768px) { .nav_menu { flex-direction: column; + margin-left: 0; } .hamburger { @@ -240,7 +241,7 @@ option { flex-direction: column; position: fixed; top: 60px; - left: 20px; + left: 0px; background-color: #022a2d; width: 45% !important; margin-top: 30px; @@ -256,6 +257,7 @@ option { .nav_link li { margin: 10px 0; font-size: 18px; + } .nav_link a { diff --git a/index.html b/index.html index c0ff4ff4..3ec87076 100644 --- a/index.html +++ b/index.html @@ -86,7 +86,7 @@
  • About
  • News
  • Service
  • -
  • Patient Portal
  • +
  • Patient Portal
  • Appointment
  • Doctor
  • Contact us
  • @@ -341,50 +341,7 @@

    Health Post

    - - -
    -
    -
    -

    Patient Portal

    -

    Access your medical records, lab results, and prescription history securely.

    -
    -
    - - - - -
    -
    -
    - +
    @@ -695,7 +652,7 @@

    Explore


  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/js/helpline.js b/js/helpline.js new file mode 100644 index 00000000..23f81f35 --- /dev/null +++ b/js/helpline.js @@ -0,0 +1,34 @@ +window.addEventListener('DOMContentLoaded', function() { + const helplineContainer = document.querySelector('.helpline-container'); + helplineContainer.style.opacity = '0'; + helplineContainer.style.animation = 'fadeIn 0.5s ease-in-out forwards'; + + const contactDetailsContainer = document.querySelector('.contact-details-container'); + contactDetailsContainer.style.opacity = '0'; + setTimeout(function() { + contactDetailsContainer.style.animation = 'fadeIn 0.5s ease-in-out forwards'; + }, 300); +}); + +const emergencyButton = document.querySelector('.emergency-button'); +const popupContainer = document.querySelector('.popup-container'); +const closeButton = document.querySelector('.close-button'); +const nameInput = document.querySelector('#nameInput'); +const nameDisplay = document.querySelector('#nameDisplay'); + +emergencyButton.addEventListener('click', (event) => { + event.preventDefault(); + const name = nameInput.value.trim(); + + if (name) { + popupContainer.style.visibility = 'visible'; + + nameDisplay.textContent = `Emergency request from ${name}`; + } else { + alert('Please enter your name.'); + } +}); + +closeButton.addEventListener('click', () => { + popupContainer.style.visibility = 'hidden'; +}); \ No newline at end of file diff --git a/medicine.html b/medicine.html index ec66f844..1b6035b7 100644 --- a/medicine.html +++ b/medicine.html @@ -381,7 +381,7 @@

    Explore


  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/news.html b/news.html index ed5025ab..a169a7c3 100644 --- a/news.html +++ b/news.html @@ -120,17 +120,22 @@ .header_container { flex-direction: column; align-items: start; - height: 24.8rem; - transition: 0.55s all ease-out; + /* background-color: transparent !important; */ /* padding-top: 5px; */ } .nav_link { - display: flex; - flex-direction: column; - position: relative; - bottom: 40px; - left: 10px; + display: none; + flex-direction: column; + position: fixed; + top: 64px; + left: 0px; + background-color: #022a2d; + width: 45% !important; + margin-top: 30px; + padding: 20px; + z-index: 10; + box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2); } /* .nav-link li{ margin-bottom: 5px; diff --git a/portal.html b/portal.html index aee89b5d..83d01818 100644 --- a/portal.html +++ b/portal.html @@ -429,7 +429,7 @@

    Explore


  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location
  • diff --git a/test.html b/test.html index f25b536f..3047f28a 100644 --- a/test.html +++ b/test.html @@ -494,7 +494,7 @@

    Explore

  • Appointment
  • Patient Portal
  • Login account
  • -
  • Helplines
  • +
  • Helplines
  • Location