-
Notifications
You must be signed in to change notification settings - Fork 0
/
Works.html
114 lines (103 loc) · 4.96 KB
/
Works.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
<!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="./Main.css">
<script src="https://kit.fontawesome.com/c8b934b995.js" crossorigin="anonymous"></script>
<title>Portfolo-Creative Developer</title>
<link rel="shortcut icon" href="/images/favicon.ico" type="image/x-icon">
</head>
<body>
<div class="container ">
<header class="">
<nav>
<a href="/">
<h2> <span>Ifeanyi</span> Chukwu</h2>
</a>
<ul>
<li><a href="/">Home</a></li>
<li><a href="./Works.html">Works</a></li>
<li><a href="./Blog.html">Blogs</a></li>
</ul>
<i class="fa-solid fa-bars"></i>
</nav>
<ul class="mobile-menu ">
<li><a href="/">Home</a></li>
<li><a href="./Works.html">Works</a></li>
<li><a href="./Blog.html">Blogs</a></li>
</ul>
</header>
<section class="Features container-Pd">
<p class="Work-title">Features Works</p>
<div class="feature-box">
<img src="./images/Rectangle 30.png" alt="Featured-img">
<div class="feature-details">
<a href="./workDetails.html">
<h2>Designing Dashboards</h2>
</a><button class="Year">2020</button>
<button class="featureBtn">Dashbord</button>
<p>Amet minim mollit non deserunt ullamco est duis enim velit mollit. Exercitation veniam consequat
sunt nostrud amet. sit aliqua dolor do amet sint. Velit officia consequat
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet.</p>
</div>
</div>
<div class="feature-box">
<img src="./images/Rectangle 32.png" alt="Featured-img">
<div class="feature-details">
<a href="./workDetails.html">
<h2>Vibrant Portraits of 2020</h2>
</a><button class="Year">2018</button>
<button class="featureBtn">Illustration</button>
<p>Amet minim mollit non deserunt ullamco est
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet. sit aliqua dolor do
amet sint. Velit officia consequat
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet.</p>
</div>
</div>
<div class="feature-box">
<img src="./images/Rectangle 34.png" alt="Featured-img">
<div class="feature-details">
<a href="./workDetails.html">
<h2>36 Days of Malayalam type</h2>
</a><button class="Year">2018</button>
<button class="featureBtn">Typography</button>
<p>Amet minim mollit non deserunt ullamco est
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet. sit aliqua dolor do
amet sint. Velit officia consequat
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet.</p>
</div>
</div>
<div class="feature-box">
<img src="./images/Rectangle 40.png" alt="Featured-img">
<div class="feature-details">
<a href="./workDetails.html">
<h2>Components</h2>
</a><button class="Year">2018</button>
<button class="featureBtn">Typography</button>
<p>Amet minim mollit non deserunt ullamco est
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet. sit aliqua dolor do
amet sint. Velit officia consequat
duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet.</p>
</div>
</div>
</section>
<footer>
<section class="icons"><i class="fa-brands fa-square-facebook"></i><i class="fa-brands fa-instagram"></i><i
class="fa-brands fa-twitter"></i><i class="fa-brands fa-linkedin"></i>
</section>
<section class="copyright">
<p>Copyright ©2020 All rights reserved </p>
</section>
</footer>
</div>
<script>
var menu = document.querySelector('.fa-bars');
var List = document.querySelector('.mobile-menu').classList;
menu.addEventListener('click', () => {
List.toggle('active');
})
</script>
</body>
</html>