add hours to contact page

vwolfley · Apr 3, 2024 · f4843a3 · f4843a3
1 parent 8b550eb
commit f4843a3
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 9 deletions.
diff --git a/scoots/contact.html b/scoots/contact.html
@@ -91,13 +91,18 @@ <h2>Contact Us</h2>
                         </div>
                     </div>
                 </div>
-                <h3>We’d Love To Hear From You!</h3>
+                <h2>We’d Love To Hear From You!</h2>
                 <div class="contact-body">
                     <div class="contact-info">
                         <div class="address-block">
-                            <h4>Visit us at both locations</h4>
+                            <h3>Visit us at both locations</h3>
+                            <div class="hours card">
+                                <h5>HOURS OF OPERATION:</h5>
+                                <p>MONDAY-SATURDAY 8AM-5PM</p>
+                                <p>SUNDAY – BY APPOINTMENT</p>
+                            </div>
                             <div class="address">
-                                <address>
+                                <address class="">
                                     <h4>Scoots @ Playa del Carmen-Cozumel</h4>
                                     <div>
                                         <span class="label" aria-hidden="true">
@@ -118,9 +123,6 @@ <h4>Scoots @ Playa del Carmen-Cozumel</h4>
                                 </address>
                                 <iframe
                                     src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d5589.892018422959!2d-86.95356976523163!3d20.51161250714187!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x8f4e59cceda3d799%3A0xbf8ea7e97451cfd8!2sCentro%2C%20San%20Miguel%20de%20Cozumel%2C%20Quintana%20Roo%2C%20Mexico!5e0!3m2!1sen!2sus!4v1711467670660!5m2!1sen!2sus"
-                                    width="600"
-                                    height="300"
-                                    style="border: 0"
                                     allowfullscreen=""
                                     loading="lazy"
                                     referrerpolicy="no-referrer-when-downgrade"
@@ -142,9 +144,6 @@ <h4>Scoots @ Puerta Maya</h4>
                                 </address>
                                 <iframe
                                     src="https://www.google.com/maps/embed?pb=!1m14!1m12!1m3!1d2079.9062928522703!2d-86.975759600473!3d20.475710187666206!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sen!2sus!4v1711467876877!5m2!1sen!2sus"
-                                    width="600"
-                                    height="300"
-                                    style="border: 0"
                                     allowfullscreen=""
                                     loading="lazy"
                                     referrerpolicy="no-referrer-when-downgrade"

diff --git a/scoots/styles/main.css b/scoots/styles/main.css
@@ -789,6 +789,9 @@ h5 {
     gap: 20px;
     order: 1;
 }
+.contact-info h3{
+    text-align: center;
+}
 .contact-form,
 .reservations-form {
     display: flex;
@@ -808,6 +811,27 @@ h5 {
 .reservations-area p {
     text-align: center;
 }
+.hours {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    text-align: center;
+    margin: 25px auto;
+}
+.hours h5 {
+    font-size: 1em;
+    font-weight: 600;
+    margin: 5px 0;
+}
+.hours p {
+    font-size: 0.9em;
+    margin: 5px 0;
+}
+iframe {
+    width: 600px;
+    height: 300px;
+    border: none;
+}
 
 fieldset {
     margin: 1rem 0;
@@ -890,6 +914,7 @@ fieldset label.top textarea:required:valid {
     fill: currentColor;
 }
 
+
 /* Attributions */
 .attributions {
     display: flex;