forked from Diptenusarkar/Website-Template
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
138 lines (130 loc) · 6.38 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
<!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>Portfolio</title>
<link rel="stylesheet" href="main.css" >
<script src="https://kit.fontawesome.com/820ff1e752.js" crossorigin="anonymous"></script>
</head>
<body class="body transform">
<nav class="navbar">
<input type="button" class="button" onclick="toggleTheme()" id="button" value="Day / Night"></input>
<i class="fa-solid fa-code"><span> User-Centric Button !</span></i>
</nav>
<div class="all">
<div class="imgcontainer">
<div class="text">
<div class="first" id=first>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure repellendus minima laboriosam ipsum vitae, deserunt modi minus dolore explicabo nostrum?
</p>
<div class="second" id="second">
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Perferendis ipsa deleniti laudantium quasi fuga beatae doloribus ratione veniam tempora nihil.
</p>
</div>
</div>
<div class="img">
<img src="book.png" class="img" alt="Igor " width="400px" />
</div>
</div>
</div>
<div class="rest">
<div class="hire night">
<h2>Who am i ?</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Pariatur quibusdam cumque voluptates delectus laborum ab officiis cum voluptate nesciunt dolorum obcaecati nulla totam repellat quasi quo necessitatibus, omnis accusamus animi eos! Expedita nemo vel voluptatibus aliquam voluptatum, omnis eligendi, laudantium, illum magnam ducimus repellendus reiciendis molestias culpa impedit aliquid suscipit.
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Iste ab expedita officia voluptate magnam laudantium non ipsum dignissimos quam blanditiis!
</p>
<h2>Why to hire me ?</h2>
<p>
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Iste, fugiat beatae quos sit id ea maiores quasi minima nemo quam quibusdam.
Veniam sapiente dolores quod pariatur aperiam temporibus excepturi perferendis ipsa numquam praesentium libero laudantium eligendi, ducimus quae fuga rem?
</p>
</div>
<div class="specials night">
<h2>Lorem ipsum:</h2>
<h3>Web design:</h3>
<p>
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Modi, illo ex ipsum, quo quibusdam quia quis atque temporibus voluptatibus in fugit pariatur ipsam consequuntur quasi.
</p>
<h3>Lorem ipsum:</h3>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Officiis laboriosam molestiae repudiandae aliquid, assumenda illum! Consequuntur quibusdam, atque maxime tempore optio illo necessitatibus fugit incidunt mollitia nihil numquam
doloribus non vel maiores dolor laboriosam reprehenderit ipsa at, dicta odit itaque. Doloribus ipsum dignissimos ea excepturi repellat natus aliquam rem non maxime animi, in architecto suscipit optio et ullam nostrum iure.
</p>
<div class="work">
<h2>My work:</h2>
<p><a class="night link" href="hhttps://github.com" target="_blank">Lorem Github <i class="fas fa-external-link-alt"></i></a></p>
<p><a class="night link" href="https://github.com" target="_blank">Lorem Github <i class="fas fa-external-link-alt"></i></a></p>
</div>
<div class="techno">
<h2>Technologies:</h2>
<p>
<a class="logotechno" href="https://developer.mozilla.org/en-US/docs/Web/HTML" target="_blank"><img src="html.png" alt="HTML logo" width="50px"></a>
<a class="logotechno" href="https://developer.mozilla.org/en-US/docs/Web/CSS" target="_blank"><img src="css-3.png" alt="HTML logo" width="50px"></a>
<a class="logotechno" href="https://developer.mozilla.org/en-US/docs/Web/JavaScript" target="_blank"><img src="java-script.png" alt="HTML logo" width="50px"></a>
</p>
</div>
</div>
<div class="form night">
<h2>Contact</h2>
<form action="mailto:[email protected]">
<label for="fname">First Name</label>
<input
type="text"
id="fname"
name="firstname" reqired
placeholder="Your name.."
/>
<label for="lname">Last Name</label>
<input
type="text"
id="lname"
name="lastname"
placeholder="Your last name.."
/>
<label for="lname">email</label>
<input
type="text"
id="email"
name="email"
placeholder="Your email here (required)" required
/>
<label for="country">Country</label>
<select id="country" name="country">
<option value="austria">Austria</option>
<option value="france">France</option>
<option value="germany">Germany</option>
<option value="italy">Italy</option>
<option value="spain">Spain</option>
<option value="unitedkingdom">United Kingdom</option>
</select>
<label for="subject">Subject</label>
<textarea
id="subject"
name="subject"
placeholder="Write something.."
style="height: 200px"
></textarea>
<input type="submit" value="Submit" />
</form>
<div class="check">
<h2>Check me:</h2>
<a href="https://github.com" target="_blank">
<img src="github-logo.png" alt="github logo" width="50px"> </a>
<a href="https://www.linkedin.com" target="_blank"><img src="linkedin.png" alt="linked in logo" width="50px"></a>
</div>
</div>
</div>
</div>
<script src="script.js"></script>
<footer class="footer">
<div class="footerContainer">
<p class="copyright">© Copyright Lorem Ipsum <script>document.write(new Date().getFullYear());</script></p>
</div>
</footer>
</body>
</html>