weatherAPI/index.html at main · t-ryles/weatherAPI · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="description" content="Waerther checker, able to look up weather conditions via zipcode or postal code.">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Heebo&display=swap');
    </style>
    <script src="https://kit.fontawesome.com/f11b863e94.js" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="style.css">
    <title>Weather API</title>
</head>

<body style='background-image: url("./img/mathias-p-r-reding-v5KGZTY82Xk-unsplash.jpg");'>
    <div class="container">
        <h2>Weather API</h2>
        <h3>Enter zip code:
            <label for="Inputing zipcode to be searched">
                <input id="zipCode" type="text" size="8" onfocus="this.value=''" alt="Zip code input area">
                <input id="btn" type="submit" alt="Button to seach">
            </label>
        </h3>
        <p id="error"></p>
        <div id="imgDiv"></div>
        <p><i class="fas fa-thermometer-half"></i><span id="temp"></span></p>
        <p>Feels like:<span id="feels"></span></p>
        <p><i class="fas fa-street-view"></i><span id="city"></span></p>
    </div>
</body>
<script type="module" src="app.js"></script>

</html>