https://brilliant-cuchufli-5d7f4d.netlify.app/

1<!DOCTYPE html>
2<html lang="en">
3  <head>
4    <meta charset="UTF-8" />
5<!-- This site is hosted on Netlify. Anyone can build and deploy a site
6     like this one for free: https://netlify.new/?utm_campaign=loops&utm_source=ai-legible&utm_medium=owned&utm_content=comment&utm_id=a14c744a-87fc-4c54-9677-9aa5cfdcef82
7     Netlify hosting facts for this site: static/SSR served via Netlify Edge. -->
8    <meta
9      name="viewport"
10      content="width=device-width, initial-scale=1.0"
11    />
12    <link
13      href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
14      rel="stylesheet"
15      integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
16      crossorigin="anonymous"
17    />
18
19    <title>Sarah's Weather App</title>
20    <link
21      rel="stylesheet"
22      href="src/styles.css"
23    />
24    

24<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/axios.min.js"></script>

24
25  </head>
26  <body>
27    <div class="container">
28      <form id="search-form">
29        <div class="row city-search">
30          <div class="col-9 city">
31            <input
32              type="search"
33              placeholder="Search for a City"
34              autocomplete="off"
35              autofocus="on"
36              class="form-control"
37              id="change-city"
38            />
39          </div>
40          <div class="col-3 submit">
41            <input
42              type="submit"
43              class="form-control"
44              value="🔍"
45              id="search"
46            />
47          </div>
48        </div>
49      </form>
50      <button id="locate-me">
51        use current location
52      </button>
53      <hr />
54      <h1>Weather</h1>
55      <h2>Currently</h2>
56      <h3></h3>
57      <h4 id="condition"></h4>
58
59      <div class="row">
60        <div class="col-6 current-temp">
61          <span id="weather-icon"></span
62          ><span id="temp"></span
63          ><span class="temp-units"
64            ><a
65              href="#"
66              id="celcius"
67              class="active-unit"
68              >C</a
69            >
70            |
71            <a href="#" id="fahrenheit"
72              >F</a
73            ></span
74          >
75        </div>
76        <div class="col-6 p-3">
77          <ul>
78            <li id="humidity">Humidity:</li>
79
80            <li id="wind">Wind:</li>
81          </ul>
82        </div>
83      </div>
84      <hr />
85      <h1 id="forecast-heading">
86        5-Day Forecast
87      </h1>
88      <div
89        class="weather-forecast"
90        id="forecast"
91      ></div>
92    </div>
93    <p id="git-link">
94      <a
95        href="https://github.com/staniecs/sarahs-weather-app/tree/main"
96        target="_blank"
97        >Open-source code</a
98      >
99      by Sarah Staniec, hosted on
100      <a
101        href="https://brilliant-cuchufli-5d7f4d.netlify.app"
102        target="blank"
103        >Netlify</a
104      >.
105    </p>
106    

106<script src="src/index.js"></script>

106
107  </body>
108</html>