-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
201 lines (195 loc) · 10.5 KB
/
index.html
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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Warszawa45 project by Woytek</title>
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<meta name="description" content="Warszawa45 project by Woytek">
</head>
<body class="overflow">
<div id="loader">
<div class="lds-ripple">
<div></div>
<div></div>
</div>
</div>
<header>
<div class="images">
<div id="slider-photo-1"></div>
<div id="slider-photo-2"></div>
<div class="slider">
<div class="drag-line">
<span>
<div class="box">
<img src="img/next.svg" alt="arrow">
</div>
<div class="box">
<img src="img/next.svg" alt="arrow">
</div>
</span>
</div>
<input type="range" min="0" max="100" value="50">
</div>
</div>
<nav>
<a href="#">
<h2>Warszawa<span>45</span></h2>
</a>
</nav>
<section>
<div class="info-source black">
<img src="img/attachment-white.png" alt="attachment" alt="attachment-img" />
<a href="https://pl.m.wikipedia.org/wiki/Plik:Old_Town_Warsaw_waf-2012-1501-31(1945).jpg"
target="_blank" rel="noopener">Link do ilustracji nr 1</a>
</div>
<div class="info-source green">
<img src="img/attachment.png" alt="attachment" alt="attachment-img" />
<a href="https://norbi5.flog.pl/wpis/13093035/rynek-starego-miasta--warszawa" target="_blank"
rel="noopener">Link do ilustracji nr 2</a>
</div>
</section>
</header>
<main>
<section id="history" class="black">
<div class="wrapper">
<div class="wrapper-left order-1">
<p class="align-left white-font" data-aos="fade-up"><span class="bigletter">N</span>iegdyś kwitnąca
metropolia została
mocno zniszczona
już w czasie
nalotów we
<span class="mark green-font">wrześniu 1939 roku</span>, wówczas mocno ucierpiał Zamek
Królewski, później swoje dołożyły naloty
sowieckie, po powstaniu w getcie zrównano z ziemią całą dawną Dzielnicę Północną. Największy
cios przyszedł w czasie powstania warszawskiego oraz w okresie pomiędzy powstaniem a
wyzwoleniem, gdy Niemcy z rozmysłem wyburzali zachowane jeszcze budynki, perły warszawskiej
architektury (np. pałac Brühla czy pałac Saski).
</p>
<p class="align-right white-font" data-aos="fade-up">
Zniszczenie budynków to jedno, znaczenie większą tragedią były cierpienia ludności. W roku 1939
roku ludność Warszawy <span class="mark green-font">wynosiła 1,3 mln</span>, w tym ok.
<span class="mark green-font">300
tys. ludności żydowskiej</span>. Szacuje się, że w trakcie wyzwolenia na lewym brzegu Wisły
przebywało nie więcej niż <span class="mark green-font">1000
osób…</span> Niemal wszyscy
Żydzi zginęli w obozach zagłady, polscy mieszkańcy Warszawy bądź zginęli w czasie powstania,
bądź zostali wywiezieni po jego upadku. Ci którzy zostali, często ostatni ocaleni Żydzi, nie
mieli się gdzie podziać, pozostanie w ruinach było dla nich jedyną formą przetrwania.
</p>
<div class="source" data-aos="fade-up">
<img src="img/attachment-white.png" alt="attachment-img" />
<span>Źródło:<a href="http://ekartkazwarszawy.pl/kartka/wyzwolenie-warszawy/" target="_blank"
rel="noopener">http://ekartkazwarszawy.pl/kartka/wyzwolenie-warszawy/</a>
</span>
</div>
</div>
<div class="wrapper-right order-2" data-aos="fade-up">
<a href="https://pl.wikipedia.org/wiki/Walki_o_Warszaw%C4%99_(1945)#/media/Plik:Polish_Army_Parade_waf-2012-1502-29_(1945).jpg"
target="_blank" rel="noopener">
<div class="moving-img">
<img class="model-left" src="img/img-1-left.png" alt="army-left">
<img class="model-right" src="img/img-1-right.png" alt="army-right">
</div>
</a>
<div class="wrapper-source">
<img src="img/attachment-white.png" alt="attachment-img" />
<span>Źródło: <a
href="https://pl.wikipedia.org/wiki/Walki_o_Warszaw%C4%99_(1945)#/media/Plik:Polish_Army_Parade_waf-2012-1502-29_(1945).jpg"
target="_blank"
rel="noopener">https://pl.wikipedia.org/wiki/Walki_o_Warszaw%C4%99_(1945)</a>
</span>
</div>
</div>
</div>
</section>
<section id="history" class="green">
<div class="wrapper">
<div class="wrapper-left order-2">
<p class="align-left black-font" data-aos="fade-up"><span class="bigletter">14</span> stycznia 1945
wojska 1 Frontu
Białoruskiego rozpoczęły operację
warszawską,
stanowiącą część operacji wiślańsko-odrzańskiej. <span class="mark white-font">61 Armia
nacierała z przyczółka
warecko-magnuszewskiego</span>, 47 Armia 15 stycznia z rejonu Jabłonny na Leszno, a 2 Armia
Pancerna z
rejonu Warki na Grójec. <span class="mark white-font">1 Armia Wojska Polskiego</span> do 17
stycznia była w drugim rzucie.</p>
<p class="align-left black-font" data-aos="fade-up">
Do 16 stycznia 1945 <span class="mark white-font">1 Armia Wojska Polskiego</span> zajmowała
pozycje obronne od Jabłonny do
Karczewa. Zgrupowanie uderzeniowe 1 Armii WP w sile:
</p>
<ul data-aos="fade-up">
<li>1 Dywizja Piechoty,</li>
<li>3 Dywizja Piechoty i 4 Dywizja
Piechoty,</li>
<li>1 Brygada Pancerna im. Bohaterów
Westerplatte,</li>
<li>1 Samodzielna Brygada Kawalerii,</li>
<li>4 Pułk Czołgów Ciężkich,</li>
<li>13 Pułk Artylerii Pancernej,</li>
<li>1 Warszawska Brygada Saperów,</li>
<li>3 Brygada Pontonowo-Mostowa, przy wsparciu 1 Brygady Artylerii Armat, 5 Brygady Artylerii
Ciężkiej,</li>
<li>2 Brygady Artylerii Haubic,</li>
<li>4 Brygady Artylerii Pancernej,</li>
<li>1 Pułku Moździerzy miało
wykonywać uderzenie od południa z rejonu Góry Kalwarii.</li>
</ul>
<div class="source" data-aos="fade-up">
<img src="img/attachment.png" alt="attachment-img" />
<span>Źródło:<a href="https://pl.wikipedia.org/wiki/Walki_o_Warszaw%C4%99_(1945)"
target="_blank"
rel="noopener">https://pl.wikipedia.org/wiki/Walki_o_Warszaw%C4%99_(1945)</a>
</span>
</div>
</div>
<div class="wrapper-right order-1" data-aos="fade-up">
<div class="wrapper-source">
<img src="img/attachment.png" alt="attachment-img" />
<span>Źródło: <a href="https://pl.sputniknews.com/opinie/20150423285242/" target="_blank"
rel="noopener">https://pl.sputniknews.com/opinie/20150423285242/</a>
</span>
</div>
<a href="https://pl.sputniknews.com/opinie/20150423285242/" target="_blank" rel="noopener">
<div class="moving-img">
<img class="model-left" src="img/img-2-left.png" alt="army-left">
<img class="model-right" src="img/img-2-right.png" alt="army-right">
</div>
</a>
</div>
</div>
</section>
<section id="history-3">
<img class="soliders" src="img/img-3.png" alt="soliders">
<div class="wrapper">
<div class="wrapper-left" data-aos="fade-up">
<h1>17 stycznia 1945</h1>
<blockquote>Boże, to już jest wojsko?! Dziecko kochane, ale czy wy już naprawdę jesteście?
</blockquote>
<cite>Autor nieznany</cite>
</div>
</div>
</section>
<section id="video">
<iframe src="https://www.youtube.com/embed/kE8imbDKNvI" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen data-aos="fade-up"></iframe>
</section>
</main>
<footer>
<p>Projekt zrealizowany na potrzeby lekcji historii <a href="https://zstib.edu.pl/blog" target="_blank"
rel="noopener">ZSTiB Brzesko</a> Luty 2021, KL IV TI <a href="https://woytek-portfolio.pl/"
target="_blank" rel="noopener">Wojciech Skirło</a></p>
</footer>
<!-- Scripts -->
<script src="app.js"></script>
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
<script>
AOS.init();
</script>
</body>
</html>