File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
<template>
<div class="w1400">
<div class=" login-sec">
<section class="login-logo">
<div class="login-logo-d">
<img src="../../../resources/jpg/logo/keris.gif" alt="">
<h1>AI 디지털교과서 통합지원센터</h1>
</div>
</section>
<section class="login-input">
<div class="login-input-d">
<div class="ID">
<input type="text" class="id" value="아이디를 입력하세요.">
</div>
<div class="PW">
<input type="password" class="password" value="비밀번호를 입력하세요.">
</div>
</div>
</section>
<section class="login-checkbox">
<div class="login-checkbox-i">
<input type="checkbox">
<span>
로그인상태 유지
</span>
</div>
<div class="login-checkbox-b">
<button>아이디 찾기</button>
<button>비밀번호찾기</button>
<button>회원가입</button>
</div>
</section>
<section class="login-button">
<button>로그인</button>
</section>
</div>
</div>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
},
watch: {
},
computed: {
},
mounted() {
console.log('Login mounted');
}
}
</script>
<style scoped>
.w1400 {
overflow-y: hidden;
margin: 0 auto;
text-align: center;
}
.login-sec section {
/* border: 1px solid red; */
}
.login-logo {
width: 100%;
padding-top: 11rem;
}
.login-logo-d img {
width: 300px;
text-align: center;
/* border: 1px solid red; */
margin: 0 auto;
padding: 3rem;
}
.login-logo-d h1 {
/* border: 1px solid red; */
font-family: SBaggroM;
font-weight: 500;
color: #063a6d;
font-size: 2.5rem;
}
.login-input {
width: 100%;
display: flex;
flex-direction: column;
}
.login-input-d div {
width: 100%;
padding: 1rem;
}
.ID input,
.PW input {
width: 40rem;
height: 6rem;
border: 1px solid #9a9a9a;
border-radius: 1.2rem;
padding: 1rem;
color: #9a9a9a;
}
.login-checkbox {
width: 100%;
}
.login-checkbox-i {
width: 40rem;
text-align: left;
margin: 0 auto;
/* border: 1px solid red; */
}
.login-checkbox-i input[type=checkbox] {
text-align: left;
margin: 1rem;
/* border: 1px solid red; */
transform: scale(1.5);
}
.login-checkbox-i span {
font-size: 1.5rem;
}
.login-checkbox-b {
padding: 6rem;
}
.login-checkbox-b button {
padding: 1rem;
/* margin: 1rem; */
color: #333;
font-family: "Pretendard-Regular";
font-weight: 500;
font-size: 1.5rem;
background-color: #06396d00;
}
.login-checkbox-b button:nth-child(1) {
position: relative;
}
.login-checkbox-b button:nth-child(1)::after,
.login-checkbox-b button:nth-child(2)::after {
content: 'ㅣ';
float: right;
display: block;
margin-left: 20px;
}
.login-button {
width: 100%;
padding: 0rem 0rem 10rem 0rem;
}
.login-button button {
width: 40rem;
padding: 2rem;
background-color: #3f87f7;
color: white;
font-size: 1.7rem;
border-radius: 1.2rem;
cursor: pointer;
}
</style>