아이디·비밀번호 찾기
diff --git a/frontend/src/pages/LoginPage.jsx b/frontend/src/pages/LoginPage.jsx
index 6f3f519..78b6116 100644
--- a/frontend/src/pages/LoginPage.jsx
+++ b/frontend/src/pages/LoginPage.jsx
@@ -2,6 +2,7 @@
import { useState } from 'react';
import { useNavigate, Navigate, Link } from 'react-router-dom';
import { useAuth } from '../AuthContext';
+import PasswordInput from '../components/PasswordInput';
export default function LoginPage() {
const { user, login } = useAuth();
@@ -52,7 +53,7 @@ export default function LoginPage() {
-
setPassword(e.target.value)}
autoComplete="current-password"
diff --git a/frontend/src/pages/SignupPage.jsx b/frontend/src/pages/SignupPage.jsx
index 67f3ea7..20ec34b 100644
--- a/frontend/src/pages/SignupPage.jsx
+++ b/frontend/src/pages/SignupPage.jsx
@@ -6,6 +6,7 @@ import { useNavigate, Link, Navigate } from 'react-router-dom';
import { useAuth } from '../AuthContext';
import client from '../api/client';
import { embedPostcode } from '../lib/postcode';
+import PasswordInput from '../components/PasswordInput';
const TRACKS = [
{ value: 'DEV', label: '개발' },
@@ -41,18 +42,20 @@ const EMPTY = {
* (밖으로 나오면서 form/set에 직접 접근할 수 없으니 value와 onChange를 props로 받는다.)
*/
function Field({ label, k, type = 'text', placeholder, autoComplete, value, onChange }) {
+ // 공통 props — 일반 input과 비밀번호(눈 토글) 둘 다 같은 값을 받는다.
+ const shared = {
+ id: `su-${k}`,
+ className: 'input',
+ value,
+ onChange: (e) => onChange(k, e.target.value),
+ placeholder,
+ autoComplete,
+ };
return (
);
}
@@ -170,7 +173,7 @@ export default function SignupPage() {
- AWESOMEDEV 수습 플랫폼
+ AWESOMEDEV 학습 플랫폼
수습생 회원가입
diff --git a/frontend/src/pages/courses/PwaPage.jsx b/frontend/src/pages/courses/PwaPage.jsx
index 03887e0..bdcf7a7 100644
--- a/frontend/src/pages/courses/PwaPage.jsx
+++ b/frontend/src/pages/courses/PwaPage.jsx
@@ -25,7 +25,7 @@ const CODE_SPECTRUM = `웹 페이지 ───────────── PWA
const CODE_MANIFEST = `// manifest.webmanifest — 브라우저에게 "나 이런 앱이야"라고 소개하는 명함
{
- "name": "AWESOMEDEV 수습 학습 플랫폼",
+ "name": "AWESOMEDEV 학습 플랫폼",
"short_name": "미림학습", // 홈 화면 아이콘 아래 짧은 이름
"start_url": "/", // 아이콘을 누르면 열릴 주소
"display": "standalone", // 주소창 없이 '앱처럼' 전체화면
@@ -113,7 +113,7 @@ export default defineConfig({
VitePWA({
registerType: 'autoUpdate', // 새 버전 배포 시 서비스워커 자동 교체
manifest: {
- name: 'AWESOMEDEV 수습 학습 플랫폼',
+ name: 'AWESOMEDEV 학습 플랫폼',
short_name: '미림학습',
display: 'standalone',
theme_color: '#4f46e5',
diff --git a/frontend/src/pages/courses/ToolPostmanPage.jsx b/frontend/src/pages/courses/ToolPostmanPage.jsx
index 8a6cea5..7614db3 100644
--- a/frontend/src/pages/courses/ToolPostmanPage.jsx
+++ b/frontend/src/pages/courses/ToolPostmanPage.jsx
@@ -89,7 +89,7 @@ const CODE_COOKIE = `로그인 후 쿠키는 어디에? — Postman이 알아서
const CODE_COLLECTION = `컬렉션 = 요청들을 담아 두는 폴더 (즐겨찾기 + 실행 순서)
-📁 AWESOMEDEV 수습 플랫폼 ← 컬렉션 (New → Collection)
+📁 AWESOMEDEV 학습 플랫폼 ← 컬렉션 (New → Collection)
├─ ① POST /api/auth/login 로그인 (출입증 받기)
├─ ② GET /api/checklist 내 체크리스트 조회
├─ ③ POST /api/checklist/1/submit 항목 제출
@@ -354,7 +354,7 @@ export default function ToolPostmanPage() {
무슨 순서로 실행해야 하는지 바로 보입니다.
- 직접 확인해 보기 ③ "AWESOMEDEV 수습 플랫폼" 컬렉션을 만들고,
+ 직접 확인해 보기 ③ "AWESOMEDEV 학습 플랫폼" 컬렉션을 만들고,
섹션 3~4에서 보낸 요청들을 저장해 넣으세요. 그리고 Postman을 완전히 껐다 켠 뒤
컬렉션에서 로그인부터 순서대로 다시 실행 — 어제의 실험을 오늘 그대로
재현할 수 있다는 것, 이게 컬렉션의 힘이에요.
diff --git a/frontend/src/styles/global.css b/frontend/src/styles/global.css
index 4e7f5ca..f879991 100644
--- a/frontend/src/styles/global.css
+++ b/frontend/src/styles/global.css
@@ -331,6 +331,37 @@ a {
resize: vertical;
}
+/* 비밀번호 입력창 + 눈 토글 (PasswordInput) */
+.password-wrap {
+ position: relative;
+}
+/* 눈 버튼이 앉을 자리를 오른쪽에 비워 둔다 — 글자가 버튼 밑으로 파고들지 않게 */
+.password-wrap .input {
+ padding-right: 42px;
+}
+.password-toggle {
+ position: absolute;
+ top: 50%;
+ right: 6px;
+ transform: translateY(-50%);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 4px 6px;
+ background: none;
+ border: none;
+ border-radius: 8px;
+ font-size: 16px;
+ line-height: 1;
+ cursor: pointer;
+}
+.password-toggle:hover {
+ background: var(--bg);
+}
+.password-toggle:focus-visible {
+ outline: 2px solid var(--primary-soft);
+}
+
.field {
margin-bottom: 14px;
}