Skip to content

Commit 1de0e78

Browse files
BeomSeokYuBeomSeokYu
committed
Hide signup links on auth pages
1 parent 661ef10 commit 1de0e78

2 files changed

Lines changed: 53 additions & 65 deletions

File tree

‎src/main/resources/templates/login.html‎

Lines changed: 29 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,34 @@
11
<!DOCTYPE html>
2-
<html lang="ko" xmlns:th="http://www.thymeleaf.org">
3-
<head>
4-
<meta charset="UTF-8">
5-
<title>Yu's Blog</title>
6-
<link href="/assets/css/bootstrap.min.css" rel="stylesheet">
7-
<style>
8-
.gradient-custom {
9-
background: linear-gradient(to right, rgba(106, 17, 203, 1), rgba(37, 117, 252, 1))
10-
}
11-
</style>
12-
</head>
13-
<body class="gradient-custom">
14-
<section class="d-flex vh-100">
15-
<div class="container-fluid row justify-content-center align-content-center">
16-
<div class="card bg-dark" style="border-radius: 1rem;">
17-
<div class="card-body p-5 text-center">
18-
<h2 class="text-white">LOGIN</h2>
19-
<p class="text-white-50 mt-2 mb-5">서비스를 사용하려면 로그인을 해주세요!</p>
20-
21-
<div class = "mb-2">
22-
<form action="/login" method="POST">
23-
<input type="hidden" th:name="${_csrf?.parameterName}" th:value="${_csrf?.token}" />
24-
<div class="mb-3">
25-
<label class="form-label text-white">Email address</label>
26-
<input type="email" class="form-control" name="username">
27-
</div>
28-
<div class="mb-3">
29-
<label class="form-label text-white">Password</label>
30-
<input type="password" class="form-control" name="password">
31-
</div>
32-
<button type="submit" class="btn btn-primary">로그인</button>
33-
</form>
34-
35-
<button type="button" class="btn btn-secondary mt-3" onclick="location.href='/signup'">회원가입</button>
2+
<html lang="ko"
3+
th:replace="~{layout/subLayout :: layout(~{::mainSection}, ~{::scriptSection})}"
4+
xmlns:th="http://www.thymeleaf.org">
5+
<mainSection>
6+
<div class="page">
7+
<div class="auth-shell">
8+
<div class="auth-card">
9+
<div class="auth-header">
10+
<h1 class="auth-title">로그인</h1>
11+
<p class="auth-subtitle">서비스를 사용하려면 로그인이 필요합니다.</p>
12+
</div>
13+
<form action="/login" method="POST" class="auth-form">
14+
<input type="hidden" th:name="${_csrf?.parameterName}" th:value="${_csrf?.token}" />
15+
<div class="form-field">
16+
<label class="form-label">Email address</label>
17+
<input type="email" class="form-control" name="username" placeholder="name@example.com">
18+
</div>
19+
<div class="form-field">
20+
<label class="form-label">Password</label>
21+
<input type="password" class="form-control" name="password" placeholder="비밀번호">
3622
</div>
23+
<button type="submit" class="btn btn-primary w-100">로그인</button>
24+
</form>
25+
<div class="auth-footer">
26+
<span>계정 관련 문의는 관리자에게 연락해주세요.</span>
3727
</div>
3828
</div>
3929
</div>
40-
</section>
41-
<script src="/assets/js/bootstrap.min.js"></script>
42-
<script src="/assets/js/article.js"></script>
43-
</body>
44-
</html>
30+
</div>
31+
</mainSection>
32+
<scriptSection>
33+
</scriptSection>
34+
</html>

‎src/main/resources/templates/oauthLogin.html‎

Lines changed: 24 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -3,37 +3,35 @@
33
th:replace="~{layout/subLayout :: layout(~{::mainSection}, ~{::scriptSection})}"
44
xmlns:th="http://www.thymeleaf.org">
55
<mainSection>
6-
<div class="modal modal-sheet position-static d-block p-4 py-md-5" tabindex="-1" role="dialog" id="modalSignin">
7-
<div class="modal-dialog" role="document">
8-
<div class="modal-content rounded-4 shadow">
9-
<div class="modal-header p-5 pb-4 border-bottom-0 text-center">
10-
<h1 class="fw-bold mb-0 fs-2">로그인</h1>
6+
<div class="page">
7+
<div class="auth-shell">
8+
<div class="auth-card">
9+
<div class="auth-header">
10+
<h1 class="auth-title">로그인</h1>
11+
<p class="auth-subtitle">계정 또는 소셜 로그인으로 시작하세요.</p>
1112
</div>
1213

13-
<div class="modal-body p-5 pt-0">
14-
<form action="/login" method="POST">
15-
<input type="hidden" th:name="${_csrf?.parameterName}" th:value="${_csrf?.token}" />
16-
<div class="form-floating mb-3">
17-
<input type="email" class="form-control rounded-3" id="username" name="username" placeholder="name@example.com">
18-
<label for="username">이메일</label>
19-
</div>
20-
<div class="form-floating mb-3">
21-
<input type="password" class="form-control rounded-3" id="password" name="password" placeholder="Password">
22-
<label for="password">비밀번호</label>
23-
</div>
24-
<button class="w-100 mb-2 btn btn-lg rounded-3 btn-primary" type="submit">로그인</button>
25-
<a class="w-100 mb-2 btn btn-lg rounded-3 btn-primary" href="/signup">회원가입</a>
26-
<hr class="my-4">
27-
<h2 class="fs-5 fw-bold">소셜 로그인</h2>
28-
<small class="text-body-secondary">최초 소셜 로그인 시 회원가입이 진행됩니다.</small>
29-
<a href="/oauth2/authorization/google" class="w-100 py-2 mb-2 mt-3 btn btn-outline-secondary rounded-3">
30-
Sign up with Google
31-
</a>
32-
</form>
14+
<form action="/login" method="POST" class="auth-form">
15+
<input type="hidden" th:name="${_csrf?.parameterName}" th:value="${_csrf?.token}" />
16+
<div class="form-field">
17+
<label class="form-label" for="username">이메일</label>
18+
<input type="email" class="form-control" id="username" name="username" placeholder="name@example.com">
19+
</div>
20+
<div class="form-field">
21+
<label class="form-label" for="password">비밀번호</label>
22+
<input type="password" class="form-control" id="password" name="password" placeholder="비밀번호">
23+
</div>
24+
<button class="btn btn-primary w-100" type="submit">로그인</button>
25+
</form>
26+
27+
<div class="auth-divider">
28+
<span>소셜 로그인</span>
3329
</div>
30+
<p class="auth-hint">소셜 로그인으로 바로 시작할 수 있습니다.</p>
31+
<a href="/oauth2/authorization/google" class="btn btn-outline w-100">Google로 시작하기</a>
3432
</div>
3533
</div>
3634
</div>
3735
</mainSection>
3836
<scriptSection></scriptSection>
39-
</html>
37+
</html>

0 commit comments

Comments
 (0)