-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
139 lines (139 loc) · 7.34 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=\, initial-scale=1.0" />
<title>Portfolio</title>
<link rel="stylesheet" href="assets/styles/style.css" />
<style>
@import url("https://fonts.googleapis.com/css2?family=Kaushan+Script&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap");
</style>
</head>
<body>
<!--Start Header-->
<header>
<div class="brand">
<h1>Portfolio</h1>
</div>
<nav>
<ul>
<li><a href="#">ARTICLE</a></li>
<li><a href="#">PODCAST</a></li>
<li><a href="#">PROJECT</a></li>
<li><a href="#">PROFILE</a></li>
<li><a href="#">DESIGN</a></li>
<li><a href="#">CONTACT</a></li>
</ul>
</nav>
<div class="hamburger">
<input type="checkbox">
<div class="dash"></div>
<div class="dash"></div>
<div class="dash"></div>
</div>
<div class="nav-responsive">
<ul>
<li><a href="#">ARTICLE</a></li>
<li><a href="#">PODCAST</a></li>
<li><a href="#">PROJECT</a></li>
<li><a href="#">PROFILE</a></li>
<li><a href="#">DESIGN</a></li>
<li><a href="#">CONTACT</a></li>
</ul>
</div>
</header>
<!--End Header-->
<!--Start Main-->
<main>
<article>
<h3>My Article</h3>
<!--Start Card-->
<div class="polaroid">
<h4><a href="">Introduction to My Project Portfolio</a></h4>
<img src="assets/images/Thumbnail.jpg" alt="" />
<p>
Perkenalkan namaku Zainal Arifin yang memiliki nama kecil Zainal.
Aku seorang mahasiswa jurusan teknologi informasi di salah satu
perguruan tinggi swasta yang berada di ujung pulau jawa yaitu
Universitas Ibrahimy. Aku berasal dari keluarga yang sederhana,
ayahku seorang petani yang kesehariannya berkecimpung dan
menyaksikan hamparan padi bagaikan permadani hijau yang terhampar
melintasi garis khatulistiwa. Ibuku sebagai ibu rumah tangga yang
mempersiapkan keperluan keluarga setiap harinya.
</p>
<p>
Aku seorang mahasiswa hijrah dari kampus pondok ke kota untuk
membawa impian dan wawasan kepada teman - teman mahasiswa kota.
Memperkenalkan segala budaya dan etika pondok serta menerapkannya di
kampus kota. Impianku adalah menjadi Software Engineer dan menjadi
Next Generation Bapak Homaidi dan Bapak Lukman yang telah menjadi
idola di dalam hatiku. Saat ini aku sedang mengikuti kegiatan Studi
Independent bersama mitra Dicoding Academy dalam bidang Front-end
Developer dan Back-end Developer. Aku dibimbing oleh Bapak Firman
Santoso selaku Kaprodiku di Teknologi Informasi. Disini aku belajar
tentang Hardskill, Softskill, serta wawasan yang tak pernah
kudapatkan.
</p>
<p>
Aku hanyalah seorang pemuda desa yang bermimpi setinggi bintang dan
bercita - cita bisa meneruskan pendidikan di taraf internasional
Australia. Aku sangat cinta Ibrahimy. Aku sangat cinta Salafiyah
Syafi'iyah Sukorejo. Aku sangat cinta Situbondo. Aku sangat cinta
Jawa Timur. Aku sangat cinta Indonesia nan Jaya. Tanah airku tidak
kulupakan kan terkenang selama hidupku.
</p>
</div>
<!--End Card-->
</article>
<aside id="left-wrap">
<div class="ads">
<img src="assets/images/ads.jpg" alt="" />
</div>
</aside>
<aside id="right-wrap">
<h3>Profile</h3>
<div class="profile">
<img src="assets/images/profile.jpg" alt="" />
<h5>Zainal Arifin</h5>
<p>F031XB040</p>
<ul>
<li>
<svg viewBox="0 0 16 16" width="16" height="16" class="absolute top-1 left-0">
<path fill-rule="evenodd" d="M1.5 14.25c0 .138.112.25.25.25H4v-1.25a.75.75 0 01.75-.75h2.5a.75.75 0 01.75.75v1.25h2.25a.25.25 0 00.25-.25V1.75a.25.25 0 00-.25-.25h-8.5a.25.25 0 00-.25.25v12.5zM1.75 16A1.75 1.75 0 010 14.25V1.75C0 .784.784 0 1.75 0h8.5C11.216 0 12 .784 12 1.75v12.5c0 .085-.006.168-.018.25h2.268a.25.25 0 00.25-.25V8.285a.25.25 0 00-.111-.208l-1.055-.703a.75.75 0 11.832-1.248l1.055.703c.487.325.779.871.779 1.456v5.965A1.75 1.75 0 0114.25 16h-3.5a.75.75 0 01-.197-.026c-.099.017-.2.026-.303.026h-3a.75.75 0 01-.75-.75V14h-1v1.25a.75.75 0 01-.75.75h-3zM3 3.75A.75.75 0 013.75 3h.5a.75.75 0 010 1.5h-.5A.75.75 0 013 3.75zM3.75 6a.75.75 0 000 1.5h.5a.75.75 0 000-1.5h-.5zM3 9.75A.75.75 0 013.75 9h.5a.75.75 0 010 1.5h-.5A.75.75 0 013 9.75zM7.75 9a.75.75 0 000 1.5h.5a.75.75 0 000-1.5h-.5zM7 6.75A.75.75 0 017.75 6h.5a.75.75 0 010 1.5h-.5A.75.75 0 017 6.75zM7.75 3a.75.75 0 000 1.5h.5a.75.75 0 000-1.5h-.5z"></path>
</svg>
Universitas Ibrahimy
</li>
<li>
<svg viewBox="0 0 16 16" width="16" height="16" class="absolute top-1 left-0">
<path fill-rule="evenodd" d="M11.536 3.464a5 5 0 010 7.072L8 14.07l-3.536-3.535a5 5 0 117.072-7.072v.001zm1.06 8.132a6.5 6.5 0 10-9.192 0l3.535 3.536a1.5 1.5 0 002.122 0l3.535-3.536zM8 9a2 2 0 100-4 2 2 0 000 4z"></path>
</svg>
Indonesia
</li>
<li>
<svg viewBox="0 0 16 16" width="16" height="16" class="absolute top-1 left-0">
<path fill-rule="evenodd" d="M7.693 1.066a.75.75 0 01.614 0l7.25 3.25a.75.75 0 010 1.368L13 6.831v2.794c0 1.024-.81 1.749-1.66 2.173-.893.447-2.075.702-3.34.702-.278 0-.55-.012-.816-.036a.75.75 0 01.133-1.494c.22.02.45.03.683.03 1.082 0 2.025-.221 2.67-.543.69-.345.83-.682.83-.832V7.503L8.307 8.934a.75.75 0 01-.614 0L4 7.28v1.663c.296.105.575.275.812.512.438.438.688 1.059.688 1.796v3a.75.75 0 01-.75.75h-3a.75.75 0 01-.75-.75v-3c0-.737.25-1.358.688-1.796.237-.237.516-.407.812-.512V6.606L.443 5.684a.75.75 0 010-1.368l7.25-3.25zM2.583 5L8 7.428 13.416 5 8 2.572 2.583 5zM2.5 11.25c0-.388.125-.611.25-.735a.704.704 0 01.5-.203c.19 0 .37.071.5.203.125.124.25.347.25.735v2.25H2.5v-2.25z"></path>
</svg>
Firman Santoso, M.Kom
</li>
<li>
<svg viewBox="0 0 16 16" width="16" height="16" class="absolute top-1 left-0">
<path fill-rule="evenodd" d="M5.5 3.5a2 2 0 100 4 2 2 0 000-4zM2 5.5a3.5 3.5 0 115.898 2.549 5.507 5.507 0 013.034 4.084.75.75 0 11-1.482.235 4.001 4.001 0 00-7.9 0 .75.75 0 01-1.482-.236A5.507 5.507 0 013.102 8.05 3.49 3.49 0 012 5.5zM11 4a.75.75 0 100 1.5 1.5 1.5 0 01.666 2.844.75.75 0 00-.416.672v.352a.75.75 0 00.574.73c1.2.289 2.162 1.2 2.522 2.372a.75.75 0 101.434-.44 5.01 5.01 0 00-2.56-3.012A3 3 0 0011 4z"></path>
</svg>
Iqsyal Maulana
</li>
</ul>
<button type="button" onclick="sayHello()"><a href="https://www.linkedin.com/in/elzains/">Sapa Developer</a></button>
</div>
</aside>
</main>
<!--End Main-->
<!--Start Footer-->
<footer>
<p>ZAINAL ARIFIN MSIB DICODING CYCLE 4</p>
</footer>
<!--End Footer-->
<script src="assets/styles/script.js"></script>
</body>
</html>