-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout.html
70 lines (70 loc) · 3.07 KB
/
about.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="style.css" />
<title>About Maria Bila</title>
<meta name="description" content="Read more info about Maria Bila Ukrainian front-end developer based in Poland">
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ"
crossorigin="anonymous"
/>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe"
crossorigin="anonymous"
></script>
</head>
<body>
<nav class="navbar sticky-top navbar-expand-xxl bg-body-tertiary">
<div class="container-fluid">
<a class="navbar-brand" href="index.html" title="Maria Bila Developer website">Maria Bila</a>
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-link active" aria-current="page" href="index.html"
>Home</a
>
<a class="nav-link" href="about.html">About me</a>
<a class="nav-link" href="about.html#mail-link"">Contact me</a>
</div>
</div>
</div>
</nav>
<h1 class="text-center">About me</h1>
<h3 class="text-center">Front-end developer from Ukraine, based in Poland</h3>
<div class="about-paragraphs">
<p>
Lorem ipsum dolor sit amet, consectetur ad ipisicing elit. Numquam
aperiam provident tempora? Cumque adipisci, non dolorem quia, odit qui
alias veniam excepturi rem dolor fugit dignissimos, sed voluptatum
blanditiis harum.
</p>
</div>
<div class="container">
<div class="row d-flex">
<div class="col-sm-4"><img src="images/yoga.png" class="img-fluid p-2 shadow rounded" alt="Yoga app image"></img></div>
<div class="col-sm-4"><img src="images/weather.png" class="img-fluid p-2 shadow rounded" alt="Weather app image"></img></div>
<div class="col-sm-4"><img src="images/yogurt.png" class="img-fluid p-2 shadow rounded mb-5" alt="Yogurt app image"></img></div>
</div>
</div>
<div id="contact">
<h2 class="text-center" id="mail-link">📮 Contact me</h2>
<a href="mailto:[email]" class="email-link" title="Email to Maria Bila">[email protected]</a>
</div>
</body>
</html>