cse110-sp23-group20 · bsalvania · Jun 8, 2023 · Jun 8, 2023
diff --git a/source/Zodiac_compatibility/images/1.png b/source/Zodiac_compatibility/images/1.png
diff --git a/source/Zodiac_compatibility/images/2.png b/source/Zodiac_compatibility/images/2.png
diff --git a/source/Zodiac_compatibility/images/3.png b/source/Zodiac_compatibility/images/3.png
diff --git a/source/Zodiac_compatibility/images/arrow_left.png b/source/Zodiac_compatibility/images/arrow_left.png
diff --git a/source/Zodiac_compatibility/images/arrow_right.png b/source/Zodiac_compatibility/images/arrow_right.png
diff --git a/source/Zodiac_compatibility/images/hollow.png b/source/Zodiac_compatibility/images/hollow.png
diff --git a/source/Zodiac_compatibility/images/hollow_old.png b/source/Zodiac_compatibility/images/hollow_old.png
diff --git a/source/Zodiac_compatibility/images/hollow_old2.png b/source/Zodiac_compatibility/images/hollow_old2.png
diff --git a/source/Zodiac_compatibility/images/icon.png b/source/Zodiac_compatibility/images/icon.png
diff --git a/source/Zodiac_compatibility/images/pngwing.com.png b/source/Zodiac_compatibility/images/pngwing.com.png
diff --git a/source/Zodiac_compatibility/images/sc_wheel.png b/source/Zodiac_compatibility/images/sc_wheel.png
diff --git a/source/Zodiac_compatibility/images/zodiac_wheel.jpg b/source/Zodiac_compatibility/images/zodiac_wheel.jpg
diff --git a/source/Zodiac_compatibility/index.html b/source/Zodiac_compatibility/index.html
@@ -1,32 +1,29 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <title>Zodiac Compatibility Tool</title>
+    <title>Scrollable Wheel</title>
     <meta name="viewport" content="width=device-width, initial-scale=1" />
 
     <link rel="stylesheet" href="../common/styles.css" />
     <link rel="stylesheet" href="styles.css" />
     <link rel="preconnect" href="https://fonts.googleapis.com" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link
-      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;800&display=swap"
+      href="https://fonts.googleapis.com/css2?family=Oswald&display=swap"
       rel="stylesheet"
     />
     <script src="../common/index.js" type="module"></script>
-    <link rel="icon" href="images/icon.png" type="image/x-icon" />
   </head>
   <body>
-    <div id="title">
-      <h1>Welcome to the Zodiac Compatibility Tool</h1>
-    </div>
     <div class="container">
       <div class="relationship">
         <form>
-          <label for="relationship">Relationship Type:</label>
-          <select name="relationship" id="relationship_selector">
-            <option value="romantic">Romantic</option>
-            <option value="friendship">Friendship</option>
-            <option value="professional">Professional</option></select
+          <label for="relationship">What is your relationship with them?:</label
+          ><br />
+          <select name="relationship" id="relationship">
+            <option value="volvo">Romantic</option>
+            <option value="saab">Friendship</option>
+            <option value="mercedes">Professional</option></select
           ><br />
         </form>
       </div>
@@ -36,21 +33,14 @@ <h1>Welcome to the Zodiac Compatibility Tool</h1>
             src="images/hollow.png"
             class="wheel_img"
             id="left_wheel_img"
-            alt="left_zodiac_wheel"
+            alt="idk"
           />
         </div>
       </div>
       <div class="bday_input" id="left_bday_input">
         <form>
-          <label for="left_birthday" id="birthday_label"
-            >YOUR DATE OF BIRTH:</label
-          ><br />
-          <input
-            type="text"
-            id="left_birthday"
-            name="left_birthday"
-            value="Dec 22 - Jan 19"
-          /><br />
+          <label for="left_birthday">YOUR DATE OF BIRTH:</label><br />
+          <input type="date" id="left_birthday" name="left_birthday" /><br />
         </form>
       </div>
 
@@ -68,33 +58,18 @@ <h1>Welcome to the Zodiac Compatibility Tool</h1>
           />
         </div>
       </div>
-      <div id="arrows">
-        <img src="images/arrow_left.png" id="left_arrow" />
-        <img src="images/arrow_right.png" id="right_arrow" />
-      </div>
       <div class="bday_input" id="right_bday_input">
         <form>
-          <label for="right_birthday" id="birthday_label"
-            >THEIR DATE OF BIRTH:</label
-          ><br />
-          <input
-            type="text"
-            id="right_birthday"
-            name="right_birthday"
-            value="Jun 21 - Jul 22"
-          /><br />
+          <label for="right_birthday">THEIR DATE OF BIRTH:</label><br />
+          <input type="date" id="right_birthday" name="right_birthday" /><br />
         </form>
       </div>
     </div>
 
     <div id="pop-up">
-      <div id="text">
-        <h2 id="pairing">Pop-up Box</h2>
-        <p id="pairing_text">This is some sample text for the pop-up box.</p>
-      </div>
-      <div>
-        <button id="go-back" onclick="location.reload()">Go Back!</button>
-      </div>
+      <h2 id="pairing">Pop-up Box</h2>
+      <p>This is some sample text for the pop-up box.</p>
+      <button id="go-back" onclick="location.reload()">Go Back!</button>
     </div>
 
     <script src="script.js"></script>