본인인증페이지 추가
This commit is contained in:
subsub
parent
6965042708
commit
cbf0c9f95f
@ -57,6 +57,13 @@ function actionLogin() {
|
||||
</div>
|
||||
|
||||
<div class="login_wrap">
|
||||
<div class="box">
|
||||
<i class="icon phone"></i>
|
||||
<p class="login_title">휴대폰 인증</p>
|
||||
<span class="summary">개인의 휴대폰 번호를 이용해 본인여부를 확인할 수 있는 서비스입니다.</span>
|
||||
<button type="button" class="btn fill blue large w70per">본인인증</button>
|
||||
</div>
|
||||
<div class="box">
|
||||
<p class="login_tit">
|
||||
본인인증 로그인</br>
|
||||
<span>사이트 오픈 시 셀렉트 박스를 통한 로그인은 삭제됩니다.</span>
|
||||
@ -86,9 +93,10 @@ function actionLogin() {
|
||||
<option value="이준호:01030266269:M:19890202:HwekrDfuErjWrj/DSjfsduerlkrkjweR+DJfisdfioueklrjiJeudsdWErQWERasdvDASgfeRTdsioufiuERwe==">이준호:01030266269:M:19890202</option>
|
||||
</select>
|
||||
<br></br>
|
||||
<div class="login_form">
|
||||
<div class="login_btn_wrap">
|
||||
<button type="button" onclick="javascript:actionLogin();" class="btn_login">본인인증</button>
|
||||
<div class="login_form">
|
||||
<div class="login_btn_wrap">
|
||||
<button type="button" onclick="javascript:actionLogin();" class="btn_login">본인인증</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -807,7 +807,32 @@ duet-date-picker *:focus{outline: auto !important;}
|
||||
.t_dashboard_btm table:nth-child(1),.t_dashboard_btm table:nth-child(2) {margin-bottom: 30px;}
|
||||
|
||||
/* login */
|
||||
.login_wrap{width: 400px; margin: 0 auto; border: 1px solid #d5d5d5; padding: 90px 80px 75px 80px; text-align: center;}
|
||||
.login_wrap{display:flex;justify-content:center;align-items:stretch;gap:30px;}
|
||||
.login_wrap .box{width:calc(100%/3);padding:30px 30px 40px 30px;text-align:center;border:1px solid #7ca4ee;border-radius:10px;background:#f7fbfe;}
|
||||
.login_wrap .icon{display:inline-block;width:107px;height:107px;margin:0 0 20px 0;background:#e5e5e5;border-radius:100%;}
|
||||
.login_wrap .phone{background-image:url(../images/content/login_phone.png);}
|
||||
.login_wrap .login_title{font-size:2.1rem;font-weight:600;color:#333;margin:0 0 30px 0;}
|
||||
.login_wrap .summary{display:block;font-size:1.5rem;font-weight:300;color:#7c7c7c;line-height:1.4;}
|
||||
.login_wrap button{margin:30px 0 0 0;}
|
||||
|
||||
.login_tit{font-size: 28px; color: #555; font-weight: 400; margin:40px 0;}
|
||||
.login_tit span{font-weight: 500; color: #222;}
|
||||
.login_form input[type="text"],.login_form input[type="password"]{width: 100%; height: 46px; border: 1px solid #d5d5d5; border-radius: 5px; padding: 0 0 0 15px; margin-bottom: 10px; box-sizing: border-box;}
|
||||
.login_form input[type="text"]::placeholder,.login_form input[type="password"]::placeholder{font-size: 16px;}
|
||||
.login_form .login_btn_wrap{margin-top: 10px;}
|
||||
.login_form .login_btn_wrap button{width: 100%; height: 46px; border-radius: 5px; margin-bottom: 10px;}
|
||||
.login_form .btn_login{background-color: #3a72db; font-size: 18px; color: #fff; transition: background-color 0.3s ease-in-out;}
|
||||
.login_form .btn_login:hover{background-color: #0c3a97; transition: background-color 0.3s ease-in-out;}
|
||||
.login_form .btn_join{background-color: #888888; font-size: 18px; color: #fff; transition: background-color 0.3s ease-in-out;}
|
||||
.login_form .btn_join:hover{background-color: #666; transition: background-color 0.3s ease-in-out;}
|
||||
.login_form .login_util{display: flex; justify-content: center; margin-top: 20px;}
|
||||
.login_form .login_util a{position: relative; padding: 0 15px; font-size: 18px; color: #666666; font-weight: 300;}
|
||||
.login_form .login_util a:hover{color: #222;}
|
||||
.login_form .login_util a::after{position: absolute; content: " "; width: 1px; height: 15px; background-color: #cccccc; right: 0; top: 3px;}
|
||||
.login_form .login_util a:first-child{padding-left: 0;}
|
||||
.login_form .login_util a:last-child{padding-right: 0;}
|
||||
.login_form .login_util a:last-child::after{display: none;}
|
||||
|
||||
.login_tit{font-size: 28px; color: #555; font-weight: 400; margin-bottom: 40px;}
|
||||
.login_tit span{font-weight: 500; color: #222;}
|
||||
.login_form input[type="text"],.login_form input[type="password"]{width: 100%; height: 46px; border: 1px solid #d5d5d5; border-radius: 5px; padding: 0 0 0 15px; margin-bottom: 10px; box-sizing: border-box;}
|
||||
@ -1212,6 +1237,15 @@ duet-date-picker *:focus{outline: auto !important;}
|
||||
|
||||
#egov_file_view_table ul{gap:16px;}
|
||||
.fileView a{padding:0 0 0 46px;font-size:3.2rem;background-image:url(../images/content/icon_file_mobile.png);background-position:left 8px;}
|
||||
|
||||
/* 로그인 */
|
||||
.login_wrap{flex-wrap:wrap;}
|
||||
.login_wrap .box{width:100%;padding:60px 30px 80px 30px;border:2px solid #7ca4ee;border-radius:20px;}
|
||||
.login_wrap .icon{width:214px;height:214px;}
|
||||
.login_wrap .phone{background-image:url(../images/content/login_phone_mobile.png);}
|
||||
.login_wrap .login_title{font-size:4.2rem;margin:0 0 60px 0;}
|
||||
.login_wrap .summary{font-size:3rem;}
|
||||
.login_wrap button{margin:60px 0 0 0;}
|
||||
}
|
||||
|
||||
@media all and (max-width: 860px){
|
||||
@ -1507,8 +1541,6 @@ duet-date-picker *:focus{outline: auto !important;}
|
||||
.t_dashboard_top>.tb_type01>table>colgroup>col {width: 80px !important;}
|
||||
.t_dashboard_btm .tb_list01 {display: block; width: 100%; margin-top: 40px;}
|
||||
|
||||
/* login */
|
||||
.login_wrap{width: 100%; padding: 80px 30px 65px 30px; box-sizing: border-box;}
|
||||
|
||||
/*교육기반강화연수*/
|
||||
.best_list {display:block; }
|
||||
@ -1592,6 +1624,14 @@ duet-date-picker *:focus{outline: auto !important;}
|
||||
|
||||
#egov_file_view_table ul{gap:8px;}
|
||||
.fileView a{padding:0 0 0 23px;font-size:1.6rem;background-image:url(../images/content/icon_file.png);background-position:left 5px;}
|
||||
|
||||
/* 로그인 */
|
||||
.login_wrap .box{padding:30px 30px 40px 30px;border:1px solid #7ca4ee;border-radius:10px;}
|
||||
.login_wrap .icon{width:107px;height:107px;}
|
||||
.login_wrap .phone{background-image:url(../images/content/login_phone.png);}
|
||||
.login_wrap .login_title{font-size:2.1rem;margin:0 0 30px 0;}
|
||||
.login_wrap .summary{font-size:1.5rem;}
|
||||
.login_wrap button{margin:30px 0 0 0;}
|
||||
}
|
||||
|
||||
@media (max-width: 479px){
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
141
src/main/webapp/visitEdu/usr/publish/login.html
Normal file
141
src/main/webapp/visitEdu/usr/publish/login.html
Normal file
@ -0,0 +1,141 @@
|
||||
<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">
|
||||
<title>교육현황 > 마이페이지 > 한국지식재산보호원 지식재산보호교육시스템</title>
|
||||
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="/ipedu/visitEdu/usr/publish/css/reset.css">
|
||||
<link rel="stylesheet" href="/ipedu/visitEdu/usr/publish/css/common.css">
|
||||
<link rel="stylesheet" href="/ipedu/visitEdu/usr/publish/css/content.css">
|
||||
<link rel="stylesheet" href="/ipedu/visitEdu/usr/publish/css/popup.css">
|
||||
|
||||
|
||||
|
||||
<!-- script -->
|
||||
<script src="/ipedu/visitEdu/usr/publish/script/jquery-3.5.0.js"></script>
|
||||
<script src="/ipedu/visitEdu/usr/publish/script/common.js"></script>
|
||||
<script src="/ipedu/visitEdu/usr/publish/script/content.js"></script>
|
||||
<script src="/ipedu/visitEdu/usr/publish/script/popup.js"></script>
|
||||
|
||||
<!-- 달력 -->
|
||||
<link rel="stylesheet" href="/ipedu/visitEdu/usr/publish/datepicker/classic.css">
|
||||
<link rel="stylesheet" href="/ipedu/visitEdu/usr/publish/datepicker/classic.date.css">
|
||||
|
||||
<script src="/ipedu/visitEdu/usr/datapicker/duet.js"></script>
|
||||
<script src="/ipedu/visitEdu/usr/datapicker/duet.system.js"></script>
|
||||
<script src="/ipedu/visitEdu/usr/datapicker/duet.esm.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="mask"></div>
|
||||
|
||||
<div class="popup_wrap popType01" tabindex="0" style="width:800px;" data-tooltip-con="sub36_pop02" data-focus="sub36_pop02" data-focus-prev="sub36_pop02_close">
|
||||
<div class="popup_tit">
|
||||
<p>교육대상자 확인</p> <button class="btn_popup_close tooltip-close" data-focus="sub36_pop02_close" title="팝업 닫기"><i></i></button>
|
||||
</div>
|
||||
|
||||
<div class="popup_cont">
|
||||
<div class="cont_body">
|
||||
<div class="pop_tb_type01" style="overflow:visible;">
|
||||
<table>
|
||||
<caption>교육대상자 확인 : 성명, 주민번호앞자리, 성별 등의 정보입력</caption>
|
||||
<colgroup>
|
||||
<col style="width:38%;">
|
||||
<col style="width:auto;">
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">성명</th>
|
||||
<td>
|
||||
<label for="trgtNm" class="label">성명 입력</label>
|
||||
<input type="text" id="trgtNm">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">생년월일/성별</th>
|
||||
<td>
|
||||
<div class="birth_wrap">
|
||||
<input type="hidden" value="" id="dBirth" />
|
||||
<input type="text" class="birth_input" maxlength="6" placeholder="●●●●●●"><span>-</span>
|
||||
<input type="text" class="jender_input" maxlength="1" placeholder="●">
|
||||
<span>●●●●●●</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">휴대폰 번호</th>
|
||||
<td>
|
||||
<input type="text" id="clphone" onkeyup="onlyNumber(this);" maxlength="11">
|
||||
</td>
|
||||
</tr>
|
||||
<tr id="chkNo" style="display:none;">
|
||||
<th scope="row">인증번호</th>
|
||||
<td>
|
||||
<input type="text" maxlength="6">
|
||||
<button type="button" class="btnType06" onclick="fncChkNo();">인증하기</button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
<div class="pop_btn_wrap btn_layout01" id="confirmBtns">
|
||||
<div class="btn_left">
|
||||
</div>
|
||||
<div class="btn_center">
|
||||
<button type="button" class="btnType05" id="chkBtn">확인</button>
|
||||
<button type="button" class="btnType02 tooltip-close" id="target_confirm_popup-close" data-focus="sub36_pop02_close" data-focus-next="sub36_pop02">취소</button>
|
||||
</div>
|
||||
<div class="btn_right">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-include-path="/ipedu/visitEdu/usr/publish/layout/_header.html"></div>
|
||||
|
||||
<!-- content -->
|
||||
<div class="container">
|
||||
<div class="sub_visual">
|
||||
<div class="visual_text">
|
||||
<strong>본인인증</strong>
|
||||
<p>지식재산보호교육시스템</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="inner">
|
||||
<div class="cont_wrap w100per">
|
||||
|
||||
<div class="cont_tit">
|
||||
<h2>본인인증</h2>
|
||||
</div>
|
||||
|
||||
<div class="login_wrap">
|
||||
<div class="box">
|
||||
<i class="icon phone"></i>
|
||||
<p class="login_title">휴대폰 인증</p>
|
||||
<span class="summary">개인의 휴대폰 번호를 이용해 본인여부를 확인할 수 있는 서비스입니다.</span>
|
||||
<button type="button" class="btn fill blue large w70per">본인인증</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--// content -->
|
||||
|
||||
|
||||
|
||||
<div data-include-path="/ipedu/visitEdu/usr/publish/layout/_footer.html"></div>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user