From c3511e6de5c3329257b73ff7c26396df9c8d6e71 Mon Sep 17 00:00:00 2001
From: Anjaliavv51 <154777864+Anjaliavv51@users.noreply.github.com>
Date: Thu, 13 Jun 2024 14:53:53 +0530
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9E[Bug]:=20Favicon=20and=20Color's?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

issue #538
---
 Html-Files/Css-Files/styles.css |   4 +-
 Html-Files/news.html            |   1 +
 assets/css/styles.css           |   4 +-
 dex.html                        |   2 +-
 index.html                      | 248 ++++++++------------------------
 style.css                       |  99 +++++++------
 6 files changed, 122 insertions(+), 236 deletions(-)

diff --git a/Html-Files/Css-Files/styles.css b/Html-Files/Css-Files/styles.css
index 284a682a..06d3fca9 100644
--- a/Html-Files/Css-Files/styles.css
+++ b/Html-Files/Css-Files/styles.css
@@ -23,7 +23,7 @@ section::before {
     left: 0;
     width: 50%;
     height: 100%;
-    background: #fff38e;
+    background: #4bb6b7;
 }
 
 .nav_link {
@@ -267,7 +267,7 @@ section::before {
         justify-content: center;
         align-items: center;
         min-height: 100vh;
-        background: #fff38e;
+        background: #4bb6b7;
     }
 
     section::before {
diff --git a/Html-Files/news.html b/Html-Files/news.html
index c02d86aa..fc3bba7f 100644
--- a/Html-Files/news.html
+++ b/Html-Files/news.html
@@ -6,6 +6,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <title>News RapiDoc</title>
   <!-- favicon -->
+  <link rel="icon" type="image/x-icon" href="../favicon.png">
   <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet"
     integrity="sha384-0evHe/X+R7YkIZDRvuzKMRqM+OrBnVFBL6DOitfPri4tjfHxaWutUpFmBp4vmVor" crossorigin="anonymous" />
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css">
diff --git a/assets/css/styles.css b/assets/css/styles.css
index a74ef220..9d20d3e5 100644
--- a/assets/css/styles.css
+++ b/assets/css/styles.css
@@ -6,9 +6,9 @@
   /*========== Colors ==========*/
   --hue: 45;
   --sat: 98%;
-  --first-color: hsl(var(--hue), var(--sat), 60%);
+  --first-color: #4bb6b7;
   --first-color-light: hsl(var(--hue), var(--sat), 85%);
-  --first-color-lighten: hsl(var(--hue), var(--sat), 80%);
+  --first-color-lighten: #4bb6b7;
   --first-color-alt: hsl(var(--hue), var(--sat), 53%);
   --title-color: hsl(var(--hue), 4%, 15%);
   --text-color: hsl(var(--hue), 4%, 35%);
diff --git a/dex.html b/dex.html
index 7efc5fdc..9adf03a6 100644
--- a/dex.html
+++ b/dex.html
@@ -6,7 +6,7 @@
 
         <!--=============== BOXICONS ===============-->
         <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/boxicons@latest/css/boxicons.min.css">
-
+        <link rel="icon" type="image/x-icon" href="./favicon.png">
         <!--=============== CSS ===============-->
         <link rel="stylesheet" href="assets/css/styles.css">
 
diff --git a/index.html b/index.html
index 45029050..b5f8dd38 100644
--- a/index.html
+++ b/index.html
@@ -186,12 +186,7 @@
 .avatar{
   margin: 20px 100px;
 }
-.avatar img{
-  margin: 0px 450px;
-}
-form{
-  margin: 10px 210px;
-}
+
 .textbox input{
   width:200px;
   height: 40px;
@@ -207,7 +202,7 @@
   margin-bottom: 20px;
 }
 #appointment.appointment.section-bg{
-  margin: 0px 200px;;
+  margin: 0px 280px 100px;
 }
 #appointment.appointment.section-bg h2{
   margin: 0px 115px ;
@@ -223,6 +218,48 @@
 .loader--hidden{
   opacity: 0;
   visibility: hidden;
+}
+    </style>
+    <style>
+/*Appointment section Styling's to align it to center*/
+     .appointment .container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.appointment form {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 100%;
+  max-width: 600px;
+}
+
+.appointment .form-group {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+}
+
+.appointment input,
+.appointment select,
+.appointment button {
+  width: 100%;
+  max-width: 400px;
+}
+
+.appointment .text-center {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+}
+
+.appointment button[type="submit"] {
+  width: auto;
+  padding: 10px 20px;
+  display: block;
+  margin: 0 auto;
 }
     </style>
     <link rel="stylesheet" href="chatbox.css">
@@ -541,56 +578,6 @@ <h4><a href="https://www.medicalnewstoday.com/">Health Post</a></h4>
           </div>
         </div>
     </section><!-- End Services Section -->
-
-    <!-- Add Patient Portal Section -->
-
- <!-- <section id="patient-portal" class="patient-portal">
-      <div class="container-patientportal">
-      <div class="section-title" id="section-patientportal">
-
-        <h2>Patient Portal</h2>
-        <p>Access your medical records, lab results, and prescription history securely.</p>
-        <!-- <p>The Patient Portal is your personalized online gateway to your health information. Whether you need to check your recent lab results, review your prescription history, or update your personal details, the Patient Portal provides a convenient and secure platform for managing your healthcare needs.</p> 
-      </div>
-      <div class="container">
-
-
-
-      <!-- Add Login Form for Patient Portal 
-      
-          <div class="login-box">
-              <div class="avatar">
-                  <img src="img\avatar.png" alt="Avatar">
-              </div>
-              <form>
-                  <div class="textbox">
-                      <i class="fas fa-user"></i>
-                      <input type="text" placeholder="Username" name="username" required>
-                  </div>
-                  <div class="textbox">
-                      <i class="fas fa-lock"></i>
-                      <input type="password" placeholder="Password" name="password" required>
-                  </div>
-                  <input type="submit" class="btn" value="SUBMIT">
-                  <div class="register-link">
-                      <a href="#">Not registered yet? Register Here</a>
-                  </div>
-                  <div class="forgot-password" id="forgot-password-patient-portal">
-                    <a href="forgot-password.php">Forgot Your Password?</a>
-                  </div>
-              </form>
-          </div>-->
-
-
-      <!-- Add Forgot Password Link -->
-
-
-      <!-- Add Login Form for Patient Portal -->
-
-
-
-
-
     <!-- Patient Portal Section -->
 <section id="patient-portal" class="patient-portal">
   <div class="container-patientportal">
@@ -607,20 +594,20 @@ <h2>Patient Portal</h2>
         </div>
         <form>
           <div class="textbox">
-            <i class="fas fa-user" style = "margin-left:325px"></i>
+            <i class="fas fa-user"></i>
             <input type="text" placeholder="Username" name="username" required>
           </div>
           <br>
           <div class="textbox">
-            <i class="fas fa-lock" style = "margin-left:325px"></i>
+            <i class="fas fa-lock"></i>
             <input type="password" placeholder="Password" name="password" required>
           </div>
           <br>
-          <input type="submit" class="btn" value="SUBMIT" style = "margin-left:325px">
-          <div class="register-link" style = "margin-left:325px">
+          <input type="submit" class="btn" value="SUBMIT">
+          <div class="register-link">
             <a href="#">Not registered yet? Register Here</a>
           </div>
-          <div class="forgot-password" id="forgot-password-patient-portal"style = "margin-left:325px">
+          <div class="forgot-password" id="forgot-password-patient-portal">
             <a href="forgot-password.php">Forgot Your Password?</a>
           </div>
         </form>
@@ -632,11 +619,10 @@ <h2>Patient Portal</h2>
 <!-- Appointment Section -->
 <section id="appointment" class="appointment section-bg">
    
-  <div class="container">
+  <div class="container" style="border-radius: 10px;">
     <div class="section-title">
       <h2>Make an Appointment</h2>
       <p>We listed the docs, we made you a form. You make us an appointment.</p>
-    
     <!--<div class="layout">-->
       <form action="successful_appointment.html" method="post" class="php-email-form">
         
@@ -657,35 +643,13 @@ <h2>Make an Appointment</h2>
               <!-- Add more locations as needed -->
             </select>
           </div>
-          <!--<div class="col-md-4 form-group mt-3 mt-md-0">
-            <input type="tel" class="form-control" name="phone" id="phone" placeholder="Your Phone" maxlength="10" minlength="10" pattern="[0-9]*" required>
-          </div>-->
-        <!--</div>-->
-        
-          <div class="col-md-4 form-group mt-3">
-            <input type="date" name="date" class="form-control datepicker" id="date" placeholder="Appointment Date" required>
-            <script>
-              // To set value of minimum date in calendar 
-              var currentDate = new Date();
-              var year = currentDate.getFullYear();
-              var month = (currentDate.getMonth() + 1).toString().padStart(2, '0');
-              var day = currentDate.getDate().toString().padStart(2, '0');
-              var formattedDate = `${year}-${month}-${day}`;
-
-              document.getElementById('date').setAttribute('min', formattedDate);
-            </script>
-          <!--</div>-->
-          
-          
-        </div>
-
         <!-- Time Slot Section -->
         
           <div class="col-md-12 form-group mt-3">
             <select name="time-slot" id="time-slot" class="form-select" required>
 
       <!-- ############# Appointment Section ############# -->
-<section id="appointment" class="appointment section-bg">
+ <section id="appointment" class="appointment section-bg">
   <div class="container">
     <div class="section-title">
       <h2>Make an Appointment</h2>
@@ -693,17 +657,6 @@ <h2>Make an Appointment</h2>
     </div>
     <div class="layout">
       <form action="" role="form" class="php-email-form">
-        <div class="row">
-          <div class="col-md-4 form-group">
-            <input type="text" name="name" class="form-control" id="name" placeholder="Your Name">
-          </div>
-          <div class="col-md-4 form-group mt-3 mt-md-0">
-            <input type="email" class="form-control" name="email" id="email" placeholder="Your Email">
-          </div>
-          <div class="col-md-4 form-group mt-3 mt-md-0">
-            <input type="tel" class="form-control" name="phone" id="phone" placeholder="Your Phone" maxlength="10" minlength="10" pattern="[0-9]*">
-          </div>
-        </div>
         <div class="row">
           <div class="col-md-4 form-group mt-3">
             <input type="date" name="date" class="form-control datepicker" id="date" placeholder="Appointment Date">
@@ -731,42 +684,28 @@ <h2>Make an Appointment</h2>
               <option value="Doctor 1">Mumbai</option>
               <option value="Doctor 2">Delhi</option>
               <option value="Doctor 3">Chennai</option>
-              <!-- Add more locations as needed -->
             </select>
           </div>
         </div>
-
         <!-- Time Slot Section -->
         <div class="row">
           <div class="col-md-12 form-group mt-3">
             <select name="time-slot" id="time-slot" class="form-select">
-
               <option value="">Select Time Slot</option>
-              <!-- Populate with available time slots -->
               <option value="9:00 AM">9:00 AM</option>
               <option value="11:00 AM">11:00 AM</option>
               <option value="2:00 PM">2:00 PM</option>
-              <!-- Add more time slots as needed -->
             </select>
           </div>
-
           <div class="col-md-12 form-group mt-3">
-
             <select name="hospital" id="hospital" class="form-select">
               <option value="">Select Hospital</option>
-                          <!-- Populate with available hospitals -->
                 <option value="Hospital 1">Hospital 1</option>
                 <option value="Hospital 2">Hospital 2</option>
                <option value="Hospital 3">Hospital 3</option>
-                          <!-- Add more hospitals as needed -->
             </select>
           </div>
-        
-        
-                   
-        
-                    <!-- OPD Section -->
-                    
+          <!-- OPD Section -->        
           <div class="col-md-12 form-group mt-3">
         
             <select name="opd-section" id="opd-section" class="form-select">
@@ -785,20 +724,7 @@ <h2>Make an Appointment</h2>
               <option value="55 above">55 above</option>
             </select>
           </div>
-
-          <div class="row">
-            <div class="col-md-12 form-group mt-3">
-              <select name="hospital" id="hospital" class="form-select">
-                <option value="">Select Hospital</option>
-                <!-- Populate with available hospitals -->
-                <option value="Hospital 1">Hospital 1</option>
-                <option value="Hospital 2">Hospital 2</option>
-                <option value="Hospital 3">Hospital 3</option>
-                <!-- Add more hospitals as needed -->
-              </select>
-            </div>
-          </div>
-  
+          
           <!-- OPD Section -->
           <div class="row">
             <div class="col-md-12 form-group mt-3">
@@ -811,12 +737,6 @@ <h2>Make an Appointment</h2>
               </select>
             </div>
           </div>
-        
-                    
-        
-          <!--<div class="form-group mt-3">
-            <textarea class="form-control" name="message" rows="5" placeholder="Message (Optional)"></textarea>
-          </div>-->
           <div class="text-center">
             <a href="successful_appointment.html" style="text-decoration: none;">
             <button type="submit">Make an Appointment</button>
@@ -829,63 +749,9 @@ <h2>Make an Appointment</h2>
         </div>
       </form>
     </div>
-  </div>
-  
-
-<!--<section id="hospital" class="hospital-section-bg">
-
-
-
-            <!-- Hospital Selection Section -->
-            
-  
-         
-</section><!-- End Appointment Section -->
-
-
-
-        </div>
-
-
-        <!-- Hospital Selection Section -->
-        <!-- <div class="row">
-          <div class="col-md-12 form-group mt-3">
-            <select name="hospital" id="hospital" class="form-select">
-              <option value="">Select Hospital</option> -->
-              <!-- Populate with available hospitals -->
-              <!-- <option value="Hospital 1">Hospital 1</option>
-              <option value="Hospital 2">Hospital 2</option>
-              <option value="Hospital 3">Hospital 3</option> -->
-              <!-- Add more hospitals as needed -->
-            <!-- </select>
-          </div>
-        </div> -->
-
-        <!-- OPD Section -->
-        <!-- <div class="row">
-          <div class="col-md-12 form-group mt-3">
-            <select name="opd-section" id="opd-section" class="form-select">
-              <option value="">Select OPD Section</option> -->
-              <!-- Populate with available OPD sections -->
-              <!-- <option value="ENT">ENT</option>
-              <option value="Gynecologist">Gynecologist</option> -->
-              <!-- Add more OPD sections as needed -->
-            <!-- </select>
-          </div>
-        </div> -->
-
-        <!-- <div class="form-group mt-3">
-          <textarea class="form-control" name="message" rows="5" placeholder="Message (Optional)"></textarea>
-        </div> -->
-        <!-- <div class="text-center">
-          <a href="successful_appointment.html" style="text-decoration: none;">
-            <button type="submit">Make an Appointment</button>
-          </a>
-        </div> -->
-      </form>
-    </div>
-  </div>
-</section><!-- End Appointment Section -->
+  </div>   
+ </section>
+<!-- End Appointment Section -->
 
 <!-- ################# Doctors Section ################# -->
 <section id="doctors" class="doctors">
@@ -1313,7 +1179,7 @@ <h4>RAPIDOC Newsletter</h4><br>
                     of news, updates, helpful tips, and
                     exclusive offers.
                   </p>
-                  <form action="#">
+                  <form action="#" class="subscribe-form">
                     <input type="text" placeholder="Your email" required>
                     <button type="submit">SUBSCRIBE</button>
                   </form>
diff --git a/style.css b/style.css
index a8df6978..0688ff3d 100644
--- a/style.css
+++ b/style.css
@@ -318,13 +318,11 @@ section {
 }
 
 .section-title {
-  /* text-align: left; */
   padding-left: 50px;
   padding-right: 50px;
   margin-left: 15%;
   margin-right: 15%;
   text-align: center;
-  /* text-align: left; */
 }
 
 .section-title h2 {
@@ -1046,7 +1044,7 @@ section {
   background: #badaf7;
   padding: 10px !important;
   color: #6c757d;
-  width: 80%;  /* Adjusted width for better layout */
+  width: 100%;  /* Adjusted width for better layout */
 
 }
 .col-md-4.form-group {
@@ -1121,18 +1119,12 @@ section {
   color: #fff;
   transition: 0.4s;
   border-radius: 50px;
-
 }
 
 .text-center button:hover {
   background-color: #4bb6b7;
 }
 
-
-
-
-
-
 /*################----Doctors----################*/
 
 .doctors {
@@ -1577,23 +1569,19 @@ section {
 
 .footer-col form {
   display: flex;
-  gap: 5px;
+  
 }
 
 .footer-col input {
-  height: 40px;
-  border-radius: 6px;
+  width: 300px; /* Adjust the value to set the desired width */
+  height: 40px; /* Adjust the value to set the desired height */
+  padding: 5px; /* Add some padding for better spacing */
+  font-size: 16px; 
   background: none;
-  width: 100%;
   outline: none;
   border: 1px solid #7489c6;
   caret-color: #fff;
   color: #fff;
-  padding-left: 10px;
-}
-
-.footer-col input::placeholder {
-  color: #ccc;
 }
 
 .footer-col form button {
@@ -1601,31 +1589,66 @@ section {
   border: none;
   color: #08434551;
   padding: 10px 15px;
-  border-radius: 6px;
+  border-radius: 6px 10px 10px 6px;
   cursor: pointer;
   font-weight: 1000;
   transition: 0.2s ease;
 }
 
 .footer-col form button:hover {
-  background: #cecccc;
+  background: #4bb6b7;;
 }
+
+
 /*
- .icons {
+.subscribe-form {
   display: flex;
-  margin-top: 30px;
-  gap: 30px;
-  cursor: pointer;
+  gap: 1rem;
+  flex-wrap: wrap;
+  flex-grow: 1;
 }
 
- .icons i {
-  color: #afb6c7;
+.subscribe-form > input {
+  border: 1px solid var(
+      --button-border);
+  color: var(--primary);
+  outline: none;
+  min-height: 1rem;
+  background-color: var(
+      --white);
+  font-size: 1.2rem;
+  flex-grow: 3;
+  padding: 0.5rem 0.75rem;
+  border-radius: 0.5rem;
 }
 
- .icons i:hover {
-  color: #fff;
+.subscribe-form > input:focus {
+  border: 1px solid var(
+      --primary);
 }
-*/
+
+.subscribe-form > 
+input::placeholder {
+  color: var(--text-heading-gray);
+}
+
+.subscribe-form > button {
+  cursor: pointer;
+  background-color: var(
+      --primary);
+  border-radius: 0.5rem;
+  color: var(--white);
+  font-size: 1.25rem;
+  min-height: 1rem;
+  flex-grow: 1;
+  white-space: nowrap;
+  padding: 0.5rem 0.75rem;
+  border: 0;
+  outline: none;
+  border: 1px solid var(
+      --button-border);
+}*/
+
 @media (max-width: 768px) {
   .footer {
     position: relative;
@@ -1789,17 +1812,16 @@ footer {
 }
 
 /* Style for pateint portal  */
-/* -----***************************************-----  */
 .patient-portal {
   width: 90%;
   max-width: 900px;
-  /* Maximum width of the container */
   margin: 0 auto;
-  /* Centers the container */
   padding: 20px;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
   background-color: #3fbcc051;
   text-align: center;
+  align-items: center;
+  align-content: center;
   margin-bottom: 7%;
   border-radius: 20px;
 }
@@ -1807,7 +1829,6 @@ footer {
 /* Section title styling */
 .section-title h1 {
   color: #29888a;
-  /* Sets a blue color for the heading */
   text-align: center;
 }
 
@@ -1821,7 +1842,7 @@ footer {
 .form-group {
   margin-top: 15px;
   margin-bottom: 15px;
-  /* Adds bottom margin for form-group */
+  align-content: center;
 }
 
 .forgot-password {
@@ -1833,15 +1854,12 @@ footer {
   /* Full width */
   padding: 10px;
   border: 1px solid #ccc;
-  /* Light gray border */
   border-radius: 4px;
-  /* Rounded corners */
-  /* text-align: center; */
+  text-align: center;
 }
 
 button {
   background-color: hwb(181 16% 46%);
-  /* Blue background for the button */
   color: white;
   border: none;
   padding: 10px 20px;
@@ -1884,7 +1902,7 @@ button {
   --button-border: #848D97;
 }
 
-.subscribe-btn {
+.subscribebtn {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -1902,8 +1920,9 @@ button {
   transition: all 0.2s ease-in-out;
 }
 
-.subscribe-btn:hover {
+.subscribebtn:hover {
   border: 3px solid var(--white);
+  background-color: var(--footer-bg);
 }
 
 /*? footer containers */