-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
251 lines (243 loc) · 11.7 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
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Sebastian Bąbiński - Wizytówka</title>
</head>
<body>
<div class="content">
<header>
<nav class="navigation">
<p class="logo">Math<span>Breakers</span></p>
<input type="checkbox" id="menuCheck">
<label for="menuCheck">
<img class="menuIcon" src="images/menu_icon.svg" alt="menu">
</label>
<ul class="menu">
<li class="menuItem"><a class="menuLink" href="#about">Strona główna</a></li>
<li class="menuItem"><a class="menuLink" href="#tutors">Korepetytorzy</a></li>
<li class="menuItem"><a class="menuLink" href="#achives">Osiągnięcia</a></li>
<li class="menuItem"><a class="menuLink" href="#contact">Kontakt</a></li>
<li class="menuItem"><a class="menuLink" href="#form">Formularz</a></li>
</ul>
</nav>
</header>
<section id="start">
<div class="startContainer">
<h1>Witaj na stronie <span>MathBreakers</span></h1>
<a href="#about" type="button" class="fsa">Sprawdź nas!</a>
</div>
</section>
<section id="about">
<div class="aboutUsSection">
<div class="top">
<h1 class="sectionTitle">Kilka słów o naszej organizacji</h1>
<p>Nasza firma specjalizuje się w usługach korepetytorskich na każdym szczeblu nauki. W gronie korepetytorów znajdują się osoby o ogromnym doświadczeniu oraz umiejętnościach efektywnego przekazania wiedzy. Do każdego ucznia podchodzimy indywidualnie, rozwiązujemy problemy od podstaw i nadrabiamy zaległości. Nauka opiera się na praktycznym wykorzystaniu matematyki – po opanowaniu podstaw ukazujemy realny wpływ matematyki na naszą codzienność. Wychodzimy z założenia, że nasza pamięć to nie jest wysypisko śmieci – należy przyswajać wiedzę użyteczną, praktyczną i pozwalającą na rozwój, a „wkuwanie” należy ograniczyć do niezbędnego minimum.</p>
</div>
<div class="bottom">
<div class="sectionItem">
<div class="icon"><img src="https://img.icons8.com/doodle/96/000000/money.png"/></div>
<h2>Konkurencyjne ceny</h2>
<p>Ceny naszych usług są uzależnione od preferowanej formy nauki. W przypadku lekcji cyklicznych oraz grupowych przewidziane są zniżki</p>
</div>
<div class="sectionItem">
<div class="icon"><img src="https://img.icons8.com/plasticine/100/000000/gold-medal.png"/></div>
<h2>Uznanie wśród klientów</h2>
<p>Skracamy dystans między nauczycielem a uczniem, jesteśmy w celu pomocy, a nie wprowadzania szkolnego rygoru</p>
</div>
<div class="sectionItem">
<div class="icon"><img src="https://img.icons8.com/dusk/64/000000/time-management.png"/></div>
<h2>Szybkie efekty</h2>
<p>Osoby korzystające z naszej oferty wskazują na wysoką efektywność naszej pracy. Szybka nauka to oszczędność stresu, czasu i pieniędzy!</p>
</div>
</div>
</div>
</section>
<section id="tutors">
<div class="tutorsSection">
<div class="tutorsHeader">
<h1 class="sectionTitle">Zespół Mathbreakers</h1>
</div>
<div class="tutors">
<div class="tutorsItem">
<div class="tutorInfo">
<h1>Eustachy Motyka</h1>
<h2>student</h2>
<p>Eustachy jest studentem budownictwa na Politechnice Gdańskiej. Od 5 lat regularnie udziela korepetycji, dzięki czemu posiada ogromne doświadczenie mimo młodego wieku. Cechuje go wrażliwość, sumienność i otwartość.</p>
</div>
<div class="tutorImg">
<img src="./images/pexels-karolina-grabowska-6256237.jpg" alt="Sebastian">
</div>
</div>
<div class="tutorsItem">
<div class="tutorInfo">
<h1>Anna Nowak</h1>
<h2>Nauczyciel matematyki</h2>
<p>Anna Nowak od 2014r. jest nauczycielką matematyki w szkole podstawowej. Uwielbia pracę z dziećmi, poświęcając im czas również poza murami szkolnymi. Organizuje konkursy matematyczne, przygotowuje materiały ułatwiające naukę, prowadzi zajęcia wyrównawcze w celu wyjaśnienia nawet najmniejszych niejasności.</p>
</div>
<div class="tutorImg sebastian">
<img src="./images/pexels-julia-m-cameron-4144223.jpg" alt="Sebastian">
</div>
</div>
<div class="tutorsItem">
<div class="tutorInfo">
<h1>Katarzyna Kowalska</h1>
<h2>Ekonimistka</h2>
<p>Katarzyna Kowalska wstąpiła w szeregi MathBreakers w 2018r. Specjalizuje się w przygotowaniach do matury oraz rozwiązywaniu skomplikowanych zagadnień na poziomie uczelni wyższych</p>
</div>
<div class="tutorImg">
<img src="./images/pexels-katerina-holmes-5905475.jpg" alt="Sebastian">
</div>
</div>
<div class="tutorsItem">
<div class="tutorInfo">
<h1>Edward Klops</h1>
<h2>Geodeta</h2>
<p>Edward Klops ukończył Politechnikę Warszawską i od 2008r. prowadzi własną firmę geodezyjną. W swojej codziennej pracy zmaga się z problemami inżynierskimi, więc chętnie tłumaczy uczniom tajniki zaawansowanej matematyki na przykładach z jego branży. Jego otwartość i pozytywne nastawienie sprawiają, że uczniowie uwielbiają pracę z Panem Edwardem</p>
</div>
<div class="tutorImg">
<img src="./images/pexels-max-fischer-5212338.jpg" alt="Sebastian">
</div>
</div>
</div>
</div>
</section>
<section id="achives">
<div class="achiveContainer">
<div class="colLeft">
<div class=achiveImg>
<img src="./images/pexels-thisisengineering-3913025.jpg" alt="img">
</div>
</div>
<div class="colRight">
<h1 class="sectionTitle">Nasze osiągnięcia</h1>
<h2>Na przestrzeni zaledwie 5 lat działalności</h2>
<p>Od czasu założenia firmy z naszych usług skorzystało ponad 1000 uczniów. Dzięki naszej pomocy setki licealistów dostało się na wymarzone studia. Ponadto uczestniczymy w programie wsparcia rozwoju technologicznego Politechniki Gdańskiej, a nasi studenci przyczyniają się do powstania innowacyjnych rozwiązań technologicznych.<br>
<br><span>Wybrane nagrody:</span>
<br>- 1 miejsce w konkursie "Firma przyjazna szkolnictwu" (organizacja Larn, 2016)
<br>- 1 miejsce w plebiscycie "Praca z pasją" (Miasto Gdańsk, 2018)
<br>- Wyróżnienie w plebiscycie "Najlepsza działalność wsparcia technologii" (organizacja iLearn, 2020)
</p>
<a href="#" class="fsa">Dowiedz się więcej</a>
</div>
</div>
</section>
<section id="contact">
<div class="contactContainer">
<div><h1 class="sectionTitle">Kontakt</h1></div>
<div class="contactItems">
<div class="contactItem">
<div class="icon"><img src="./images/icons8-phone-96.png" alt="phone"></div>
<div class="contactInfo">
<h1>Telefon</h1>
<h2>+48 123 321 000</h2>
</div>
</div>
<div class="contactItem">
<div class="icon"><img src="./images/icons8-marker-96.png" alt="adres"></div>
<div class="contactInfo">
<h1>Adres</h1>
<h2>Gdańsk<br>Zbyszka z Bogdańca 3/4</h2>
</div>
</div>
<div class="contactItem">
<div class="icon"><img src="./images/icons8-email-96.png" alt="email"></div>
<div class="contactInfo">
<h1>Email</h1>
<h2>mathbreakers@gmail.com</h2>
</div>
</div>
</div>
</div>
</section>
<form id="form">
<div class="formContainer">
<div class="formTitle">
<p>Formularz zgłoszeniowy</p>
</div>
<div class="inputs">
<div class="inputField">
<label>Imię</label>
<input type="text" class="input" placeholder="Jan">
</div>
<div class="inputField">
<label>Nazwisko</label>
<input type="text" class="input" placeholder="Kowalski">
</div>
<div class="inputField">
<label>Email</label>
<input type="text" class="input" placeholder="jankowalski@gmail.com">
</div>
<div class="inputField">
<label>Nr telefonu</label>
<input type="text" class="input" placeholder="123 456 789">
</div>
<div class="inputField">
<label>Korepetytor</label>
<div class="customSelect">
<select>
<option value="">Wybierz</option>
<option value="Eustachy">Eustachy Motyka</option>
<option value="Anna">Anna Nowak</option>
<option value="Katarzyna">Katarzyna Kowalska</option>
<option value="Edward">Edward Klops</option>
</select>
</div>
</div>
<div class="inputField">
<label>Szkoła</label>
<div class="customSelect">
<select>
<option value="">Wybierz</option>
<option value="podstawowa">Podstawowa</option>
<option value="średnia">Średnia</option>
<option value="wyższa">Wyższa</option>
</select>
</div>
</div>
<div class="inputField">
<label>Liczba godzin</label>
<input type="number" class="input" min="0" max="4">
</div>
<div class="inputField message">
<label>Dodatkowe informacje</label>
<textarea class="input"></textarea>
</div>
<div class="inputField">
<input type="checkbox">
<p id="agreement">Wyrażam zgodę na przetwarzanie danych osobowych</p>
</div>
<div class="inputField">
<input type="submit" class="submitBtn" value="Wyślij">
</div>
</div>
</div>
</form>
<footer>
<div class="footerContainer">
<div class="brand">
<h1>MathBreakers</h1>
<h2>Po prostu matma</h2>
<div class="socialIcons">
<div class="socialItem">
<img src="./images/icons8-facebook-50.png" alt="facebook">
</div>
<div class="socialItem">
<img src="./images/icons8-instagram-50.png" alt="instagram">
</div>
<div class="socialItem">
<img src="./images/icons8-play-button-50.png" alt="youtube">
</div>
<div class="socialItem">
<img src="./images/icons8-twitter-50.png" alt="twitter">
</div>
</div>
<p>Copyright © 2020 MathBreakers. All rights reserved </p>
</div>
</div>
</footer>
</div>
</body>
</html>