-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
47 lines (44 loc) · 2.59 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
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>공적 마스크 조회</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
<link rel="stylesheet" href="css/style.css">
<script type="text/javascript"
src="https://openapi.map.naver.com/openapi/v3/maps.js?ncpClientId=kh7fi0qf7e"></script>
<script type="text/javascript"
src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"></script>
</head>
<body>
<div id="map" style="width:100%;height:100%;">
<div id="wrap">
<h2>공적 마스크 재고 확인</h2>
<p id="can_buy">구매 가능: XXX1년생, XXX6년생</p>
</div>
</div>
<div id="disable_area"></div>
<div id="agreement" class="modal">
<div class="modal-title">
<h3>사용자 동의</h3>
<p>해당 서비스를 이용하기 위해서 아래 사항에 대해 동의하셔야 합니다.</p>
</div>
<div class="modal-content">
<p>* 사이트에서 제공하는 재고 정보는 <b>최소 5분 이상</b> 지연된 정보입니다.</p>
<p>* 색깔을 통해 재고 상황을 쉽게 확인이 가능합니다. (<span class="plenty_color">100~</span>, <span class="some_color">30~100</span>, <span class="few_color">1~30</span>, <span class="empty_color">0</span>)</p>
<p>* 약국에서 내부 사정으로 인해 잠시 판매를 하지 않는 경우에 판매 중지라는 메시지가 나옵니다.</p>
<p>* 중심으로부터 설정한 거리만큼 떨어진 약국 재고의 확인이 가능하며 기본은 500m입니다.</p>
<p>* <a href="https://www.mfds.go.kr/brd/m_99/view.do?seq=43991">마스크 사용 권고 사항</a>과 <a href="http://blog.naver.com/kfdazzang/221844817502">구입 안내</a>를 참고하시기 바랍니다.</p>
<p>* 마스크를 구매하시면서 고생하시는 약사 분들께 감사하다는 말씀을 해주셨으면 합니다.</p>
</div>
<div class="modal-footer">
<p>사이트 관련 문의: <a href="mailto:type.dev@kakao.com">type.dev@kakao.com</a></p>
<p>데이터 출처: 공공데이터포털(건강보험심사평가원)</p>
<p>데이터 관련 문의: <a href="mailto:maskdata@nia.or.kr">maskdata@nia.or.kr</a></p>
<p><a href="#" id="agree_btn" class="btn">동의하기</a></p>
</div>
</div>
<script src="js/main.min.js"></script>
</body>
</html>