-
Notifications
You must be signed in to change notification settings - Fork 0
/
aboutme.html
155 lines (151 loc) · 5.41 KB
/
aboutme.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
152
153
154
155
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>About Me</title>
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
/>
<link rel="stylesheet" href="style.css" />
</head>
<style>
main {
padding-top: 50px;
}
</style>
<body>
<!-- Navbar -->
<nav
class="navbar navbar-expand-lg navbar-light bg-light fixed-top shadow-sm"
>
<div class="container">
<a class="navbar-brand" href="#">Photography Lifestyle</a>
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarNav"
aria-controls="navbarNav"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="galery.html">Gallery</a>
</li>
<li class="nav-item">
<a class="nav-link" href="aboutme.html">About Me</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#community">Join Community</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- About Content -->
<main class="container my-5">
<div class="row">
<div class="col-lg-4">
<img
src="assets/about/jovandi.jpg"
alt="Photographer"
class="img-fluid"
style="max-width: 300px"
/>
</div>
<div class="col-lg-8">
<h1>Hello, I'm Jovandi</h1>
<p>
I am a photographer from the stunning Bangka Belitung Islands,
renowned for their captivating landscapes and rich cultural
heritage. I have committed my expertise to capturing the essence of
this tropical paradise. With a discerning eye for detail and a
passion for visual storytelling, I explore the islands' pristine
beaches, verdant forests, and distinctive geological formations,
immortalizing moments that embody the breathtaking beauty of my
homeland.
</p>
<p>
My portfolio showcases a diverse range of subjects, from serene
sunrises gracing the horizon to vibrant local traditions and
thriving marine life, with each photograph narrating its own unique
story. Through my lens, I invite audiences to engage with the rich
natural heritage and cultural richness of Bangka Belitung,
highlighting its status as a true hidden gem within Indonesia.
</p>
<!-- Social Media Icons -->
<div class="social-icons">
<a href="https://www.instagram.com/jovandi.t/" target="_blank">
<img src="assets/icon/instagram.png" alt="Instagram Logo" />
</a>
<a href="https://www.youtube.com/@jovandi.t" target="_blank">
<img src="assets/icon/youtube.png" alt="YouTube Logo" />
</a>
<a href="https://x.com/jovandi_t" target="_blank">
<img src="assets/icon/twitter.png" alt="Twitter Logo" />
</a>
<a
href="https://www.linkedin.com/in/jovandi-todana/"
target="_blank"
>
<img src="assets/icon/linkedin.png" alt="LinkedIn Logo" />
</a>
<a href="https://github.com/MrJov100" target="_blank">
<img src="assets/icon/github.png" alt="Github Logo" />
</a>
</div>
</div>
</div>
</main>
<!-- bagian Footer -->
<footer class="footer" id="community">
<div class="footer-content">
<div class="footer-section about">
<h2>Photography Lifestyle</h2>
<p>
Join me in capturing the world through the art of photography. Be
part of a community that thrives on creativity, inspiration, and the
power of imagery.
</p>
</div>
<div class="footer-section links">
<h3>Links</h3>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="galery.html">Gallery</a></li>
<li><a href="aboutme.html">About Me</a></li>
</ul>
</div>
<div class="footer-section newsletter">
<h3>Join Our Community</h3>
<p>Enter your email to stay updated:</p>
<form id="joinForm" class="newsletter-form">
<input
type="email"
id="email"
placeholder="Your email address"
required
/>
<button type="submit">Submit</button>
</form>
</div>
</div>
<div class="footer-bottom">
<p>
© 2024 Jovandi Todana. All rights reserved. <br />All photographs
displayed on this website are original works captured by me.
</p>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>