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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
|
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=, initial-scale=1.0">
<title>Baltikett</title>
<!-- Bootstrap - CSS only -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous">
<link rel="stylesheet" href="styles.css">
</head>
<body class="text-white">
<div class="container text-center text-white align-items-center">
<h1 class="pb-1 pt-2">Baltikett</h1>
<p>
Joonlauaga (vali parempoolsest rippmenüüst joonlaua ikoon
(vasakpoolse paneeli võid ruumi tegemiseks sulgeda))
saab mitme klikiga mööda joont kaugust mõõta. Selleks,
et saada võimalikult täpne tulemus, zoomi kaardile lähemale
või kaugemale, vastavalt vajadusele.<br>Leia Baltiketi pikkus Eestis
ning sinu kodukoha kaugus ketist.
</p>
<div class="row">
<div>
<button class="moveOn" disabled>Liigu Edasi</button>
<!-- Button trigger modal -->
<button type="button" class="btn btn-primary modalButton" data-bs-toggle="modal" data-bs-target="#myModal">
Sissejuhatus
</button>
</div>
</div>
</div>
<!-- Modal -->
<div class="modal fade text-black" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<div class="modalHeaderWrapper">
<h3 class="modal-title" id="myModalLabel">Sissejuhatus</h5>
</div>
<img class="avatar" alt="avatar" src="pildid/avatar.jpg"/>
</div>
<div class="modal-body">
<p>
<strong>Olen nüüd püüdnud julgelt uue ajaga sammu käia.</strong>
<br> <br>
23.augustil 1989 aastal käisime kogu kooliperega Balti ketis,
see oli rahumeelne poliitiline meeleavaldus, mille eesmärgiks
oli demonstreerida maailmale Baltimaade vabadustahet ja juhtida
tähelepanu NSV Liidu ja Saksamaa vahel poole sajandi eest sõlmitud
Molotovi-Ribbentropi paktile, mille salaprotokollid viisid Baltimaade
okupeerimise ja annekteerimiseni NSV Liidu poolt.
Meid oli Balti ketis kokku ligi 300 õpilast ja õpetajat, hoidsime
kätest kinni ja tundsime, et oleme selle pika keti väärikas lüli.
Lausa pisar tuli silma, kui hüüdsime üheskoos: “Vabadus, vabadus, vabadus!”
<br> <br>
<strong>
Kas käisid Balti ketis? Mõõda, kui pikk oli Balti keti teekond Eestis?
Kui kaugelt Balti kett sinu kodukohast möödus? Anna vastus kilomeetrites
</strong>
</p>
</div>
</div>
</div>
</div>
<div class="inputWrapper">
<div>
<label for="teekond">Baltiketi Teekond Eestis:</label>
<input class="teekondInput" name="teekond" type="text" value="" placeholder="Pikkus (km)"/>
</div>
<div>
<label for="asula">Asula:</label>
<input class="asulaInput" name="asula" type="text" value="" placeholder="Sinu valitud asula"/>
</div>
<div>
<label class="rightWrapper" for="kaugus">Kaugus:</label>
<input class="kaugusInput" name="kaugus" type="text" value="" placeholder="Kaugus (km)"/>
</div>
</div>
<!-- Mainer -->
<div class="main">
<iframe width="100%" height="95%" src="https://xgis.maaamet.ee/xgis2/page/link/OFw1OabK"></iframe>
</div>
<script src="script.js"></script>
<!-- JavaScript Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
</body>
</html>
|