-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
127 lines (108 loc) · 6.09 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Portfolio :: Home</title>
<!--Css links-->
<link rel="stylesheet" href="style.css">
<!--font-awesome-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
<div class="container">
<div class="profile-card">
<div class="portfolio-pic">
<img src="./Image/User.png" alt="User Avtar">
</div>
<div class="profile-details">
<div class="intro">
<h2>ABC XYZ</h2>
<h4>Web Designer</h4>
<div class="social">
<a href="#"><i class="fa-brands fa-linkedin" style="color: var(--blue);"></i></a>
<a href="#"><i class="fa-brands fa-github" style="color: var(--gray);"></i></a>
<a href="#"><i class="fa-brands fa-whatsapp" style="color: var(--light-green)"></i></a>
<a href="#"><i class="fa-brands fa-instagram" style="color: var(--dark-megenta);"></i></a>
</div>
</div>
<div class="contact-info">
<div class="row">
<div class="icon">
<i class="fa fa-phone" style="color: var(--dark-megenta);"></i>
</div>
<div class="content">
<span>Phone</span>
<h5>+91 99999 88888</h5>
</div>
</div>
<div class="row">
<div class="icon">
<i class="fa-solid fa-envelope" style="color: var(--light-green);"></i>
</div>
<div class="content">
<span>Email</span>
<h5>[email protected]</h5>
</div>
</div>
<div class="row">
<div class="icon">
<i class="fa-solid fa-location-dot" style="color: var(--light-purple);"></i>
</div>
<div class="content">
<span>Location</span>
<h5>Ahmedabad,Gujrat,India</h5>
</div>
</div>
</div>
<button class="btn-download"><i class="fa-solid fa-download"></i> Download CV</button>
</div>
</div>
<!--About Section-->
<div class="about">
<h1>About Me</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Facere accusamus cumque dolor, officia minima quisquam tempora porro exercitationem earum velit eaque necessitatibus beatae nam quod, animi mollitia blanditiis eveniet aspernatur voluptates, consequatur eligendi. Beatae cumque quae, veritatis tenetur suscipit inventore repudiandae, odio consequatur, quia voluptatum magnam cupiditate rerum odit unde eum repellat expedita aperiam?.</p>
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Blanditiis repellendus voluptatibus veniam reiciendis fugit similique eaque quos nostrum quisquam. Libero soluta fugit, minima voluptates magni dignissimos praesentium. Fugit facilis perferendis officia fuga! Est iste numquam corrupti distinctio at reprehenderit, pariatur omnis quos. Laboriosam quam explicabo fugiat blanditiis quas sequi consequatur!</p>
<h2>What I Do !!!</h2>
<div class="work">
<div class="workbox">
<div class="icon">
<i class="fa-solid fa-code" style="color: var(--light-purple); font-size: 1.9rem;"></i>
</div>
<div class="desc">
<h3>Web Design</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat temporibus sed est ratione eum quia iste consequuntur labore cumque delectus!</p>
</div>
</div>
<div class="workbox">
<div class="icon">
<i class="fa-solid fa-calendar-days" style="color: var(--light-green); font-size: 1.9rem;"></i>
</div>
<div class="desc">
<h3>Web Design</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat temporibus sed est ratione eum quia iste consequuntur labore cumque delectus!</p>
</div>
</div>
<div class="workbox">
<div class="icon">
<i class="fa-solid fa-chart-simple" style="color: var(--golden); font-size: 1.9rem;"></i>
</div>
<div class="desc">
<h3>Web Design</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat temporibus sed est ratione eum quia iste consequuntur labore cumque delectus!</p>
</div>
</div>
<div class="workbox">
<div class="icon">
<i class="fa-solid fa-users" style="color: var(--dark-megenta); font-size: 1.7rem;"></i>
</div>
<div class="desc">
<h3>Web Design</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Placeat temporibus sed est ratione eum quia iste consequuntur labore cumque delectus!</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>