Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

임예솔 과제 제출합니다 #1

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open

임예솔 과제 제출합니다 #1

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
5f2083a
임예솔 과제 제출합니다
Oct 11, 2024
595df07
임예솔 과제 제출합니다
Oct 11, 2024
c2bc084
임예솔 과제 제출합니다
Oct 15, 2024
51ea05a
진짜최종수정
Oct 27, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
58 changes: 58 additions & 0 deletions as_1.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
body {
background-color: #585858;
display: flex;
position: relative;
justify-content: center;
align-items: center;
}

.login {
width: 400px;
height: 500px;
background-color: white;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
text-align: center;
margin-top: 100px;
}

#button {
width: 300px;
height: 40px;
background-color: #03c75a;
border-radius: 5px;
border: 1px solid #03c75a;
margin: 40px auto;
color: white;
}

.logo {
width: 400px;
height: 180px;
}

hr {
color: #e1e1e1;
width: 100%;
border: none;
height: 1px;
background-color: #e1e1e1;
}

.text {
border: 2px solid #e1e1e1;
width: 300px;
height: 35px;
margin-top: 10px;
border-radius: 5px;
display: flex;
align-items: center;
padding-left: 10px;
}

input {
border: none;
width: 100%;
}
53 changes: 53 additions & 0 deletions as_1.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,[email protected],100..700,0..1,-50..200&icon_names=person"
/>
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,[email protected],100..700,0..1,-50..200&icon_names=lock"
/>

<title>과제 1</title>
<link rel="stylesheet" href="as_1.css" />
<script>
function login() {
var id = document.getElementById("id").value;
var pw = document.getElementById("pw").value;

if (id === "") {
alert("아이디를 입력해주세요.");
return false;
} else if (pw === "") {
alert("비밀번호를 입력해주세요.");
return false;
}
window.location.href = "success.html";
return false;
}
</script>
</head>
<body>
<div>
<div class="login">
<img src="./logo.jpeg" alt="logo" class="logo" />
<hr />
<form onsubmit="return login()">
<div class="text">
<i class="material-symbols-outlined"> person </i>
<input type="text" id="id" placeholder="아이디" />
</div>
<div class="text">
<i class="material-symbols-outlined"> lock </i>
<input type="password" id="pw" placeholder="비밀번호" />
</div>
<button type="submit" id="button">로그인</button>
</form>
</div>
</div>
</body>
</html>
64 changes: 64 additions & 0 deletions as_2.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
body {
background-color: #585858;
display: flex;
position: relative;
justify-content: center;
align-items: center;
}

.login {
width: 400px;
height: 500px;
background-color: #585858;
justify-content: center;
text-align: center;
margin-top: 100px;
border: 1px solid white;
}

.logo {
width: 400px;
height: 180px;
}

.check {
margin-left: 10px;
}
.form {
color: white;
}
.pilsu {
color: #03c75a;
margin-right: 3px;
}

.form {
text-align: left;
}

.text {
color: white;
border: 1px solid white;
border-radius: 5px;
padding: 8px 6px;
margin: 4px 10px;
font-size: 80%;
}

label {
font-weight: bold;
}

#button {
width: 350px;
height: 45px;
background-color: #999999;
color: black;
border-radius: 5px;
border: none;
margin: 40px auto;
}

.yakgwan {
margin-top: 8px;
}
59 changes: 59 additions & 0 deletions as_2.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,59 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>과제 2</title>
<link rel="stylesheet" href="as_2.css" />
<script>
function check() {
var ch1 = document.getElementById("ch1").checked;
var ch2= document.getElementById("ch2").checked;
var success = document.getElementById("button");

if (ch1 && ch2) {
button.style.backgroundColor = "#03c75a";
button.disabled = false;
} else {
button.style.backgroundColor = "";
button.disabled = true;
}
}
function login() {
window.location.href = "success.html";
}

</script>
</head>
<body>
<div>
<div class="login">
<img src="./logo.jpeg" alt="logo" class="logo" />
<form onsubmit="login()">
<div class="form">
<div class="yakgwan">
<input type="checkbox" class="check" id="ch1" onchange="check()">
<label for="check1"><span class="pilsu">[필수]</span> 가입약관</label>
<div class="text">
GDG서비스를 이용하시거나 서비스 회원으로 가입하실 경우 여러
분은 본 약관 및 관련 운영 정책을 확인하거나 동의하게 되므로, 잠시 시간을 내시어 주의 깊게 살펴봐 주시기 바랍니다.
</div>
</div>
<div class="yakgwan">
<input type="checkbox" class="check" id="ch2" onchange="check()">
<label for="check2"><span class="pilsu">[필수]</span>가입약관</label>

<div class="text">
실명 인증된 아이디로 가입,위치 기반 서비스 이용약관, 이벤트 혜택 정보 수신 동의를 포함합니다.
</div>

</div>
</div>

<button type="button" id="button" onclick="login()" disabled>
로그인
</button>
</form>
</div>
</body>
</html>
65 changes: 65 additions & 0 deletions as_3.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
body {
background-color: #585858;
display: flex;
position: relative;
justify-content: center;
align-items: center;
margin: 0;
}

.login {
width: 400px;
height: 600px;
background-color: white;
justify-content: center;
text-align: center;
margin-top: 90px;
border: 1px solid white;
}

.logo {
width: 400px;
height: 180px;
}

hr {
color: #585858;
}

input {
width: 300px;
height: 25px;
margin-bottom: 10px;
}

.button1 {
width: 180px;
height: 35px;
background-color: #03c75a;
border-radius: 5px;
border: 1px solid #03c75a;
margin: 110px 5px 20px 5px;
color: white;
}

.button2 {
width: 100px;
height: 35px;
background-color: #f51d1d;
border-radius: 5px;
border: 1px solid #f51d1d;
margin: 110px 5px 20px 5px;
color: white;
}

.join {
position: absolute;
width: 100%;
height: 100%;
text-align: right;
color: white;
}

h6 {
margin-right: 20px;
}
30 changes: 30 additions & 0 deletions as_3.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title>과제 3</title>
<link rel="stylesheet" href="as_3.css" />
</head>
<body>
<div class="join">
<h6>회원가입</h6>
<hr />
</div>
<div>
<div class="login">
<img src="./logo.jpeg" alt="logo" class="logo" />
<hr />
<input type="text" placeholder="아이디" /> <br />
<input type="password" placeholder="비밀번호" /> <br />
<input type="email" placeholder="이메일" /> <br />
<input type="text" placeholder="이름" /> <br />
<input type="text" placeholder="생년월일" /> <br />
<input type="tel" placeholder="전화번호" /> <br />
<button type="button" class="button1">회원가입</button>
<button type="button" class="button2">닫기</button>
</div>
</div>
</body>
</html>
Binary file added logo.jpeg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions success.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
body {
background-color: blueviolet;
}

h1 {
color: white;
text-align: center;
margin-top: 300px;
}

img {
margin-left: 40%;
}
19 changes: 19 additions & 0 deletions success.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />

<title>성공페이지</title>
<link rel="stylesheet" href="success.css" />
</head>
<body>
<div>
<h1>로그인 성공</h1>
<img
src="https://i.namu.wiki/i/P8XpSZJduKshXtF99ck16usyByiFp8dn5dz2cdTYyQC_8SAn12_GeVr8A6HWeugHkzGlSytZ0boH-VnAF2gthQ.png"
alt="화났어요"
/>
</div>
</body>
</html>