|
|
<!DOCTYPE html> |
|
|
<html lang="ko"> |
|
|
<head> |
|
|
<script type="text/javascript"> |
|
|
(function(c,l,a,r,i,t,y){ |
|
|
c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)}; |
|
|
t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i; |
|
|
y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y); |
|
|
})(window, document, "clarity", "script", "ujskfvh0bu"); |
|
|
</script> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>๋น๋ฐ๋ฒํธ ๋ณ๊ฒฝ - SOY NV AI</title> |
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin> |
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet"> |
|
|
<style> |
|
|
* { |
|
|
margin: 0; |
|
|
padding: 0; |
|
|
box-sizing: border-box; |
|
|
} |
|
|
|
|
|
body { |
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; |
|
|
background: #f0f2f5; |
|
|
color: #202124; |
|
|
display: flex; |
|
|
justify-content: center; |
|
|
align-items: center; |
|
|
min-height: 100vh; |
|
|
} |
|
|
|
|
|
.container { |
|
|
width: 100%; |
|
|
max-width: 400px; |
|
|
padding: 20px; |
|
|
} |
|
|
|
|
|
.card { |
|
|
background: white; |
|
|
padding: 40px; |
|
|
border-radius: 8px; |
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 8px 16px rgba(0, 0, 0, 0.1); |
|
|
} |
|
|
|
|
|
.logo { |
|
|
text-align: center; |
|
|
margin-bottom: 24px; |
|
|
font-size: 24px; |
|
|
font-weight: 600; |
|
|
color: #1a73e8; |
|
|
} |
|
|
|
|
|
.title { |
|
|
text-align: center; |
|
|
margin-bottom: 8px; |
|
|
font-size: 20px; |
|
|
font-weight: 500; |
|
|
} |
|
|
|
|
|
.subtitle { |
|
|
text-align: center; |
|
|
margin-bottom: 24px; |
|
|
font-size: 14px; |
|
|
color: #5f6368; |
|
|
} |
|
|
|
|
|
.form-group { |
|
|
margin-bottom: 16px; |
|
|
} |
|
|
|
|
|
.form-group label { |
|
|
display: block; |
|
|
margin-bottom: 8px; |
|
|
font-size: 14px; |
|
|
font-weight: 500; |
|
|
color: #202124; |
|
|
} |
|
|
|
|
|
.form-group input { |
|
|
width: 100%; |
|
|
padding: 10px 12px; |
|
|
border: 1px solid #dadce0; |
|
|
border-radius: 4px; |
|
|
font-size: 16px; |
|
|
transition: border-color 0.2s; |
|
|
} |
|
|
|
|
|
.form-group input:focus { |
|
|
outline: none; |
|
|
border-color: #1a73e8; |
|
|
box-shadow: 0 0 0 2px rgba(26, 115, 232, 0.2); |
|
|
} |
|
|
|
|
|
.btn { |
|
|
width: 100%; |
|
|
padding: 10px 12px; |
|
|
background: #1a73e8; |
|
|
color: white; |
|
|
border: none; |
|
|
border-radius: 4px; |
|
|
font-size: 16px; |
|
|
font-weight: 500; |
|
|
cursor: pointer; |
|
|
transition: background 0.2s; |
|
|
} |
|
|
|
|
|
.btn:hover { |
|
|
background: #1557b0; |
|
|
} |
|
|
|
|
|
.alert { |
|
|
padding: 12px; |
|
|
border-radius: 4px; |
|
|
margin-bottom: 20px; |
|
|
font-size: 14px; |
|
|
background: #fce8e6; |
|
|
color: #c5221f; |
|
|
text-align: center; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
<div class="container"> |
|
|
<div class="card"> |
|
|
<div class="logo">SOY NV AI</div> |
|
|
<div class="title">๋น๋ฐ๋ฒํธ ๋ณ๊ฒฝ</div> |
|
|
<div class="subtitle">๋ณด์์ ์ํด ๋น๋ฐ๋ฒํธ๋ฅผ ๋ณ๊ฒฝํด์ผ ํฉ๋๋ค.</div> |
|
|
|
|
|
{% if error %} |
|
|
<div class="alert"> |
|
|
{{ error }} |
|
|
</div> |
|
|
{% endif %} |
|
|
|
|
|
<form method="POST" action="{{ url_for('main.change_password_post') }}"> |
|
|
<div class="form-group"> |
|
|
<label for="password">์ ๋น๋ฐ๋ฒํธ</label> |
|
|
<input type="password" id="password" name="password" required autofocus> |
|
|
</div> |
|
|
|
|
|
<div class="form-group"> |
|
|
<label for="confirm_password">์ ๋น๋ฐ๋ฒํธ ํ์ธ</label> |
|
|
<input type="password" id="confirm_password" name="confirm_password" required> |
|
|
</div> |
|
|
|
|
|
<button type="submit" class="btn">๋น๋ฐ๋ฒํธ ๋ณ๊ฒฝ</button> |
|
|
</form> |
|
|
</div> |
|
|
</div> |
|
|
</body> |
|
|
</html> |
|
|
|
