forked from tarunsinghofficial/HacktoberFest
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
151 lines (147 loc) · 9.31 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
148
149
150
151
<!DOCTYPE html>
<html lang="en">
<!-- Mirrored from hanifz.com/ by HTTrack Website Copier/3.x [XR&CO'2014], Fri, 23 Oct 2020 11:38:48 GMT -->
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="index, follow" />
<meta name="googlebot" content="index, follow" />
<meta property="og:type" content="article" />
<meta property="og:site_name" content="hanifzcom" />
<meta property="og:title" content="Mochammad Hanif" />
<meta property="og:image" content="img/bg.png" />
<meta property="og:description" content="Web Developer" />
<meta property="og:url" content="index.html" />
<meta property="og:image:type" content="image/jpeg" />
<meta property="og:image:width" content="650" />
<meta property="og:image:height" content="366" />
<!-- CSRF Token -->
<meta name="csrf-token" content="EylaLFIc2htfBx7w0O7tI2s3ahvgkoIJ0vBITD5e">
<title>Portfolio</title>
<!-- Styles -->
<link href="img/favicons.svg" rel="shortcut icon">
<link href="css/appf88e.css?id=6abde329e4b8fb6bdebc" rel="stylesheet">
<style>
tr>td{
padding-bottom: .6em;
}
td{
padding-left: 10px;
line-height: 1.5;
}
.years{
width: 110px;
}
@media (min-width: 768px) {
td{
padding-left: 30px;
}
.years{
width: 150px;
}
}
@media (min-width: 1024px) {
::-webkit-scrollbar {
width: 3px;
}
::-webkit-scrollbar-thumb {
background: #BBB;
}
::-webkit-scrollbar-thumb:hover {
background: #888;
}
.xxaw{
padding: 0.2px; height: 95vh;
}
.scroller{
overflow: hidden;
}
.scroller:hover{
padding-right: 2.32rem;
overflow-y: auto;
}
}
</style>
</head>
<body class="bg-gray-200 antialiased font-sans">
<div class="container lg:pl-5 lg:pr-5 mx-auto justify-center">
<div class="flex-1 lg:flex flex-warp lg:-ml-10">
<div class="flex bg-transparent order-1 lg:w-2/5 items-center justify-center h-screen sticky top-0">
<div class="w-full text-center">
<div class="text-center bg-gradient-to-tr animate-pulse from-teal-400 to-blue-500 inline-flex items-center justify-center rounded-full" style="width: 172px; height: 172px;">
</div>
<div class="absolute text-center bg-transparent inline-flex items-center justify-center rounded-full" style="margin-left: -10.709rem; margin-top: 0.04rem; width: 171px; height: 171px;">
<div class="text-center bg-gray-200 inline-flex items-center justify-center rounded-full" style="width: 160px; height: 160px;">
<div class="inline rounded-full animate-none" style="background-image:url('https://www.kirkland.com/-/media/professionals/m/macarol-guy.jpg'); width: 150px; height: 150px; background-size: cover;">
</div>
</div>
</div>
<div class="text-center text-3xl font-extrabold leading-none tracking-tight mt-3">
<span class="bg-clip-text text-transparent bg-gradient-to-r from-teal-400 to-blue-500 animate-pulse">
Mochammad Hanif
</span>
</div>
<div class="text-center text-xl md:text-2xl font-bold leading-none tracking-tight mt-3 mb-3">
<span class="text-gray-600">
Web Developer
</span>
</div>
<div style="position: absolute; text-align: center; left:0; right:0; bottom:15vh;">
<svg xmlns="http:https://www.w3.org/2000/svg" class="lg:hidden block inline-flex items-center animate-bounce w-6 h-6 text-gray-900" style="width: 1.5rem; height: 1.5rem;" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 11l7-7 7 7M5 19l7-7 7 7" />
</svg>
</div>
<p style="position: absolute; text-align: center; left:0; right:0;" class="bottom-2 text-gray-600 text-xs">built with laravel v8.5.0 ❤️ tailwindcss</p>
</div>
</div>
<div class="flex-1 lg:flex lg:w-2/4 order-2 items-center justify-center sticky top-0">
<div class="w-full bg-white text-gray-900 border border-gray-500 rounded-sm shadow-2xl h-full xxaw">
<div class="scroller h-full p-5 md:p-10">
<div class="text-center font-extrabold leading-none tracking-wider mb-12 mt-20">
<span id="hanifzcom20" class="rounded-full change text-white px-2 py-2 font-mono text-xl md:text-2xl capitalize bg-gradient-to-r from-teal-400 to-blue-500">contact me</span>
</div>
<form class="w-full" method="POST">
<input type="hidden" name="_token" value="EylaLFIc2htfBx7w0O7tI2s3ahvgkoIJ0vBITD5e"> <div class="flex flex-wrap -mx-3 mb-6">
<div class="transition duration-500 ease-in-out transform hover:-translate-y-1 hover:scale-105 w-full md:w-1/2 px-3 mb-6 md:mb-0">
<label id="hanifzcom21" class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-full-name">
Name
</label>
<input name="name" class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white" id="grid-full-name" type="text" placeholder="Mine">
</div>
<div class="transition duration-500 ease-in-out transform hover:-translate-y-1 hover:scale-105 w-full md:w-1/2 px-3">
<label id="hanifzcom22" class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-email">
Email
</label>
<input name="email" class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 leading-tight focus:outline-none focus:bg-white focus:border-gray-500" id="grid-email" type="email" placeholder="[email protected]">
</div>
</div>
<div class="flex flex-wrap -mx-3 mb-6">
<div class="transition duration-500 ease-in-out transform hover:-translate-y-1 hover:scale-105 w-full px-3">
<label id="hanifzcom23" class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-subject">
subject
</label>
<input name="subject" class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500" id="grid-subject" type="text" placeholder="Hi">
</div>
</div>
<div class="flex flex-wrap -mx-3 mb-6">
<div class="transition duration-500 ease-in-out transform hover:-translate-y-1 hover:scale-105 w-full px-3">
<label id="hanifzcom24" class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2" for="grid-message">
Message
</label>
<textarea id="grid-message" class="appearance-none block w-full bg-gray-200 text-gray-700 border border-gray-200 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white focus:border-gray-500" name="message" id="message" rows="5" placeholder="Text"></textarea>
</div>
</div>
<button class="transition duration-500 ease-in-out transform hover:-translate-y-1 hover:scale-110 bg-blue-500 hover:bg-blue-600 text-gray-200 font-bold py-2 px-4 rounded inline-flex items-center mb-2 lg:mb-0">
<span id="hanifzcom25">Send</span>
</button>
</form>
</div>
</div>
</div>
</div>
</div>
</body>
<!-- Mirrored from hanifz.com/ by HTTrack Website Copier/3.x [XR&CO'2014], Fri, 23 Oct 2020 11:38:49 GMT -->
</html>