-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
132 lines (129 loc) · 4.6 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
<!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" />
<title>Front-end developer - Anastasiia Tatarchenko</title>
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65"
crossorigin="anonymous"
/>
<link
href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&family=Poppins:wght@500;700&display=swap"
rel="stylesheet"
/>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"
integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V"
crossorigin="anonymous"
></script>
<script
src="https://kit.fontawesome.com/ddc3ee268a.js"
crossorigin="anonymous"
></script>
<link rel="stylesheet" href="src/style.css ">
</head>
<body>
<nav class="navbar navbar-dark bg-primary">
<div class="container-fluid">
<a class="navbar-brand" href="#">Anastasiia Tatarchenko</a>
</div>
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarNav"
aria-controls="navbarNav"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a
class="nav-link"
aria-current="page"
href="index.html"
>Home</a
>
</li>
<li class="nav-item">
<a
class="nav-link"
aria-current="page"
href="about.html"
>About me</a
>
</li>
<li class="nav-item">
<a
class="nav-link"
aria-current="page"
href="contact-link"
>Contact me</a
>
</li>
</ul>
</div>
</div>
</nav>
<div class="hero">
<h2>👋 Hi I am</h2>
<h1>Anastasiia Tatarchenko</h1>
<h3>🇺🇦 I study as a Front-end developer from Europe</h3>
<div class="navigation-links mb-5">
<a href="about.html#contact" class="contact-link">Contact me</a>
<a href="about.html" class="about-link">About me</a>
</div>
<div class="container">
<div class="row">
<div class="col-md-6">
<img src="images/yoga.png" class="img-fluid rounded" />
</div>
<div class="col-md-6">
<h2 class="mb-3">Yoga app</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Perferendis quia, dignissimos nam ratione veniam quibusdam porro omnis quam vel eos eveniet alias temporibus deserunt veritatis minima fugiat explicabo eum dolore.
</p>
<div class="mt-5">
<a href="#" class="primary-link">Launch Yoga App</a>
</div>
</div>
<div class="row mt-5">
<div class="col-md-6">
<h2 class="mb-3">Weather app</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Perferendis quia, dignissimos nam ratione veniam quibusdam porro omnis quam vel eos eveniet alias temporibus deserunt veritatis minima fugiat explicabo eum dolore.
</p>
<div class="mb-5 mt-5">
<a href="#" class="primary-link">Launch Weather App</a>
</div>
</div>
<div class="col-md-6">
<img src="images/weather.png" class="img-fluid rounded" />
</div>
</div>
<div class="row mt-5">
<div class="col-md-6">
<img src="images/sport.png" class="img-fluid rounded" />
</div>
<div class="col-md-6">
<h2 class="mb-3">Sport app</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Perferendis quia, dignissimos nam ratione veniam quibusdam porro omnis quam vel eos eveniet alias temporibus deserunt veritatis minima fugiat explicabo eum dolore.
</p>
<div class="mt-5">
<a href="#" class="primary-link">Launch Sport App</a>
</div>
</div>
</div>
</div>
</div>
</body>
</contact-section>
</html>