-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
147 lines (131 loc) · 5.42 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Portfolio</title>
<link rel="stylesheet" href="css/bootstrap-grid.css" type="text/css">
<link rel="stylesheet" href="css/styles.css" type="text/css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&family=Inknut+Antiqua:wght@500&display=swap" rel="stylesheet">
</head>
<body>
<nav>
<ul class="navigation">
<li><a href="#contact">contact</a></li>
<li><a href="#projects">works</a></li>
<li><a href="#experience">experience</a></li>
<li class="empty"></li>
<li><a href="https://www.behance.net/hadisheikh2" target="_blank">behance</a></li>
<li><a href="https://twitter.com/LeMeTinkAboutIt" target="_blank">twitter</a></li>
<li><a href="https://www.linkedin.com/in/abdul-hadi-sheikh-b5861348/" target="_blank">linkedin</a></li>
</ul>
</nav>
<header id="experience">
<div class="container text-center">
<div class="row">
<div class="col-sm">
<!--left column -->
<h1>hi, i'm<br/>abdul hadi</h1>
<ul>
<li>_Digital Marketing</li>
<li>_I can hand-code html/css based emails and static sites, portfolios</li>
<li>_Graduated from Iqra university in Karachi,Pakistan</li>
<li>_1+ years of experience</li>
<li>_Have an experience of in-house job in their digital marketing department</li>
</ul>
<a href="" class="button">add me on linkedin</a>
</div>
<div class="col-sm">
<!--right column-->
<figure>
<img src="img/sketch.jpg" class="intro-img" alt="Abdul Hadi" />
<figcaption>Sketch by Ali Hassan </figcaption>
</figure>
</div>
</div>
</div>
</header>
<section>
<ul class="skill-list">
<li>01_emails marketing</li>
<li>02_Content writing</li>
<li>03_SEO optimization</li>
<li>04_Content strategy</li>
<li>05_wireframe designs</li>
</ul>
</section>
<!-- projects -->
<!-- project 1 -->
<section class="project blue" id="projects">
<div class="container text-center">
<div class="row">
<div class="col-sm">
<!--left column -->
<figure>
<img src="img/cosmetics.jpg" alt="Cosmetics">
<figcaption class="right-alignment">My own github pages
</figcaption>
</figure>
</div>
<div class="col-sm">
<!--right column -->
<h2>I steel these images for the<br/>
sake of completing this template</h2>
<p>Lorem ipsum dolor amet sartorial quinoa 3 wolf moon, tilde neutra succulents vegan kitsch church-key vaporware. Pork belly thundercats iPhone tilde 90’s ugh. Narwhal post-ironic VHS affogato subway tile. Everyday carry copper mug art party, blue bottle normcore banh mi gastropub lomo fingerstache four dollar toast single-origin coffee hell of 3 wolf moon palo santo kinfolk.</p>
<a href="" class="button">read more</a>
</div>
</div>
</div>
</section>
<!--Project 2-->
<section class="project">
<div class="container text-center">
<div class="row">
<div class="col-sm right-alignment">
<!--left column -->
<h2>second site design<br/>
with little more info</h2>
<p>Lorem ipsum dolor amet sartorial quinoa 3 wolf moon, tilde neutra succulents vegan kitsch church-key vaporware. Pork belly thundercats iPhone tilde 90’s ugh. Narwhal post-ironic VHS affogato subway tile. Everyday carry copper mug art party, blue bottle normcore banh mi gastropub lomo fingerstache four dollar toast single-origin coffee hell of 3 wolf moon palo santo kinfolk.</p>
<a href="" class="button">read more</a>
</div>
<div class="col-sm">
<!--right column -->
<figure>
<img src="img/dashboard-app.jpg" alt="Dashboard app">
<figcaption>Photo by José Alejandro Cuffia on Unsplash
</figcaption>
</figure>
</div>
</div>
</section>
<!--Project 3-->
<section class="project blue">
<div class="container text-center">
<div class="row">
<div class="col-sm">
<!--left column -->
<figure>
<img src="img/ipad-app.jpg" alt="ipad app">
<figcaption class="right-alignment">Photo by Marek Levák on Unsplash
</figcaption>
</figure>
</div>
<div class="col-sm">
<!--left column -->
<h2>I will be putting<br/>
my email template</h2>
<p>Lorem ipsum dolor amet sartorial quinoa 3 wolf moon, tilde neutra succulents vegan kitsch church-key vaporware. Pork belly thundercats iPhone tilde 90’s ugh. Narwhal post-ironic VHS affogato subway tile. Everyday carry copper mug art party, blue bottle normcore banh mi gastropub lomo fingerstache four dollar toast single-origin coffee hell of 3 wolf moon palo santo kinfolk.</p>
<a href="" class="button">read more</a>
</div>
</div>
</div>
</section>
<footer id="contact">
<h2>any questions?
find me here [email protected]</h2>
<p>designed & developed by hadi 2023
</footer>
</body>
</html>