Pin_tage/signup.html at main · Pin-tage/Pin_tage · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="./favicon.png"> <!--favicon-->
    <link href="https://fonts.googleapis.com/css?family=Cherry+Bomb" rel="stylesheet"> <!--상단 내비 폰트-->

    <link rel="stylesheet" href="./css/signup.css">
    <title>Pin!tage</title>
    <script src="./js/signup.js"></script>
</head>
<body>
    <!--상단 nav-->
    <nav>
        <logo><img src="./assets/logo2.png"></logo>
        <menu>
            <ul>
                <li><a href="./index.php" class="top-nav">MAIN</a></li>
                <li><a href="./search_test.php" class="top-nav">SEARCH</a></li>
                <li><a href="./map.php" class="top-nav">PIN!MAP</a></li>
                <li><a href="./mypage_H.php" class="my_page"></a>MYPAGE</li>
            </ul>
        </menu>
        <a href="./login.html" class="login"><input type="button" value="LOGIN" class="login-Btn"></a>
    </nav>

    <main>
        <div class="title">
            <h1>회원가입</h1>
        </div>
        <div class="header">
            <h2>핀티지에 오신 것을 환영해요!</h2>
        </div>
        <div class="signup-form">
            <form method="post" action="./signup.php">

                <div class="input-name">
                    <label for="name">이름</label>
                    <input type="text" id="name" name="user_name" required placeholder="이름을 입력하세요.">
                    <br>
                </div>

                <div class="input-email">
                    <label for="emailPrefix">이메일</label>
                    <input type="text" id="emailPrefix" name="emailPrefix" required placeholder="pintage">@
                    <select id="emailDomain" name="emailDomain" required>
                        <option value="naver.com">naver.com</option>
                        <option value="gmail.com">gmail.com</option>
                    </select>
                    <br>
                </div>

                <div class="input-id">
                    <label for="user_id">아이디</label>
                    <input type="text" id="user_id" name="user_id" required placeholder="3자 이상">
                    <button type="button" id="checkDuplicateBtn" onclick="checkDuplicate()" class="pink-btn">중복확인</button>
                    <div id="idCheckResult"></div><!-- 아이디 중복 확인 결과를 표시할 요소 -->
                    <br>
                </div>

                <div class="input-password">
                    <label for="password">비밀번호</label>
                    <div class="password-inputs">
                        <input type="password" id="password" name="user_pw" required placeholder="비밀번호">
                        <input type="password" id="confirmPassword" name="confirmPassword" required placeholder="비밀번호 확인">
                    </div>
                    <br>
                </div>


                <div class="button-container">
                    <button type="submit" class="signup-btn pink-btn">가입하기</button>
                    <button type="button" class="cancel-btn">취소</button>
                </div>
            </form>
        </div>

    </main>
</body>
</html>