-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
156 lines (128 loc) · 4.9 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
152
153
154
155
156
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no">
<title>AFRIZAGILLEON | PORTFOLIO</title>
<link rel="shortcut icon" href="assets/img/moon.png">
<link href="assets/css/style_pc.css" rel="stylesheet" media="all">
<link href="assets/css/style_sp.css" rel="stylesheet" media="screen and (max-width: 599px)">
</head>
<body class="top">
<header>
<nav>
<ul>
<li><a class="link" href="assets/ResumeOfAfriza.pdf" download> DOWNLOAD RESUME</a></li>
<li><a id="menu_about" class="link" href="javascript:void(0);">ABOUT ME</a></li>
</ul>
</nav>
<div id="logo">
<a class="link" href="index.html">
<span>A</span>
<span>F</span>
<span>R</span>
<span>I</span>
<span>Z</span>
<span>A</span>
<br>
<span class="logo_tec01">G</span>
<span class="logo_tec02">I</span>
<span class="logo_tec03">L</span>
<span class="logo_tec02">L</span>
<span class="logo_tec02">E</span>
<span class="logo_tec02">O</span>
<span class="logo_tec02">N</span>
</a>
</div>
<div id="job">WEB DESIGNER</div>
<div id="cr">
MADE BY AFRIZA <br>
COPYRIGHT © 2022 <br>
ALL RIGHT DESERVED
</div>
</header>
<!-- -->
<section id="about">
<div class="about-name01">
<div class="about-name-outline"><h3>AFRIZA</h3></div>
<div class="about-name-base"><h3>AFRIZA</h3></div>
</div>
<div class="about-name02">
<div class="about-name-outline"><h3>GILLEON</h3></div>
<div class="about-name-base"><h3>GILLEON</h3></div>
</div>
<div class="about-name03">
<div class="about-name-outline"><h3>GINTING</h3></div>
<div class="about-name-base"><h3>GINTING</h3></div>
</div>
<!-- moon animation-->
<div class="about-momo">
<img class="fuwafuwa" src="assets/img/moon.png">
</div>
<div class="about-textarea">
<h3>Afriza Gilleon Ginting</h3>
<p class="about-text01">
A 12<sup>th</sup> grade student from SMK Telkom 1 Medan.
<br>
I’m designing with a minimal and beautiful design in
my mind using simple logic but tricky 😀
</p>
<p class="about-text02">
I design this website as visual my portfolio website.
<br>
I'm studying some competitive programming and try to apply it on a web design.
<br>
You can download my resume
</p>
<div class="contact">CONTACT</div>
<div class="mail"><a class="link" target="_blank" href="https://mail.google.com/mail/?view=cm&fs=1&[email protected]&body=FROM_PORTFOLIO">[email protected]</a>
</div>
<div class="sns">
<a class="link" href="https://twitter.com/afrizagilleon" target="_blank">Twitter</a> 
<a class="link" href="https://www.instagram.com/afrizagilleon" target="_blank">Instagram</a>
<a class="link" href="https://www.hackerrank.com/afriza_gilleon/" target="_blank"> Hackerrank</a>
</div>
</div>
</section>
<main class="contents">
<div class="hover-delay"></div>
<section id="cursel">
<div class="cursel-center">
<a class="link-hover link" href="detail/afriza.html">
<div class="cursel-center-tit">
<div class="cursel-center-tit-outline"><h1>AFRIZA<br>PORTFOLIO</h1></div>
<div class="cursel-center-tit-base"><h1>AFRIZA<br>PORTFOLIO</h1></div>
</div>
<div class="cursel-center-img">
<div class="cursel-center-img-before"><img src="assets/img/cooler_afrizagilleon.jpeg"></div>
<div class="cursel-center-img-after"><img src="assets/img/afrizagilleon.jpeg"></div>
</div>
</a>
</div>
<!-- -->
<div class="cursel-up">
<div class="cursel-up-tit-outline">
<h1>CHRISTOPHER<br>AWARDING AGENCY</h1>
</div>
</div>
<!-- -->
<div class="cursel-under">
<div class="cursel-under-tit-outline">
<h1>ALISHARAF<br>DIARY</h1>
</div>
</div>
<!-- -->
</section>
<section>
<div id="count"><span id="count-num">00</span><span id="slash"> ／ </span><span id="max-num">00</span></div>
</section>
</main>
<!-- My Javascript FILE -->
<script src="assets/js/top.js"></script>
<script>
// just an advice
console.log("You see the console. It means you know about program. Okay, I will give you advice. Refresh the site when you change the breakpoint or layout")
</script>
</body>
</html>