forked from cats0713/ah
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
221 lines (205 loc) · 27.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
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
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.6.0/gsap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.6.0/ScrollTrigger.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%22256%22 height=%22256%22 viewBox=%220 0 100 100%22><text x=%2250%%22 y=%2250%%22 dominant-baseline=%22central%22 text-anchor=%22middle%22 font-size=%2290%22>💫</text></svg>" />
<link rel="stylesheet" href="./index.css">
<script src="./index.js"></script>
<title>아현's portfolio</title>
</head>
<body>
<nav>
</nav>
<section class="endPage">
<div class="ah_info">
<div class="endPlanet">
<img src="./IMG/planet/end.svg" alt="행성">
</div>
<div></div>
</div>
</section>
<section></section>
<section></section>
<section></section>
<section></section>
<section class="infoProjectPage">
<div class="info">
</div>
<div class="ororaBox">
<img class="starback" src="./IMG/back/orora1.svg" alt="별">
<img class="starback" src="./IMG/back/orora2.svg" alt="별">
<div class="dropstar1"></div>
<div class="dropstar2"></div>
<div class="dropstar3"></div>
<div class="dropstar4"></div>
<div class="dropstar5"></div>
<div class="planet1"></div>
<div class="planet2"></div>
<div class="planet3"></div>
<div class="planet4"></div>
<div class="planet5"></div>
<div class="planet6"></div>
</div>
</section>
<section class="stackPage">
<div class="planetBox2">
<img class="starImg" src="./IMG/star/starback1.svg" alt="달">
<img class="planet" src="./IMG/deco/planet5.svg" alt="행성">
<div class="nodejsPlanet">
<div class="nodeBox">
<img class="nodejsFlagImg" src="./IMG/deco/Flag.svg" alt="깃발">
<svg role="img" fill="#fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Node.js</title><path d="M11.998,24c-0.321,0-0.641-0.084-0.922-0.247l-2.936-1.737c-0.438-0.245-0.224-0.332-0.08-0.383 c0.585-0.203,0.703-0.25,1.328-0.604c0.065-0.037,0.151-0.023,0.218,0.017l2.256,1.339c0.082,0.045,0.197,0.045,0.272,0l8.795-5.076 c0.082-0.047,0.134-0.141,0.134-0.238V6.921c0-0.099-0.053-0.192-0.137-0.242l-8.791-5.072c-0.081-0.047-0.189-0.047-0.271,0 L3.075,6.68C2.99,6.729,2.936,6.825,2.936,6.921v10.15c0,0.097,0.054,0.189,0.139,0.235l2.409,1.392 c1.307,0.654,2.108-0.116,2.108-0.89V7.787c0-0.142,0.114-0.253,0.256-0.253h1.115c0.139,0,0.255,0.112,0.255,0.253v10.021 c0,1.745-0.95,2.745-2.604,2.745c-0.508,0-0.909,0-2.026-0.551L2.28,18.675c-0.57-0.329-0.922-0.945-0.922-1.604V6.921 c0-0.659,0.353-1.275,0.922-1.603l8.795-5.082c0.557-0.315,1.296-0.315,1.848,0l8.794,5.082c0.57,0.329,0.924,0.944,0.924,1.603 v10.15c0,0.659-0.354,1.273-0.924,1.604l-8.794,5.078C12.643,23.916,12.324,24,11.998,24z M19.099,13.993 c0-1.9-1.284-2.406-3.987-2.763c-2.731-0.361-3.009-0.548-3.009-1.187c0-0.528,0.235-1.233,2.258-1.233 c1.807,0,2.473,0.389,2.747,1.607c0.024,0.115,0.129,0.199,0.247,0.199h1.141c0.071,0,0.138-0.031,0.186-0.081 c0.048-0.054,0.074-0.123,0.067-0.196c-0.177-2.098-1.571-3.076-4.388-3.076c-2.508,0-4.004,1.058-4.004,2.833 c0,1.925,1.488,2.457,3.895,2.695c2.88,0.282,3.103,0.703,3.103,1.269c0,0.983-0.789,1.402-2.642,1.402 c-2.327,0-2.839-0.584-3.011-1.742c-0.02-0.124-0.126-0.215-0.253-0.215h-1.137c-0.141,0-0.254,0.112-0.254,0.253 c0,1.482,0.806,3.248,4.655,3.248C17.501,17.007,19.099,15.91,19.099,13.993z"/></svg>
<h1 class="cssH1" >80%</h1>
</div>
<div class="express">
<svg role="img" fill="#fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Express</title><path d="M24 18.588a1.529 1.529 0 01-1.895-.72l-3.45-4.771-.5-.667-4.003 5.444a1.466 1.466 0 01-1.802.708l5.158-6.92-4.798-6.251a1.595 1.595 0 011.9.666l3.576 4.83 3.596-4.81a1.435 1.435 0 011.788-.668L21.708 7.9l-2.522 3.283a.666.666 0 000 .994l4.804 6.412zM.002 11.576l.42-2.075c1.154-4.103 5.858-5.81 9.094-3.27 1.895 1.489 2.368 3.597 2.275 5.973H1.116C.943 16.447 4.005 19.009 7.92 17.7a4.078 4.078 0 002.582-2.876c.207-.666.548-.78 1.174-.588a5.417 5.417 0 01-2.589 3.957 6.272 6.272 0 01-7.306-.933 6.575 6.575 0 01-1.64-3.858c0-.235-.08-.455-.134-.666A88.33 88.33 0 010 11.577zm1.127-.286h9.654c-.06-3.076-2.001-5.258-4.59-5.278-2.882-.04-4.944 2.094-5.071 5.264z"/></svg>
<img src="./IMG/deco/planet3.svg" alt="행성">
<h1>80%</h1>
</div>
</div>
<div class="jsPlanet">
<div class="jsBox">
<svg role="img" fill="#fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>JavaScript</title><path d="M0 0h24v24H0V0zm22.034 18.276c-.175-1.095-.888-2.015-3.003-2.873-.736-.345-1.554-.585-1.797-1.14-.091-.33-.105-.51-.046-.705.15-.646.915-.84 1.515-.66.39.12.75.42.976.9 1.034-.676 1.034-.676 1.755-1.125-.27-.42-.404-.601-.586-.78-.63-.705-1.469-1.065-2.834-1.034l-.705.089c-.676.165-1.32.525-1.71 1.005-1.14 1.291-.811 3.541.569 4.471 1.365 1.02 3.361 1.244 3.616 2.205.24 1.17-.87 1.545-1.966 1.41-.811-.18-1.26-.586-1.755-1.336l-1.83 1.051c.21.48.45.689.81 1.109 1.74 1.756 6.09 1.666 6.871-1.004.029-.09.24-.705.074-1.65l.046.067zm-8.983-7.245h-2.248c0 1.938-.009 3.864-.009 5.805 0 1.232.063 2.363-.138 2.711-.33.689-1.18.601-1.566.48-.396-.196-.597-.466-.83-.855-.063-.105-.11-.196-.127-.196l-1.825 1.125c.305.63.75 1.172 1.324 1.517.855.51 2.004.675 3.207.405.783-.226 1.458-.691 1.811-1.411.51-.93.402-2.07.397-3.346.012-2.054 0-4.109 0-6.179l.004-.056z"/></svg>
<img class="jsFlagImg" src="./IMG/deco/Flag.svg" alt="깃발">
<h1 class="cssH1" >90%</h1>
</div>
<div class="jqueryBox">
<img src="./IMG/deco/planet4.svg" alt="행성">
<svg role="img" fill="#fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>jQuery</title><path d="M1.525 5.87c-2.126 3.054-1.862 7.026-.237 10.269.037.079.078.154.118.229.023.052.049.1.077.15.013.027.031.056.047.082.026.052.054.102.081.152l.157.266c.03.049.057.097.09.146.056.094.12.187.178.281.026.04.05.078.079.117a6.368 6.368 0 00.31.445c.078.107.156.211.24.315.027.038.058.076.086.115l.22.269c.028.03.055.067.084.099.098.118.202.233.306.35l.005.006a3.134 3.134 0 00.425.44c.08.083.16.165.245.245l.101.097c.111.105.223.209.34.309.002 0 .003.002.005.003l.057.05c.102.089.205.178.31.26l.125.105c.085.068.174.133.26.2l.137.105c.093.07.192.139.287.207.035.025.07.05.106.073l.03.023.28.185.12.08c.148.094.294.184.44.272.041.02.084.044.123.068.108.062.22.125.329.183.06.034.122.063.184.094.075.042.153.083.234.125a.324.324 0 01.056.023c.033.015.064.031.096.047.12.06.245.118.375.175.024.01.05.02.076.034.144.063.289.123.438.182.034.01.07.027.105.04.135.051.274.103.411.152l.05.018c.154.052.305.102.46.15.036.01.073.023.111.033.16.048.314.105.474.137 10.273 1.872 13.258-6.177 13.258-6.177-2.508 3.266-6.958 4.127-11.174 3.169-.156-.036-.312-.086-.47-.132a13.539 13.539 0 01-.567-.182l-.062-.024c-.136-.046-.267-.097-.4-.148a1.615 1.615 0 00-.11-.04c-.148-.06-.29-.121-.433-.184-.031-.01-.057-.024-.088-.036a23.44 23.44 0 01-.362-.17 1.485 1.485 0 01-.106-.052c-.094-.044-.188-.095-.28-.143a3.947 3.947 0 01-.187-.096c-.114-.06-.227-.125-.34-.187-.034-.024-.073-.044-.112-.066a15.922 15.922 0 01-.439-.27 2.107 2.107 0 01-.118-.078 6.01 6.01 0 01-.312-.207c-.035-.023-.067-.048-.103-.073a9.553 9.553 0 01-.295-.212c-.042-.034-.087-.066-.132-.1-.088-.07-.177-.135-.265-.208l-.118-.095a10.593 10.593 0 01-.335-.28.258.258 0 00-.037-.031l-.347-.316-.1-.094c-.082-.084-.166-.164-.25-.246l-.098-.1a9.081 9.081 0 01-.309-.323l-.015-.016c-.106-.116-.21-.235-.313-.355-.027-.03-.053-.064-.08-.097l-.227-.277a21.275 21.275 0 01-.34-.449C2.152 11.79 1.306 7.384 3.177 3.771m4.943-.473c-1.54 2.211-1.454 5.169-.254 7.508a9.111 9.111 0 00.678 1.133c.23.33.484.721.793.988.107.122.223.24.344.36l.09.09c.114.11.232.217.35.325l.016.013a9.867 9.867 0 00.414.342c.034.023.063.05.096.073.14.108.282.212.428.316l.015.009c.062.045.128.086.198.13.028.018.06.042.09.06.106.068.21.132.318.197.017.007.032.016.048.023.09.055.188.108.282.157.033.02.065.035.1.054.066.033.132.068.197.102l.032.014c.135.067.273.129.408.19.034.014.063.025.092.039.111.048.224.094.336.137.05.017.097.037.144.052.102.038.21.073.31.108l.14.045c.147.045.295.104.449.13C22.164 17.206 24 11.098 24 11.098c-1.653 2.38-4.852 3.513-8.261 2.628a8.04 8.04 0 01-.449-.13c-.048-.014-.09-.029-.136-.043-.104-.036-.211-.07-.312-.109l-.144-.054c-.113-.045-.227-.087-.336-.135-.034-.015-.065-.025-.091-.04-.14-.063-.281-.125-.418-.192l-.206-.107-.119-.06a5.673 5.673 0 01-.265-.15.62.62 0 01-.062-.035c-.106-.066-.217-.13-.318-.198-.034-.019-.065-.042-.097-.062l-.208-.136c-.144-.1-.285-.208-.428-.313-.032-.029-.063-.053-.094-.079-1.499-1.178-2.681-2.79-3.242-4.613-.59-1.897-.46-4.023.56-5.75m4.292-.147c-.909 1.334-.996 2.99-.37 4.46.665 1.563 2.024 2.79 3.608 3.37.065.025.128.046.196.07l.088.027c.092.03.185.063.28.084 4.381.845 5.567-2.25 5.886-2.704-1.043 1.498-2.792 1.857-4.938 1.335a4.85 4.85 0 01-.516-.16 6.352 6.352 0 01-.618-.254 6.53 6.53 0 01-1.082-.66c-1.922-1.457-3.113-4.236-1.859-6.5"/></svg>
<h1>80%</h1>
</div>
</div>
</div>
<div class="planetBox">
<img class="starImg" src="./IMG/star/starback3.svg" alt="달">
<img class="planet" src="./IMG/deco/planet6.svg" alt="행성">
<div class="cssPlanet">
<div class="scssBox">
<img class="scssImg" src="./IMG/deco/planet7.svg" alt="행성">
<svg role="img" fill="#fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Sass</title><path d="M12 0c6.627 0 12 5.373 12 12s-5.373 12-12 12S0 18.627 0 12 5.373 0 12 0zM9.615 15.998c.175.645.156 1.248-.024 1.792l-.065.18c-.024.061-.052.12-.078.176-.14.29-.326.56-.555.81-.698.759-1.672 1.047-2.09.805-.45-.262-.226-1.335.584-2.19.871-.918 2.12-1.509 2.12-1.509v-.003l.108-.061zm9.911-10.861c-.542-2.133-4.077-2.834-7.422-1.645-1.989.707-4.144 1.818-5.693 3.267C4.568 8.48 4.275 9.98 4.396 10.607c.427 2.211 3.457 3.657 4.703 4.73v.006c-.367.18-3.056 1.529-3.686 2.925-.675 1.47.105 2.521.615 2.655 1.575.436 3.195-.36 4.065-1.649.84-1.261.766-2.881.404-3.676.496-.135 1.08-.195 1.83-.104 2.101.24 2.521 1.56 2.43 2.1-.09.539-.523.854-.674.944-.15.091-.195.12-.181.181.015.09.091.09.21.075.165-.03 1.096-.45 1.141-1.471.045-1.29-1.186-2.729-3.375-2.7-.9.016-1.471.091-1.875.256-.03-.045-.061-.075-.105-.105-1.35-1.455-3.855-2.475-3.75-4.41.03-.705.285-2.564 4.8-4.814 3.705-1.846 6.661-1.335 7.171-.21.733 1.604-1.576 4.59-5.431 5.024-1.47.165-2.235-.404-2.431-.615-.209-.225-.239-.24-.314-.194-.12.06-.045.255 0 .375.12.3.585.825 1.396 1.095.704.225 2.43.359 4.5-.45 2.324-.899 4.139-3.405 3.614-5.505l.073.067z"/></svg>
<h1>90%</h1>
<!-- <p>scss</p> -->
</div>
<div class="cssBox">
<svg class="cssSvg" role="img" fill="#fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>CSS3</title><path d="M1.5 0h21l-1.91 21.563L11.977 24l-8.565-2.438L1.5 0zm17.09 4.413L5.41 4.41l.213 2.622 10.125.002-.255 2.716h-6.64l.24 2.573h6.182l-.366 3.523-2.91.804-2.956-.81-.188-2.11h-2.61l.29 3.855L12 19.288l5.373-1.53L18.59 4.414z"/></svg>
<img class="cssFlagImg" src="./IMG/deco/Flag.svg" alt="깃발">
<h1 class="cssH1" >90%</h1>
</div>
</div>
<div class="htmlPlanet">
<div class="pugBox">
<img src="./IMG/deco/planet8.svg" alt="행성">
<svg fill="#fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Pug</title><path d="M12.0938 4.6358c-2.0663 0-3.6817.204-4.9221.5704a6.4511 6.4511 0 0 0 .0918-.084c.0374-.0375-.0507-.0625-.2285-.0684-.5335-.0175-1.8672.1436-2.9904.7051-1.273.599-4.118 3.7446-4.0432 3.9318.075.1872 1.4594 1.3458 1.8712 1.795.2621.2995 1.0485 2.9592 1.7599 2.51.189-.131.2656-.651.33-1.2931.0582.4975.1155 1.013.1934 1.4805.1123.7488 1.087 1.3474 1.1993 2.0587.1391 1.0138.7614 1.7234 1.9805 2.174.4847.6681 1.2382.3299 1.801.6347.8984.4867 1.9091.2617 2.92.2617 1.0108 0 1.984.186 2.92-.3007.576-.2995 1.32.0311 1.8087-.5802 1.2254-.4494 1.8319-1.1633 1.9727-2.1895.1123-.7113 1.0479-1.3099 1.1602-2.0587.0633-.3799.1102-.802.1582-1.2032.0568.4994.13.9042.291 1.0157.674.4493 1.4978-2.2104 1.7599-2.5099.4118-.4492 1.7963-1.6078 1.8712-1.795.0748-.1872-2.8074-3.3327-4.0803-3.9318-1.1231-.5615-2.4568-.7226-2.9903-.705-.167.0054-.2454.0287-.2247.0624-1.1748-.308-2.6728-.4805-4.6095-.4805zm.0293.5c2.2035 0 3.8486.2253 5.01.6153.1335.0449.2387.098.3593.1465.6901.715 1.6233 1.831 2.0138 3.1173.0246.081.0405.1658.0625.248.0003.0013-.0003.0028 0 .004v.0039c.0453.77.3158 1.4169.2305 1.9903-.1536.9982-.2285 1.9726-.373 2.84l-.002.0039v.0039c-.0289.1922-.218.4762-.4786.8067-.2606.3305-.5955.7024-.6817 1.248v.006l-.0019.0038c-.1006.733-.4207 1.1997-1.17 1.5821.1252-.4447.2051-1.055.2051-1.963.0374-1.1231.0766-1.5722-.8594-2.6954-.7184-.9236-1.704-1.5746-2.793-1.8985-.1111-.3899-.7217-.836-1.551-.836-.8285 0-1.4147.422-1.5352.8204-1.1098.3182-2.116.9759-2.8458 1.9141-.936 1.1232-.8594 1.6097-.8594 2.6955 0 .9037.0795 1.5135.2031 1.961-.7697-.385-1.1078-.857-1.207-1.5802v-.0097c-.0875-.5541-.4371-.9235-.7071-1.254-.27-.3305-.4626-.6166-.4903-.8008l-.002-.004v-.0038c-.1444-.8669-.2196-1.8406-.373-2.838v-.002c-.0853-.5734.1833-1.2203.2285-1.9903v.0156c.0131-.1437.0173-.241.0254-.371.3604-1.1587 1.1531-2.1726 1.8048-2.8752a6.4135 6.4135 0 0 1 .7246-.289c1.1921-.3916 2.8593-.6153 5.0628-.6153zm-5.2092 3.805a1.6473 1.6473 0 0 0-1.6349 1.6484 1.6473 1.6473 0 0 0 1.6485 1.6466 1.6473 1.6473 0 0 0 .4415-.0606c.3487-.3747.7177-.7223 1.1113-1.041a1.6473 1.6473 0 0 0 .0938-.545 1.6473 1.6473 0 0 0-1.6466-1.6485 1.6473 1.6473 0 0 0-.0136 0zm10.2973 0a1.6473 1.6473 0 0 0-1.6368 1.6484 1.6473 1.6473 0 0 0 .1504.6836c.3125.2642.611.547.8945.8477a1.6473 1.6473 0 0 0 .6036.1153 1.6473 1.6473 0 0 0 1.6465-1.6466 1.6473 1.6473 0 0 0-1.6465-1.6485 1.6473 1.6473 0 0 0-.0117 0zm-9.8715.4863a.4118.4118 0 0 1 .4101.412.4118.4118 0 0 1-.4101.4122.4118.4118 0 0 1-.4122-.4121.4118.4118 0 0 1 .4122-.4121zm9.471 0a.4118.4118 0 0 1 .4122.412.4118.4118 0 0 1-.4121.4122.4118.4118 0 0 1-.4122-.4121.4118.4118 0 0 1 .4122-.4121zm-5.1095 1.4863a.1498.2995 17.23 0 1 .0293.004.1498.2995 17.23 0 1 .0547.33.1498.2995 17.23 0 1-.2325.2422.1498.2995 17.23 0 1-.0527-.33.1498.2995 17.23 0 1 .2012-.2462zm.6719.0215a.2995.1498 75.54 0 1 .205.254.2995.1498 75.54 0 1-.0703.328.2995.1498 75.54 0 1-.2207-.2519.2995.1498 75.54 0 1 .0703-.3281.2995.1498 75.54 0 1 .0157-.002zm-.3164.4766s.0358.226.1855.3008c.1498.0749.8614-.1504.8614-.1504-.337.262-.9727.263-.9727.338v.373c0 .4079.0263 1.4614-.0313 1.6856.8238.0045 2.09 1.1255 2.09 2.508v.0741c-.0375-1.3478-1.6091-2.4337-2.0958-2.4337-.4867 0-2.0603 1.0485-2.0978 2.4337v-.0742c0-1.3626 1.2326-2.47 2.0567-2.506-.0704-.5517-.0722-1.1372-.0722-1.6875v-.373c-.2145-.0954-.4322-.1714-.6563-.2364.1846.0326.371.0488.545.0488.1497-.0749.1875-.3008.1875-.3008zm-3.0412 1.3477a.1498.1498 0 0 1 .0078 0 .1498.1498 0 0 1 .1504.1504.1498.1498 0 0 1-.1504.1504.1498.1498 0 0 1-.1504-.1504.1498.1498 0 0 1 .1426-.1504zm1.1231 0a.1498.1498 0 0 1 .0078 0 .1498.1498 0 0 1 .1504.1504.1498.1498 0 0 1-.1504.1504.1498.1498 0 0 1-.1504-.1504.1498.1498 0 0 1 .1426-.1504zm3.67 0a.1498.1498 0 0 1 .0079 0 .1498.1498 0 0 1 .1504.1504.1498.1498 0 0 1-.1504.1504.1498.1498 0 0 1-.1504-.1504.1498.1498 0 0 1 .1426-.1504zm1.1232 0a.1498.1498 0 0 1 .0078 0 .1498.1498 0 0 1 .1504.1504.1498.1498 0 0 1-.1504.1504.1498.1498 0 0 1-.1504-.1504.1498.1498 0 0 1 .1426-.1504zm-5.6526.8985a.1498.1498 0 0 1 .0078 0 .1498.1498 0 0 1 .1484.1504.1498.1498 0 0 1-.1484.1504.1498.1498 0 0 1-.1504-.1504.1498.1498 0 0 1 .1426-.1504zm5.3908 0a.1498.1498 0 0 1 .006 0 .1498.1498 0 0 1 .1503.1504.1498.1498 0 0 1-.1504.1504.1498.1498 0 0 1-.1484-.1504.1498.1498 0 0 1 .1425-.1504Z"/></svg>
<h1>70%</h1>
</div>
<div class="htmlBox">
<img class="htmlFlagImg" src="./IMG/deco/Flag.svg" alt="깃발">
<svg role="img" fill="#fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>HTML5</title><path d="M1.5 0h21l-1.91 21.563L11.977 24l-8.564-2.438L1.5 0zm7.031 9.75l-.232-2.718 10.059.003.23-2.622L5.412 4.41l.698 8.01h9.126l-.326 3.426-2.91.804-2.955-.81-.188-2.11H6.248l.33 4.171L12 19.351l5.379-1.443.744-8.157H8.531z"/></svg>
<h1>90%</h1>
</div>
</div>
</div>
<div class="moonBox">
<div class="blockBox"></div>
<h1 class="techText">저의 Tech Stack은 이렇습니다. </h1>
<img class="starImg" src="./IMG/star/starback2.svg" alt="달">
<img class="satelliteImg" src="./IMG/deco/satellite.svg" alt="행성">
<div class="moonPlanet">
<img class="rabbitImg" src="./IMG/planet/rabbit.svg" alt="토끼">
</div>
</div>
</section>
<section class="introPage">
<div class="cloudBox">
<img class="backgroundStar" src="./IMG/star/starback1.svg" alt="별">
<img class="airplane" src="./IMG/deco/airplane.svg" alt="비행기">
<div class="cloudBack1">
<img src="./IMG/cluod/c1.svg" alt="구름">
<div class="c1"></div>
<div class="c2"></div>
</div>
<div class="cloudBack2">
<img src="./IMG/cluod/c2.svg" alt="구름">
<div class="c1"></div>
<div class="c2"></div>
</div>
</div>
<div class="introBox">
<div class="sunBox"></div>
<div class="hi_ah">
<div id="imgBox" class="imgBox">
<img src="./IMG/ah.jpg" alt="아현프로필사진">
</div>
<div class="textBox">
<h1>안녕하세요 개발자 유아현 입니다.</h1>
<p>세상에는 다양한 개발자들이 있죠<br>그중에서 빛나는 별이 되고싶은 개발자입니다.</p>
<p></p>
</div>
</div>
<div class="birdBox">
<img class="bird" src="./IMG/deco/bird.svg" alt="새">
<img class="bird2" src="./IMG/deco/bird.svg" alt="새">
<img class="bird3" src="./IMG/deco/bird.svg" alt="새">
<img class="bird4" src="./IMG/deco/bird.svg" alt="새">
<img class="bird5" src="./IMG/deco/bird.svg" alt="새">
</div>
</div>
<div class="mountainBox">
<div class="introGuidance">
<i class="xi-long-arrow-up"></i>
<h1>위로 드래그 해주세요</h1>
<h2>This is the portfolio website</h2>
</div>
<img src="./IMG/mountain/mountain2.svg" alt="산">
</div>
</section>
<!-- <div> //행성
<svg viewBox="0 0 800 500" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" id="blobSvg">
<g transform="translate(149.38274383544922, -0.23298263549804688)">
<defs>
<clipPath id="shape">
<path class="blob" d="M488,297Q476,344,446,380Q416,416,376,437.5Q336,459,293,471.5Q250,484,204,478Q158,472,124,441Q90,410,57,377Q24,344,12.5,297Q1,250,19.5,206Q38,162,60.5,122.5Q83,83,120,54Q157,25,203.5,21.5Q250,18,294.5,27Q339,36,382,55.5Q425,75,446.5,117.5Q468,160,484,205Q500,250,488,297Z" fill="#d1d8e0"></path>
</clipPath>
</defs>
<image x="0" y="0" width="100%" height="100%" clip-path="url(#shape)" xlink:href="data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1440' height='560' preserveAspectRatio='none' viewBox='0 0 1440 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1000%26quot%3b)' fill='none'%3e%3crect width='1440' height='560' x='0' y='0' fill='%230e2a47'%3e%3c/rect%3e%3cpath d='M280 98.21C217.1 98.21 146.67 113.44 146.67 140C146.67 168.48 220.79 208.29 280 208.29C314.38 208.29 333.85 170.86 333.85 140C333.85 115.82 310.69 98.21 280 98.21' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M560 109.43C531.14 111.72 507.84 119.59 507.84 140C507.84 168.98 524.44 203.35 560 208.21C620.52 216.48 632.03 191.72 700 166.25C723.03 157.62 742 150.91 742 140C742 130.15 721.92 128.41 700 124.73C630.92 113.13 627.22 104.09 560 109.43' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1097.3 0C1110.22 1.27 1107.86 13.77 1120 13.77C1140.21 13.77 1140.24 2.14 1162 0C1210.24 -4.74 1211 0 1260 0C1330 0 1330 0 1400 0C1470 0 1505 -35 1540 0C1575 35 1540 70 1540 140C1540 210 1540 210 1540 280C1540 350 1540 350 1540 420C1540 490 1575 525 1540 560C1505 595 1470 560 1400 560C1336.8 560 1327.95 573.12 1273.61 560C1257.95 556.22 1267.07 526.21 1260 526.21C1252.84 526.21 1261.09 556.15 1245.15 560C1191.09 573.05 1182.57 560 1120 560C1050 560 1050 560 980 560C910 560 910 560 840 560C770 560 770 560 700 560C630 560 630 560 560 560C490 560 490 560 420 560C350 560 350 560 280 560C210 560 210 560 140 560C76.18 560 70.76 569.22 12.35 560C0.76 558.17 1.09 550.27 0 537.89C-5.08 480.27 0 478.94 0 420C0 350 0 350 0 280C0 210 0 210 0 140C0 70 -35 35 0 0C35 -35 70 0 140 0C210 0 210 0 280 0C350 0 350 0 420 0C490 0 490 0 560 0C630 0 630 0 700 0C770 0 770 0 840 0C910 0 910 0 980 0C1038.65 0 1040.22 -5.61 1097.3 0' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1400 97.58C1385.59 97.58 1386.07 120.12 1368.89 140C1316.07 201.09 1312.29 198.26 1260 259.51C1252.53 268.26 1249.37 269.39 1249.37 280C1249.37 294.63 1251.2 296.88 1260 310C1298.14 366.88 1295.08 373.13 1343.24 420C1365.08 441.25 1374.12 446.25 1400 446.25C1415 446.25 1423.51 437.06 1425 420C1430.75 353.93 1414.59 350.01 1414.48 280C1414.37 210.01 1429.93 207.6 1424.56 140C1422.69 116.39 1413.43 97.58 1400 97.58' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M840 201.25C816.36 201.25 815.25 244.09 782.73 280C745.25 321.38 744.59 322.16 700 355.83C651.89 392.16 597.33 389.03 597.33 420C597.33 450.17 644.55 466.48 700 478.11C765.89 491.93 770.03 470.44 840 470.91C910.03 471.38 923.83 497.42 980 480C1005.9 471.97 1004.14 447.88 1004.14 420C1004.14 404.42 992.45 406.18 980 393.08C925.94 336.18 916.58 342.31 871.11 280C846.58 246.39 860.55 201.25 840 201.25' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M280 45.97C216.14 45.97 151.67 11.84 151.67 0C151.67 -11.15 215.83 0 280 0C339.23 0 398.46 -11.09 398.46 0C398.46 11.9 339.53 45.97 280 45.97' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M401.15 140C401.15 95.63 410.23 95.38 420 50.91C425.61 25.38 411.62 7.38 431.91 0C481.62 -18.08 495.95 0 560 0C630 0 630 0 700 0C770 0 770 0 840 0C910 0 910 0 980 0C991.35 0 992.76 -5.05 1002.7 0C1062.76 30.52 1056.33 53 1120 71.15C1184.98 89.67 1203.91 50.76 1260 73.33C1289.47 85.19 1291.11 109.03 1291.11 140C1291.11 159.44 1272.01 154.61 1260 174.15C1228.99 224.61 1206.94 225.05 1205.06 280C1202.74 347.98 1254.79 351.07 1251.6 420C1248.32 491.07 1236.76 512.51 1192.12 560C1170.96 582.51 1156.06 560 1120 560C1058.97 560 1015.07 591.7 997.95 560C977.26 521.7 1049.8 484.03 1044.37 420C1040.82 378.14 1012.81 383.53 980 348.21C947.78 313.53 930.1 321.9 914.32 280C890.9 217.8 925.01 201.42 901.6 140C887.85 103.92 877.06 99.51 840 85C776.26 60.05 770.44 65.07 700 61.09C630.44 57.17 625.25 49.46 560 69.2C494.86 88.91 484.22 93.02 439.22 140C414.22 166.11 429.52 215.38 420 215.38C410.49 215.38 401.15 177.86 401.15 140' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1485.96 140C1501.38 79.87 1525.81 25.93 1540 25.93C1552.83 25.93 1540 82.97 1540 140C1540 210 1540 210 1540 280C1540 350 1540 350 1540 420C1540 490 1575 525 1540 560C1505 595 1470 560 1400 560C1361.11 560 1322.22 574.92 1322.22 560C1322.22 539.92 1362.46 526.39 1400 490C1434.68 456.39 1451.4 462.84 1466.67 420C1488.82 357.84 1470.01 349.95 1474.83 280C1479.66 209.95 1468.8 206.9 1485.96 140' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M0 228C51.54 194.65 75.55 176.92 140 189.41C209.71 202.92 268.33 229.55 268.33 280C268.33 337.7 209.95 353.25 140 405.71C116.62 423.25 81.67 412.3 81.67 420C81.67 427.78 111.11 427.46 140 436.67C210.27 459.07 208.34 474.93 280 483.23C348.34 491.15 349.83 472 420 469.12C489.83 466.25 494.14 454.09 560 471.74C634.14 491.61 627.38 515.54 700 544.15C739.38 559.67 784 556 784 560C784 563.93 742 560 700 560C630 560 630 560 560 560C490 560 490 560 420 560C350 560 350 560 280 560C210 560 210 560 140 560C101.91 560 89.58 581.01 63.82 560C19.58 523.91 26.66 504.26 0 445.79C-5.25 434.26 0 432.89 0 420C0 350 0 350 0 280C0 254 -18.46 239.94 0 228' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M676.67 280C676.67 278.17 689.2 275.63 700 275.63C702.46 275.63 703.18 277.97 703.18 280C703.18 281.62 702.06 282.92 700 282.92C688.8 282.92 676.67 281.81 676.67 280' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M560 28.97C531.15 28.97 506.38 7.71 506.38 0C506.38 -6.78 533.19 0 560 0C626.32 0 692.63 -7.16 692.63 0C692.63 7.33 624.27 28.97 560 28.97' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1076.25 140C1095.93 129.37 1098.3 128.52 1120 128.52C1137.67 128.52 1150.76 124.23 1155 140C1171.14 199.97 1154.14 210.35 1160.76 280C1167.44 350.35 1186.93 351.16 1181.6 420C1176.09 491.16 1166.34 498.08 1139.09 560C1135.54 568.08 1129.55 560 1120 560C1103.85 560 1091.01 573.12 1087.69 560C1073.31 503.12 1110.01 480.56 1084.6 420C1056.17 352.23 1032.65 361.34 980 303.33C969.12 291.34 957.53 294.41 957.53 280C957.53 244.83 955.9 232.59 980 204.17C1015.26 162.59 1025.93 167.19 1076.25 140' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M54.19 280C54.19 257.51 98.93 240.88 140 240.88C169.54 240.88 195.42 258.21 195.42 280C195.42 304.92 170.58 334.29 140 334.29C99.97 334.29 54.19 304.22 54.19 280' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M1535.17 280C1539.65 252.29 1538.79 224 1540 224C1541.21 224 1540 252 1540 280C1540 350 1540 350 1540 420C1540 490 1575 525 1540 560C1505 595 1470 560 1400 560C1385.41 560 1370.83 565.6 1370.83 560C1370.83 552.47 1386.26 547.74 1400 533.75C1455.01 477.74 1472.9 486.51 1508.33 420C1540.48 359.64 1523.81 350.29 1535.17 280' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M115.29 560C115.29 546.89 121.75 520 140 520C176.11 520 224 549.49 224 560C224 569.49 182 560 140 560C127.64 560 115.29 566.89 115.29 560' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3cpath d='M336 560C336 552.42 376.67 532.88 420 530.53C488.67 526.8 491.12 535.48 560 547.83C573.29 550.21 584.35 556.79 584.35 560C584.35 562.87 572.17 560 560 560C490 560 490 560 420 560C378 560 336 567.15 336 560' stroke='rgba(51%2c 121%2c 194%2c 0.58)' stroke-width='2'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1000'%3e%3crect width='1440' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e" preserveAspectRatio="none"></image>
</g>
</svg>
</div> -->
<!-- 우주인 -->
<!-- <div class="meBox">
<img src="./IMG/me.svg" alt="우주인">
</div> -->
<div class="userBox">
<div class="bodyBox">
<div class="leg1"></div>
<div class="leg3"></div>
<div class="fire"></div>
<div class="userBody"></div>
<div class="leg2"></div>
<div class="userWindow"></div>
</div>
<div class="cloudBox">
<div class="smoke"></div>
<div class="cloud1"></div>
<div class="cloud2"></div>
<div class="cloud3"></div>
<div class="cloud4"></div>
<div class="cloud5"></div>
<div class="cloud6"></div>
<div class="cloud7"></div>
<div class="cloud8"></div>
<div class="cloud9"></div>
<div class="cloud10"></div>
</div>
</div>
<script>
AOS.init();
</script>
</body>
</html>