Ada-C24 · trimakichan · Dec 3, 2025 · Dec 3, 2025 · Dec 3, 2025 · Dec 3, 2025
diff --git a/.gitignore b/.gitignore
@@ -1,4 +1,6 @@
 .vscode
 .DS_Store
 node_modules
-.parcel-cache
+.parcel-cache
+
+.env
diff --git a/assets/cloudy.svg b/assets/cloudy.svg
diff --git a/assets/rain.svg b/assets/rain.svg
diff --git a/assets/snow.svg b/assets/snow.svg
diff --git a/assets/sunny.svg b/assets/sunny.svg
diff --git a/assets/windy.svg b/assets/windy.svg
diff --git a/coworking_agreement.md b/coworking_agreement.md
@@ -4,22 +4,28 @@ Talk through each section with your partner. Add notes on what you discussed and
 
 ## Accessibility Needs
 *What does each team member need access to in order to succeed and show up the best they can?*
+Communicate via Slack. 
 
 ## Collaboration vs. Individual Work Expectations
 *Clarify your collaboration expectations - does your group want to write code together all of the time? Or divide work to do independently, then come together to share accomplishments? What tools and technologies can help your collaboration?*
+Makiko: 
+We will prefer dividing work to do independently and then meet on Zoom to do code review and pair programming if needed. 
 
 ## Learning Style
 *How does each team member learn best in project settings?*
+Makiko: Communicates well with a teammate and share ideas. 
 
 ## Preferred Feedback Style
 *How does each team member best receive feedback?*
+Makiko: I prefer direct feedback.
 
 ## One Team Communication Skill to Improve
 *What is a teamwork-related skill you want to work on?*
+Makiko: I want to improve how I communicate my ideas and solutions to ensure my teammates and I are aligned.
 
 ## Optional: Other agreements
 *Other co-working agreements that were not captured in the above sections.*
 
 ## Signatures
-______________ _______________
-Date: _________
+Makiko Yokoyama, _______________
+Date: 12/03/2025
diff --git a/index.html b/index.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
     <meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
@@ -8,8 +9,60 @@
     <link rel="preconnect" href="https://fonts.gstatic.com">
     <link href="https://fonts.googleapis.com/css2?family=Rubik&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="styles/index.css">
+    <script defer src="https://unpkg.com/axios/dist/axios.min.js"></script>
+    <script defer src="./src/API.js"></script>
     <script defer src="./src/index.js"></script>
 </head>
+
 <body>
+    <header class="header__header">
+        <h1>Weather Report</h1>
+    </header>
+
+    <div class="content-wrapper">
+        <section class="city-name__section">
+            <h2>City Name</h2>
+            <div class="wrapper">
+                <div>
+                    <p>For the lovely city of</p>
+                    <p id="headerCityName" class="header__city-name"></p>
+                </div>
+                <div>
+                    <input type="text" id="cityNameInput" value="Seattle">
+                    <button id="cityNameReset" class="city-name__reset-btn">Reset</button>
+                </div>
+            </div>
+        </section>
+
+        <section class="temperature__section">
+            <h2>Temperature</h2>
+            <div class="temperature__content">
+                <div class="temperature__controls">
+                    <span id="increaseTempControl">⬆️</span>
+                    <span id="tempValue"></span>
+                    <span id="decreaseTempControl">⬇️</span>
+                </div>
+                <button id="checkWeather">Get Realtime Temperature</button>
+            </div>
+        </section>
+        <section class="sky__section">
+            <h2>Sky</h2>
+            <select id="skySelect" class="dropdown">
+                <option value="sunny" selected>Sunny</option>
+                <option value="cloudy">Cloudy</option>
+                <option value="rainy">Rainy</option>
+                <option value="snowy">Snowy</option>
+            </select>
+            <img id="sky" src="assets/sunny.svg" alt="weather icon">
+        </section>
+    </div>
+
+    <section class="garden__section">
+        <h2>Weather Garden</h2>
+        <div id="gardenContent" class="garden__content">
+            <div id="landscape"></div>
+        </div>
+    </section>
 </body>
-</html>
+
+</html>