Ada-C18 · Alaere00 · Dec 10, 2022 · Dec 10, 2022 · Dec 11, 2022 · Dec 11, 2022
diff --git a/README.md b/README.md
@@ -73,51 +73,3 @@ This should be done during the Wave 1 initial setup of your `index.html` page.
   - `assets` folder, potentially for holding images
 - Create and add more folders and files as needed
 
-## Content Requirements
-
-For this project, there are no requirements around color schemes, font choices, or layouts. 
-
-Note that applying styles with CSS is one of many learning goals of this project -- it is not the central learning goal. You may enjoy being creative with styles, but we encourage you to not concern yourself with getting the styles perfect. Remember, you can always choose to continue working on styling after you've completed all functional requirements. 
-
-However, _at a minimum_, your project must contain these elements:
-
-Wave 2:
-
-1. An element that displays the temperature
-1. A clickable element to increase temperature
-1. A clickable element to decrease temperature
-1. An element that displays a landscape
-
-Wave 3:
-
-1. An element that displays the city name
-1. An element that contains an `<input type="text">` element, used to rename the city
-
-Wave 4:
-
-1. A clickable element to get the current temperature of the displayed city name
-
-Wave 5:
-
-1. A `<select>` dropdown element to set the sky type
-1. An element that displays a sky
-
-Wave 6:
-
-1. A clickable element to reset the city name
-
-## Detailed Content Requirements
-
-[Wave 1: Create Wireframes and HTML](./ada-project-docs/wave-01.md)
-
-[Wave 2: Increase and Decrease Temperature](./ada-project-docs/wave-02.md)
-
-[Wave 3: Naming the City](./ada-project-docs/wave-03.md)
-
-[Wave 4: Calling APIs](./ada-project-docs/wave-04.md)
-
-[Wave 5: Selecting the Sky](./ada-project-docs/wave-05.md)
-
-[Wave 6: Resetting the City Name](./ada-project-docs/wave-06.md)
-
-[Optional Enhancements to inspire you](./ada-project-docs/optional-enhancements.md)
diff --git a/ada-project-docs/assets/cloudy.png b/ada-project-docs/assets/cloudy.png
diff --git a/ada-project-docs/assets/dry.png b/ada-project-docs/assets/dry.png
diff --git a/ada-project-docs/assets/rain.png b/ada-project-docs/assets/rain.png
diff --git a/ada-project-docs/assets/snow.png b/ada-project-docs/assets/snow.png
diff --git a/ada-project-docs/assets/sunshine.png b/ada-project-docs/assets/sunshine.png
diff --git a/ada-project-docs/assets/weather-report-wireframe.png b/ada-project-docs/assets/weather-report-wireframe.png
diff --git a/index.html b/index.html
@@ -4,9 +4,73 @@
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" type="text/css" href="/styles/index.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=Rokkitt:wght@100;200;300;400;600;700&display=swap" rel="stylesheet">
     <title>Weather Report</title>
 </head>
-<body>
-
+
+<body class="coolTheme">
+    <header>
+        <div id="column" class="flex-box-container">
+            <div class="background-block"></div>
+            <div  class="text-in-front">
+                <label for="sky">Choose your sky:
+                    <select id="sky" name="sky">
+                        <option value="sunny" class="background">Sunny</option>
+                        <option value="cloudy" class="background">Cloudy</option>
+                        <option value="rainy" class="background">Rainy</option>
+                        <option value="snowy" class="background">Snowy</option>
+                    </select>
+                </label>
+                <h1>Weather Report</h1>
+                <h2 id="now-showing" onLoaded="nowShowingTemp()"></h2>
+            </div>
+        </div>
+    </header>
+
+    <section>
+        <div class="misc-heading-container">
+            <div class="text-in-front"><h2>Find A Temperature By City</h2></div>
+        </div>
+        <div id="row" class="flex-box-container">
+            <section id="city-name" class="text-in-front">
+                <h3>Search by City</h3>
+                <div id="topnav">
+                    <input type="text" id="defaultCity" placeholder="Portland, OR"  
+                    autocomplete="off" onKeyUp="updateCityWhileTyping()">
+                    <br>
+                    <br>
+                    <button id="realTime">Get Realtime Temp</button>
+                    <button id="reset" type="reset">Reset</button>
+                </div>
+                <br>
+            </section>
+            <section id="temp" class="text-in-front">
+                <h3>Temperature</h3>
+                <div id="wrapper">
+                    <button id="increaseBtn"><span>&#43;</span></button>
+                    <span id="tempTag">45</span>
+                    <span id="tempUnits">° F</span>
+                    <button id="decreaseBtn"><span>&#8722;</span></button>
+                    <br>
+                    <br>
+                </div>
+            </section>
+            <section id="garden" class="text-in-front">
+                <h3>Your Weather Emojis</h3>
+                <div id="curWeatherEmojis">🧤🧣🧤</div>
+            </section>
+        </div>
+    </section>
+
+    <footer>
+        <div class="misc-heading-container">
+            <h3>© 2022 | Alaere & Anika | C18 Snow Leopards</h3>
+        </div>
+    </footer>
+    <script src="./node_modules/axios/dist/axios.min.js"></script>
+    <script src="src/index.js"></script>
 </body>
 </html>
diff --git a/package-lock.json b/package-lock.json