-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
256 lines (243 loc) · 12.4 KB
/
Copy pathindex.html
File metadata and controls
256 lines (243 loc) · 12.4 KB
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
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
<!DOCTYPE html>
<!-- Created By CodingNepal -->
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Amrun.dev</title>
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css"/>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/typed.js/2.0.11/typed.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.1/jquery.waypoints.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css"/>
<!-- 3D & Tech Libraries -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/vanilla-tilt/1.8.0/vanilla-tilt.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/particles.js@2.0.0/particles.min.js"></script>
</head>
<body>
<div class="scroll-up-btn">
<i class="fas fa-angle-up"></i>
</div>
<nav class="navbar">
<div class="max-width">
<div class="logo"><a href="#">Portfo<span>lio.</span></a></div>
<ul class="menu">
<li><a href="#home" class="menu-btn">Home</a></li>
<li><a href="#about" class="menu-btn">About</a></li>
<li><a href="#services" class="menu-btn">Services</a></li>
<li><a href="#skills" class="menu-btn">Skills</a></li>
<li><a href="#teams" class="menu-btn">Teams</a></li>
<li><a href="#contact" class="menu-btn">Contact</a></li>
</ul>
<div class="menu-btn">
<i class="fas fa-bars"></i>
</div>
</div>
</nav>
<!-- home section start -->
<section class="home" id="home">
<div id="particles-js"></div>
<div class="max-width" style="position: relative; z-index: 2;">
<div class="row">
<div class="home-content">
<div class="text-1">Hello, my name is</div>
<div class="text-2">Amrun Khakim</div>
<div class="text-3">And I'm a <span class="typing"></span></div>
<a href="https://wa.me/6281227883476">Hire me</a>
</div>
</div>
</div>
</section>
<!-- about section start -->
<section class="about" id="about">
<div class="max-width">
<h2 class="title">About me</h2>
<div class="about-content">
<div class="column left">
<img src="images/A.jpg" alt="">
</div>
<div class="column right">
<div class="text">Halo! Nama saya Amrun Khakim <span class="typing-2"></span></div>
<p>dan saya dengan senang hati ingin berbagi sedikit tentang diri saya. Saya adalah seorang pengembang web dengan minat khusus dalam menciptakan pengalaman online yang menarik dan fungsional. Dengan pengalaman lebih dari satu dekade di industri IT, saya telah terlibat dalam berbagai proyek yang meliputi pengembangan situs web, pemasaran media sosial, dan pembuatan konten. Saya percaya bahwa keahlian saya dalam pengembangan web dapat membantu mewujudkan visi online Anda dengan solusi yang inovatif dan terbaik. Jika Anda mencari seseorang yang berdedikasi untuk menciptakan situs web yang menarik dan efektif, saya siap membantu Anda!</p>
<a href="#">Download CV</a>
</div>
</div>
</div>
</section>
<!-- services section start -->
<section class="services" id="services">
<div class="max-width">
<h2 class="title">My services</h2>
<div class="serv-content">
<div class="card">
<div class="box">
<i class="fas fa-code"></i>
<div class="text">Web Development</div>
<p>Pengembangan web dan aplikasi adalah proses merancang, membangun, dan mengembangkan situs web dan aplikasi komputer berbasis perangkat lunak.</p>
</div>
</div>
<div class="card">
<div class="box">
<i class="fas fa-chart-line"></i>
<div class="text">Digital Marketing</div>
<p>Digital Marketing adalah serangkaian strategi dan taktik yang digunakan untuk mempromosikan produk atau layanan Anda secara online dengan tujuan meningkatkan kesadaran, menarik prospek, dan mengonversi mereka menjadi pelanggan</p>
</div>
</div>
<div class="card">
<div class="box">
<i class="fas fa-paint-brush"></i>
<div class="text">Design</div>
<p>Disan Grafis adalah sebuah penyedia layanan desain grafis yang berfokus pada memenuhi kebutuhan desain visual kreatif dan profesional untuk berbagai jenis proyek.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- skills section start -->
<section class="skills" id="skills">
<div class="max-width">
<h2 class="title">My skills</h2>
<div class="skills-content">
<div class="column left">
<div class="text">My creative skills & experiences.</div>
<p>Hello there! I'm Amrun Khakim, a passionate web developer with a flair for creativity and a decade of diverse experience across various industries. My journey in IT has been fueled by my love for crafting engaging online experiences and bringing ideas to life through innovative web solutions.
Over the years, I've honed my skills not only in web development but also in content creation and social media marketing. This blend of technical expertise and creative vision allows me to design captivating websites and tailored content that resonate with audiences and drive engagement.
Whether it's designing visually stunning interfaces, developing interactive web applications, or curating compelling content strategies, I thrive on the opportunity to blend technology with creativity to deliver impactful results. Let's collaborate and turn your ideas into digital masterpieces!</p>
<a href="#">Read more</a>
</div>
<div class="column right">
<div class="bars">
<div class="info">
<span>HTML</span>
<span>90%</span>
</div>
<div class="line html"></div>
</div>
<div class="bars">
<div class="info">
<span>CSS</span>
<span>60%</span>
</div>
<div class="line css"></div>
</div>
<div class="bars">
<div class="info">
<span>JavaScript</span>
<span>80%</span>
</div>
<div class="line js"></div>
</div>
<div class="bars">
<div class="info">
<span>PHP</span>
<span>90%</span>
</div>
<div class="line php"></div>
</div>
<div class="bars">
<div class="info">
<span>MySQL</span>
<span>70%</span>
</div>
<div class="line mysql"></div>
</div>
</div>
</div>
</div>
</section>
<!-- teams section start -->
<section class="teams" id="teams">
<div class="max-width">
<h2 class="title">My Project</h2>
<div class="carousel owl-carousel">
<div class="card">
<div class="box">
<img src="images/mandijunub.svg" alt="">
<div class="text">Mandi Junub</div>
<p>Aplikasi Kasir Dan Keuangan Cucian Motor</p>
</div>
</div>
<div class="card">
<div class="box">
<img src="images/nuansa.svg" alt="">
<div class="text">Nuansa Coding</div>
<p>Website Kursus Online</p>
</div>
</div>
<div class="card">
<div class="box">
<img src="images/silabus.svg" alt="">
<div class="text">SILABUS</div>
<p>Sistem Identifikasi Dan Layanan Aset Bagian Umum SETDA</p>
</div>
</div>
</div>
</div>
</section>
<!-- contact section start -->
<section class="contact" id="contact">
<div class="max-width">
<h2 class="title">Contact me</h2>
<div class="contact-content">
<div class="column left">
<div class="text">Get in Touch</div>
<p>Ready to start your next project or have any questions? Don't hesitate to reach out! You can contact me via email at amrunkhakim217@gmail.com or connect with me on LinkedIn for professional inquiries and collaborations.</p>
<div class="icons">
<div class="row">
<i class="fas fa-user"></i>
<div class="info">
<div class="head">Name</div>
<div class="sub-title">Amrun khakim</div>
</div>
</div>
<div class="row">
<i class="fas fa-map-marker-alt"></i>
<div class="info">
<div class="head">Address</div>
<div class="sub-title">Paninggaran Pekalongan Central Java</div>
</div>
</div>
<div class="row">
<i class="fas fa-envelope"></i>
<div class="info">
<div class="head">Email</div>
<div class="sub-title">amrunkhakim217@gmail.com</div>
</div>
</div>
</div>
</div>
<div class="column right">
<div class="text">Message me</div>
<form class="contact-form" action="#" method="POST">
<div class="fields">
<div class="field name">
<input type="text" class="fullname" placeholder="Name">
</div>
<div class="field email">
<input type="text" class="email-input" placeholder="Email">
</div>
</div>
<div class="field">
<input type="text" class="subject" placeholder="Subject">
</div>
<div class="field textarea">
<textarea class="message" cols="30" rows="10" placeholder="Message.."></textarea>
</div>
<div class="button-area">
<button class="send-msg" type="submit" name="send">Send message</button>
</div>
</form>
</div>
</div>
</div>
</section>
<!-- footer section start -->
<footer>
<span>Created By <a href="">Amrun.dev</a> | <span class="far fa-copyright"></span> 2021 All rights reserved.</span>
</footer>
<script src="script.js"></script>
</body>
</html>