-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathindex.html
282 lines (271 loc) · 11 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
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="Kyung Hee Univ. MARO homepage">
<meta name="keywords" content="khu, KHU, Kyung Hee, MARO, maro">
<meta name="author" content="Junyoung Jung(sauber92)">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:image" content="https://github.com/KHU-MARO/maro-logo/blob/master/example/maro-letter-example.jpeg?raw=true">
<!-- favicon -->
<link rel="apple-touch-icon" sizes="57x57" href="public/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="public/favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="public/favicon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="public/favicon/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="public/favicon/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="public/favicon/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="public/favicon/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="public/favicon/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="public/favicon/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="public/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="public/favicon/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="public/favicon/favicon-16x16.png">
<link rel="manifest" href="public/favicon/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="public/favicon/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<title>MARO | 경희대학교 전자ㆍ전파공학과 학술동아리</title>
<link href="https://fonts.googleapis.com/css?family=Noto+Sans" rel="stylesheet">
<link rel="stylesheet" href="public/css/style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<script src="public/js/main.js"></script>
</head>
<body>
<!-- "navigation" mobile display -->
<nav id="nav" role="navigation">
<h1><img src="public/img/m-maro-logo.png" width="110px" alt="mobile-maro-logo"></h1>
<div id="dropdownBtn" class="dropbtn">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</div>
<div id="dropmenu" class="dropdown-contents">
<a class="page-scroll" href="#topPicture">Home</a>
<a class="page-scroll" href="#about">About</a>
<a class="page-scroll" href="#project">Project</a>
<a class="page-scroll" href="#contact">Contact</a>
</div>
</nav>
<div class="clearFix"></div>
<!--header, fixed-->
<header>
<!--desktop display-->
<h1 id="logo"><img src="public/img/maro-logo.png" width="300px" alt="maro-logo"></h1>
<ul class="nav navbar-nav navbar-right">
<li class="hidden">
<a id="homeBtn" class="page-scroll" href="#topPicture">Home</a>
</li>
<li>
<a id="aboutBtn" class="page-scroll" href="#about">About</a>
</li>
<li>
<a id="projectBtn" class="page-scroll" href="#project">Project</a>
</li>
<li>
<a id="contactBtn" class="page-scroll" href="#contact">Contact</a>
</li>
</ul>
</header>
<!--"top picture" section-->
<section id="topPicture">
<div class="top-picture-color">
<p>경희대학교 전자ㆍ전파공학과 학술동아리 마로</p>
<h2>MARO</h2>
</div>
</section>
<!--"about" section-->
<section id="about">
<h3>ABOUT</h3>
<div class="description">
경희대학교 전자ㆍ전파공학과 학술동아리 마로는 전자ㆍ전파공학을 전공하면서 자칫 이론에 그치기 쉬운 학과 내용을
<br/>
실제로 적용해보며 전공에 대한 이해를 높이는 것을 목표로 삼고 있는 동아리입니다.
<br/>
<br/>
이 웹페이지는 <strong>2016년 마로 학술제</strong> 소개 페이지입니다.
</div>
<div id="activity" class="about-contents">
<h4>활동</h4>
<p>정기 활동으로 1학기 <strong>창립제</strong>와
<br/>
2학기 <strong>학술제</strong>가 있습니다.
<br/>
비정기 활동으로는 프로그래밍 교육과
<br/>
세미나를 자율적으로 진행합니다.
</p>
</div>
<div id="academic" class="about-contents">
<h4>학술제</h4>
<p>팀을 구성하여 관심분야 혹은
<br/>
도전하고 싶은 주제에 대해
<br/>
<strong>설계 및 개발</strong>을 하며
<br/>
프로젝트 경험을 쌓는 활동입니다.
</p>
</div>
<div id="2016" class="about-contents">
<h4>2016</h4>
<p>2016년에는 2015년에 이어
<br/>
이화여자대학교 전자공학과 동아리
<br/>
<strong>E.E.I와 연합</strong>을 통한
<br/>
학술제가 1년간 진행되었습니다.
</p>
</div>
<div class="clearFix"></div>
</section>
<!--project section-->
<section id="project">
<h3>PROJECT</h3>
<div class="description">
2016년 마로에서 진행한 학술제 프로젝트를 소개합니다.
<div class="link">
*마로 Github에서 프로젝트에 자세한 사항을 볼 수 있습니다.
<a href="https://github.com/KHU-MARO/2016-academic-seminar" target="_blank">[바로가기]</a>
</div>
</div>
<div id="team1" class="contents">
<h4>1조
<br/>
<a href="https://github.com/KHU-MARO/2016-academic-seminar/tree/master/Team1" target="_blank">스마트 홈 시스템</a>
</h4>
<div class="thumbnail"></div>
<div class="project-description">
아두이노와 안드로이드 어플리케이션의
<br/>
블루투스 통신을 통한 스마트홈 시스템
</div>
</div>
<div id="team2" class="contents">
<h4>2조
<br/>
<a href="https://github.com/KHU-MARO/2016-academic-seminar/tree/master/Team2" target="_blank">Smart Mirror</a>
</h4>
<div class="thumbnail"></div>
<div class="project-description">
디스플레이를 통해
<br/>
거울에서 정보를 제공합니다.
</div>
</div>
<div id="team3" class="contents">
<h4>3조
<br/>
<a href="https://github.com/KHU-MARO/2016-academic-seminar/tree/master/Team3" target="_blank">졸음운전방지시스템</a>
</h4>
<div class="thumbnail"></div>
<div class="project-description">
OpenCV 라이브러리를 사용한 안면인식과
<br/>
이를 통한 졸음운전 방지 시스템입니다.
</div>
</div>
<div id="team4" class="contents">
<h4>4조
<br/>
<a href="https://github.com/KHU-MARO/2016-academic-seminar/tree/master/Team4" target="_blank">시각장애인을 위한 자동차</a>
</h4>
<div class="thumbnail"></div>
<div class="project-description">
아두이노와 라즈베리파이를 이용하여
<br/>
만든 시각장애인을 위한 스마트 자동차입니다.
</div>
</div>
<div class="clearFix"></div>
<div id="team5" class="contents">
<h4>5조
<br/>
<a href="https://github.com/KHU-MARO/2016-academic-seminar/tree/master/Team5" target="_blank">경희대 안내 모형지도</a>
</h4>
<div class="thumbnail"></div>
<div class="project-description">
경희대학교 모형지도와
<br/>
어플리케이션입니다.
</div>
</div>
<div id="team6" class="contents">
<h4>6조
<br/>
<a href="https://github.com/KHU-MARO/2016-academic-seminar/tree/master/Team6" target="_blank">심쿵간쿵</a>
</h4>
<div class="thumbnail"></div>
<div class="project-description">
GSR센서를 이용하여 사용자의
<br/>
생체신호를 받아 음료를
<br/>
제조하는 칵테일머신입니다.
</div>
</div>
<div id="team7" class="contents">
<h4>7조
<br/>
<a href="https://github.com/KHU-MARO/2016-academic-seminar/tree/master/Team7" target="_blank">카트 단말기</a>
</h4>
<div class="thumbnail"></div>
<div class="project-description">
바코드 리더기를 카트에 부착하여 소비자가
<br/>
편리하게 쇼핑을 할 수 있도록 도와줍니다.
</div>
</div>
<div id="team8" class="contents">
<h4>8조
<br/>
<a href="https://github.com/KHU-MARO/2016-academic-seminar/tree/master/Team8" target="_blank">할 일 관리 시스템</a>
</h4>
<div class="thumbnail"></div>
<div class="project-description">
아두이노와 안드로이드 어플리케이션을
<br/>
통한 할 일 관리 시스템입니다.
</div>
</div>
<div class="clearFix"></div>
</section>
<!--contact section-->
<div class="contact-background">
<section id="contact">
<h3>CONTACT</h3>
<div class="description">
마로 동아리방은 경희대학교 국제캠퍼스 전자정보대학 242호에 위치해있습니다.
<br/>
궁금한 사항이 있으시면 언제든지 메일을 보내주세요! 최대한 빠르게 답변드리겠습니다.
<br/>
<br/>
<i>* 표시가 된 항목은 반드시 기입</i>
</div>
<form class="contact-contents" action="https://formspree.io/[email protected]" method="POST">
<div class="information">
<input type="text" id="inputName" class="input" name="name" placeholder="* 성함" required="" data-validation-required-message="이름을 적어주세요.">
<div class="clearFix"></div>
<input type="text" id="inputEmail" class="input" name="_replyto" placeholder="* 답변받으실 이메일" required="" data-validation-required-message="이메일 주소를 적어주세요.">
<div class="clearFix"></div>
<input type="text" id="inputPhone" class="input" placeholder="연락처">
</div>
<div class="message">
<textarea id="inputMessage" class="input-message" name="message" placeholder="* 문의하실 내용일 기입해주세요." required="" data-validation-required-message="메세지를 입력해 적어주세요."></textarea>
</div>
<div class="clearFix"></div>
<input type="submit" id="submitBnt" value="Send">
</form>
<div class="clearFix"></div>
</section>
</div>
<div class="clearFix"></div>
<!--footer-->
<footer>
<a class="git" href="https://github.com/KHU-MARO" target="_blank">Club Maro Github</a>
<a class="writer" href="https://github.com/KHU-MARO/KHU-MARO.github.io" target="_blank">Design by @junyoung</a>
</footer>
</body>
</html>