퍼블 업뎃
parent
b9f3d858b4
commit
82ffd839e7
Binary file not shown.
|
After Width: | Height: | Size: 388 B |
Binary file not shown.
|
After Width: | Height: | Size: 382 B |
|
|
@ -78,7 +78,7 @@ body {min-width: 1400px;}
|
|||
.user_info_m {display: none;}
|
||||
|
||||
|
||||
.container {min-height: calc(100vh - 300px);}
|
||||
.container {min-height: calc(100vh - 400px);}
|
||||
.c_wrap { margin: 0 auto;} /* removed by lim width: 1400px; padding: 0 50px; */
|
||||
.c_wrap .layout {display: table; width: 100%; table-layout: fixed; padding-bottom: 20px;} /* added by lim padding-bottom: 20px; */
|
||||
|
||||
|
|
@ -93,7 +93,7 @@ body {min-width: 1400px;}
|
|||
.c_wrap .layout .nav ul li a:hover::after {content: ""; display: block; position: absolute; right: 0px; top: 50%; transform: translateY(-50%); width: 9px; height: 15px; background: url(css/images/ico_arrow_r_gray_9x15.png) no-repeat;}
|
||||
.c_wrap .layout .nav ul li a.cur {color: #222; font-weight: 700;}
|
||||
|
||||
.c_wrap .layout .contents {display: table-cell; width: auto; padding: 0 0 50px 30px; vertical-align: top;} /* changed by lim padding: 0 0 120px 70px; */
|
||||
.c_wrap .layout .contents {display: table-cell; width: auto; vertical-align: top;} /* changed by lim padding: 0 0 120px 70px; */
|
||||
|
||||
|
||||
/* location */
|
||||
|
|
|
|||
|
|
@ -1,20 +1,27 @@
|
|||
@charset "utf-8";
|
||||
|
||||
.Plogin {padding-bottom: 100px;}
|
||||
.Plogin h1 {color: #222; font-size: 48px; font-weight: 500; letter-spacing: -2px; line-height: 48px; text-align: center;}
|
||||
.Plogin h1 {color: #222; font-size: 30px; font-weight: 600; text-align: center; padding-top: 30px;}
|
||||
.Plogin .txt {margin-top: 43px; color: #666; font-size: 20px; line-height: 30px; text-align: center;}
|
||||
.Plogin .login_box {position: relative; width: 690px; margin: 54px auto 0; padding: 70px 95px ; border: 1px solid #dde2e5; border-radius: 25px; box-shadow: 3px 4px 5px #ccc;}
|
||||
.Plogin .login_box {position: relative; width: 690px; margin: 54px auto 0; padding: 30px 50px ; border: 1px solid #dde2e5; border-radius: 25px; box-shadow: 3px 4px 5px #ccc;}
|
||||
.Plogin .login_box .group {display: block; width: 320px;}
|
||||
.Plogin .login_box input[type=text],
|
||||
.Plogin .login_box input[type=password] {width: 100%; height: 46px; padding: 0 20px; border: 0; border-radius: 8px; color: #666; font-size: 16px; background: #f5f5f5;}
|
||||
.Plogin .login_box input[type=password] {height: 50px; border-top-right-radius: 10px; border-bottom-right-radius: 10px;}
|
||||
/*.Plogin .login_box input[type=text],*/
|
||||
/*.Plogin .login_box input[type=password] {width: 100%; height: 46px; padding: 0 20px; border: 0; border-radius: 8px; color: #666; font-size: 16px; background: #f5f5f5;}*/
|
||||
.Plogin .login_box .group input + input {margin-top: 18px;}
|
||||
.Plogin .login_box input[type=text]:-ms-input-placeholder,
|
||||
.Plogin .login_box input[type=password]:-ms-input-placeholder {color: #aaa; opacity: 1;}
|
||||
.Plogin .login_box button {display: block; position: absolute; left: 435px; top: 70px; width: 160px; height: 110px; border-radius: 8px; color: #fff; font-size: 20px; font-weight: 500; text-align: center; line-height: 110px; background: #169bd5;}
|
||||
.Plogin .login_box button span {display: block; position: relative; height: 100%;}
|
||||
.Plogin .login_box button {width: 100%; height: 50px; font-size: 15px;}
|
||||
.Plogin .login_box a {font-size: 15px;}
|
||||
/*.Plogin .login_box button {display: block; width: 160px; height: 110px; border-radius: 8px; color: #fff; font-size: 20px; font-weight: 500; text-align: center; line-height: 110px; background: #169bd5;}*/
|
||||
/*.Plogin .login_box button span {display: block; position: relative; height: 100%;}*/
|
||||
.Plogin .login_box .line_t {height: 15px; border-bottom: 1px solid #D6D6D6; }
|
||||
.Plogin .login_box .line_b {height: 15px; border-top: 1px solid #C2C2C2; }
|
||||
.Plogin .login_box .chk {margin-top: 20px;}
|
||||
.Plogin .login_box .chk em {display: inline-block; height: 30px; margin-left: 40px; color: #666; font-size: 16px;}
|
||||
.Plogin .login_box .chk label {display: inline-block; height: 30px; color: #666; font-size: 16px;}
|
||||
.Plogin .login_box .chk em {display: inline-block; height: 30px; color: #666; font-size: 15px;}
|
||||
.Plogin .login_box .chk em:nth-child(2) {padding: 0 10px;}
|
||||
.Plogin .login_box .chk label {display: inline-block; height: 30px; color: #666; font-size: 15px;}
|
||||
.Plogin .list {margin-top: 44px; padding: 0 360px;}
|
||||
.Plogin .list li {position: relative; padding-left: 15px; color: #666; font-size: 16px; line-height: 26px;}
|
||||
.Plogin .list li::before {content: ""; display: block; position: absolute; left: 0; top: 12px; width: 4px; height: 4px; background: #666;}
|
||||
|
|
|
|||
|
|
@ -21,12 +21,12 @@ function EgovLogin(props) {
|
|||
<div className="container">
|
||||
<div className="c_wrap">
|
||||
{/* <!-- Location --> */}
|
||||
<div className="location">
|
||||
<ul>
|
||||
<li><Link to={URL.MAIN} className="home" >Home</Link></li>
|
||||
<li>로그인</li>
|
||||
</ul>
|
||||
</div>
|
||||
{/*<div className="location">*/}
|
||||
{/* <ul>*/}
|
||||
{/* <li><Link to={URL.MAIN} className="home" >Home</Link></li>*/}
|
||||
{/* <li>로그인</li>*/}
|
||||
{/* </ul>*/}
|
||||
{/*</div>*/}
|
||||
{/* <!--// Location --> */}
|
||||
|
||||
<div className="layout">
|
||||
|
|
|
|||
|
|
@ -131,40 +131,46 @@ function EgovLoginContent(props) {
|
|||
{/* <!-- 본문 --> */}
|
||||
<div className="Plogin">
|
||||
<h1>로그인</h1>
|
||||
<p className="txt">전자정부표준프레임워크 경량환경 홈페이지 로그인 페이지입니다.<br />로그인을 하시면 모든 서비스를 제한없이 이용하실 수 있습니다.</p>
|
||||
|
||||
<div className="login_box">
|
||||
<fieldset>
|
||||
<legend>로그인</legend>
|
||||
<span className="group">
|
||||
<input type="text" name="" title="아이디" placeholder="아이디" value={userInfo?.username}
|
||||
onChange={e => setUserInfo({ ...userInfo, username: e.target.value })} />
|
||||
<input type="password" name="" title="비밀번호" placeholder="비밀번호"
|
||||
onChange={e => setUserInfo({ ...userInfo, password: e.target.value })} />
|
||||
</span>
|
||||
<div className="input-group">
|
||||
<span className="input-group-text"><img src="/assets/images/icon_id.png" /></span>
|
||||
<input type="text" className="form-control shadow-none" title="아이디" placeholder="아이디" value={userInfo?.username}
|
||||
onChange={e => setUserInfo({ ...userInfo, username: e.target.value })} />
|
||||
</div>
|
||||
<div className="input-group mt-3">
|
||||
<span className="input-group-text"><img src="/assets/images/icon_pw.png" /></span>
|
||||
<input type="password" className="form-control shadow-none" title="비밀번호" placeholder="비밀번호"
|
||||
onChange={e => setUserInfo({ ...userInfo, password: e.target.value })} />
|
||||
</div>
|
||||
{/*<span className="group">*/}
|
||||
{/*<input type="text" name="" title="아이디" placeholder="아이디" value={userInfo?.username}*/}
|
||||
{/* onChange={e => setUserInfo({ ...userInfo, username: e.target.value })} />*/}
|
||||
{/*<input type="password" name="" title="비밀번호" placeholder="비밀번호"*/}
|
||||
{/* onChange={e => setUserInfo({ ...userInfo, password: e.target.value })} />*/}
|
||||
{/*</span>*/}
|
||||
<Row className="chk justify-content-between">
|
||||
<Col xs={3}>
|
||||
<Form.Check inline label={"ID 저장"} id={"saveid"} name={""} checked={saveIDFlag} onChange={handleSaveIDFlag}/>
|
||||
<Form.Check inline label={"아이디 저장"} id={"saveid"} name={""} checked={saveIDFlag} onChange={handleSaveIDFlag}/>
|
||||
|
||||
{/*<label className="f_chk" htmlFor="saveid" ref={checkRef}>
|
||||
<input type="checkbox" name="" id="saveid" onChange={handleSaveIDFlag} checked={saveIDFlag}/> <em>ID저장</em>
|
||||
</label>*/}
|
||||
</Col>
|
||||
<Col xs={"auto"}>
|
||||
<em className="clickable" onClick={idFindModal}>ID 찾기</em>
|
||||
<em className="clickable" onClick={pwFindModal}>PW 찾기</em>
|
||||
<Link to={URL.JOIN}><em>회원가입</em></Link>
|
||||
<em className="clickable" onClick={idFindModal}>아이디 찾기</em>
|
||||
<em> | </em>
|
||||
<em className="clickable" onClick={pwFindModal}>비밀번호 찾기</em>
|
||||
{/*<Link to={URL.JOIN}><em>회원가입</em></Link>*/}
|
||||
</Col>
|
||||
</Row>
|
||||
<button type="button" onClick={submitFormHandler}><span>LOGIN</span></button>
|
||||
<button type="button" onClick={submitFormHandler} className="btn btn-22498E btn-lg">로그인</button>
|
||||
<div className="line_t"></div>
|
||||
<div className="line_b"></div>
|
||||
<Link to={URL.JOIN} className="btn btn-outline-secondary btn-lg w-100">회원가입</Link>
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
<ul className="list">
|
||||
<li>비밀번호는 6~12자의 영문 대/소문자, 숫자, 특수문자를 혼합해서 사용하실 수 있습니다.</li>
|
||||
<li>쉬운 비밀번호나 자주 쓰는 사이트의 비밀번호가 같을 경우, 도용되기 쉬우므로 주기적으로
|
||||
변경하셔서 사용하는 것이 좋습니다.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<Modal show={findModalState} onHide={handleClose}>
|
||||
|
|
|
|||
Loading…
Reference in New Issue