forked from syafiqparadisam/BlogPakpur
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
114 lines (102 loc) · 4.6 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
<DOCTYPE! html>
<html>
<head>
<title>About Me</title>
<link href="style.css" rel="stylesheet" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<style>
body {
padding: 0;
margin: 0;
}
</style>
</head>
<body>
<!-- NAVBAR-->
<header class="navbar navbar-expand-lg navbar-light shadow-sm justify-content-center">
<div class="container-fluid">
<div class="w-50 d-flex justify-content-start">
<h3 class="text-center">Pakpur Blog</h3>
</div>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-center" id="navbarNavAltMarkup">
<div class="navbar-nav w-50 d-flex flex-row justify-content-center align-items-center">
<a class="nav-link active text-center fw-bolder fs-5" aria-current="page" href="#">Home</a>
<a class="nav-link active text-center fw-bolder fs-5" aria-current="page" href="contact.html">Sosmed</a>
<a class="nav-link active text-center fw-bolder fs-5" aria-current="page" href="gallery.html">Gallery</a>
</div>
</div>
</header>
<!-- GAMBAR PAKPUR-->
<div class="d-flex py-4 justify-content-center pt-2 flex-column align-content-center w-75 m-auto">
<img src="asset/ppur.jpeg" alt="ppur" class="m-auto mt-4 text-center rounded-circle" width="300" height="300">
</div>
<!-- ARTICLE PAKPUR-->
<article class="d-flex justify-content-center py-3 align-items-center flex-wrap w-75 m-auto">
<h1 class="text-center py-4">About Me</h1>
<p class="fw-normal text-center">Halo! Saya adalah Purwanto, seorang Guru Perangkat Lunak dengan latar belakang yang
kuat
dalam dunia informatika. Saya
tumbuh dan dibesarkan di Jakarta, ibu kota Indonesia. Setelah menyelesaikan pendidikan
tinggi di Universitas Teknologi
Nusantara, saya memutuskan untuk memfokuskan karier saya dalam bidang teknologi
informasi.
Selama beberapa tahun terakhir, saya telah bekerja dengan tekun di industri perangkat
lunak,
mulai dari mengembangkan
aplikasi web hingga mengelola sistem basis data yang kompleks. Setiap tantangan dalam
dunia
perangkat lunak memberikan
peluang baru bagi saya untuk belajar dan tumbuh.
Ketika tidak sibuk dengan pekerjaan, saya menikmati waktu bersama keluarga saya. Saya
adalah
seorang suami yang bahagia
dan memiliki dua buah hati yang lucu dan cerdas. Mereka adalah sumber inspirasi utama
dalam
hidup saya.
Saya juga sangat tertarik pada pendidikan dan berbagi pengetahuan. Saya sering menjadi
pembicara tamu di berbagai acara
teknologi dan memberikan pelatihan kepada siswa-siswa muda yang berminat dalam dunia
perangkat lunak.
Dengan semangat yang tak pernah padam, saya terus berupaya untuk berkontribusi dalam
perkembangan dunia teknologi
informasi di Indonesia. Saya percaya bahwa perangkat lunak memiliki potensi besar untuk
membawa perubahan positif dalam
berbagai bidang, dan saya berkomitmen untuk menjadi bagian dari perubahan tersebut.
Terima kasih atas waktu Anda membaca "about me" saya, dan saya berharap dapat
berkolaborasi
dengan banyak orang yang
memiliki hasrat yang sama dalam dunia teknologi informasi.</p>
</article>
<!-- FOOTER -->
<footer class="d-flex justify-content-around flex-wrap align-content-center shadow-lg bg-gradient p-3">
<div class="d-flex flex-column text-center text-secondary fw-bold">
<h4>Made By</h4>
<p>Imron</p>
<p>Syafiq</p>
<p>Rafi Salman</p>
</div>
<div class="d-flex flex-column text-center text-secondary fw-bold">
<h4>About Our Teams</h4>
<p>SMK ANTARTIKA 2 SIDOARJO</p>
<p>Indonesia</p>
<p>X RPL 2</p>
</div>
<div class="d-flex flex-column text-center text-secondary">
<h4>Technologies using</h4>
<p class="text-primary fs-5 fw-bold">Bootstrap</p>
<p class="text-dark">© Copyright 2023 All Right Reserved</p>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>
</body>
<html>