-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
72 lines (61 loc) · 3.68 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
<!DOCTYPE html>
<html lang="pl">
<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>Portfolio website</title>
<link href="css/style.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" rel="stylesheet">
</head>
<body>
<header class="header grid">
<div class="header-content">
<a class="header-logo" href="index.html"><span class="surname">AWita</span></a>
<button aria-label="Open navigation" class="open-nav">☰</button>
<nav class="nav">
<button aria-label="Close navigation" class="close-nav">×</button>
<ul class="nav-list">
<li class="nav-item home"><a href="index.html" class="nav-link home">home</a></li>
<li class="nav-item about"><a href="about.html" class="nav-link about">about</a></li>
<li class="nav-item contact"><a href="contact.html" class="nav-link contact">contact</a></li>
</ul>
</nav>
</div>
</header>
<main class="main">
<section class="banner grid">
<h1 class="banner-title">lorem ipsum lorem <strong>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</strong> lorem ipsum lorem ipsum lorem</h1>
<p class="banner-subtitle">lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum.</p>
<a class="btn btn-banner" href="contact.html">contact</a>
</section>
<section class="columns grid">
<div class="col col-1">
<h2 class="col-1-title">About Us</h2>
<p class="col-1-par">lorem ipsum lorem <strong>lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum</strong> ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum.</p>
</div>
<div class="col col-2">
<h2 class="col-2-title">Our skills</h2>
<p class="col-2-par">lorem ipsum lorem ipsum lorem ipsum <strong> ipsum lorem ipsum lorem ipsum</strong> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum.</p>
</div>
<div class="col col-3">
<h2 class="col-3-title">Get in touch</h2>
<p class="col-3-par">lorem ipsum lorem ipsum <strong>lorem ipsum lorem ipsum lorem ipsum </strong> lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum.</p>
</section>
</main>
<footer class="grid">
<div class="footer footer-main">
<!-- <img src="#" alt="logo" class="img-logo-footer"> -->
<p class="footer-logo"><span class="surname">AWita</span></p>
<p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum lorem ipsum.</p>
<p class="footer-small-par">© AW 2022</p>
</div>
<ul class="footer-social-media-list">
<li class="social-item linkedin-item"><a href="#" class="link-linkedin"><i class="fa-brands fa-linkedin-in"></i></a></li>
<li class="social-item github-item"><a href="#" class="link-github"><i class="fa-brands fa-github"></i></a></li>
</ul>
</footer>
<script src="script.js"></script>
</body>
</html>