Web-Projects/index.html at main · nickmoone/Web-Projects · 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
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Nick Moone - Apps</title>

    <meta name="description" lang="en" content="Free online web projects and tools for a variety of purposes.">
    <meta name="keywords" lang="en" content="web, projects, online, tools, free, gratis">
    <meta name="author" lang="en" content="Nick Moone">

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" href="/apps/favicon.png">

    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">

    <style>
        body {
            background-color: whitesmoke;
            color: black;
        }

        .card {
            background-color: white;
            color: black;
        }

        /* Dark mode */
        @media (prefers-color-scheme: dark) {
            body {
                background-color: #181818;
                color: white;
            }

            .card {
                background-color: #383838 !important;
                color: white !important;
            }
        }
    </style>
</head>
<body>
    <div class="w3-display-container w3-red w3-margin-top w3-margin-bottom">
        <h1 class="w3-container">Apps</h1>
    </div>
    <div class="w3-container">
        <div class="w3-row">
            <div class="w3-container w3-card-2 w3-round w3-third w3-hover-shadow card" style="cursor: pointer;" onclick="location.href='bruglichten'">
                    <div>
                        <p style="font-size: x-large;">
                            <img class="w3-right" src="bruglichten/favicon.png" style="height: 32px;">
                            Bruglichten
                        </p>
                    </div>
                <p>Online tool om aan de hand van bruglichten op het vaarwater te bepalen of doorvaren is toegestaan.</p>
                <br>
            </div>
        </div>
        <br>
    </div>
</body>
</html>