-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathbase.html
More file actions
151 lines (144 loc) · 8.55 KB
/
Copy pathbase.html
File metadata and controls
151 lines (144 loc) · 8.55 KB
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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Watcha Pedia</title>
<link rel="short icon" href="asset/favicon.jpeg">
<link rel="stylesheet" href="base.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KK94CHFLLe+nY2dmCWGMq91rCGa5gtU4mk92HdvYe+M/SXH301p5ILy+dN9+nJOZ" crossorigin="anonymous">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" />
</head>
<body>
<header>
<nav class="navbar navbar-expand-lg fixed-top">
<div class="container">
<!-- 로고 -->
<a class="navbar-brand" href="#">
<img src="asset/logo.svg" alt="logo" class="base-logo">
</a>
<div class="d-flex align-items-center gap-3">
<!-- 검색 -->
<form class="d-flex" role="search">
<label for="search" class="d-flex align-items-center search-label bg-light">
<span class="material-symbols-outlined text-body-tertiary">
search
</span>
<input class="search-input border-0 bg-light ms-1" type="search" placeholder="콘텐츠, 인물, 컬렉션, 유저를 검색해보세요." name="q" aria-label="Search" id="search">
</label>
</form>
<!-- 로그인 및 회원가입 -->
<a type="button" data-bs-toggle="modal" data-bs-target="#loginModal" class="text-decoration-none text-secondary login-Btn">로그인</a>
<a type="button" data-bs-toggle="modal" data-bs-target="#signupModal" class="text-decoration-none text-secondary signup-Btn">회원가입</a>
</div>
</div>
</nav>
</header>
<main></main>
<footer>
<section class="d-flex justify-content-center align-items-center bg-black fw-normal fs-5 gap-2">
<span class="text-white">지금까지</span>
<span class="survey-cnt"> ★ 0000000 개의 평가가 </span>
<span class="text-white">쌓였어요.</span>
</section>
<section>
<div class="container">
<div class="d-flex align-items-center">
<div class="col-6 d-flex flex-column gap-1 mt-5">
<img src="asset/logo_gray.png" alt="logo" class="base-logo">
<div>Copyright © 2023 team 1. <a href="https://github.com/red-glasses1/red-glasses" class="text-light text-decoration-none">빨간 안경</a>
</div>
<div>multi-campus KDT 2th semi-project2</div>
</div>
<div class="col-6 d-flex gap-3 mt-5 justify-content-end">
<div class="me-4"><b>Members</b></div>
<div class="d-flex flex-column gap-3">
<a class="text-decoration-none text-secondary" href="https://github.com/S05p">김강섭</a>
<a class="text-decoration-none text-secondary" href="https://github.com/kimchowon98">김초원</a>
</div>
<div class="d-flex flex-column gap-3">
<a class="text-decoration-none text-secondary" href="https://github.com/mangji12">오창인</a>
<a class="text-decoration-none text-secondary" href="https://github.com/IM-jihye">임지혜</a>
</div>
<div class="d-flex flex-column gap-3">
<a class="text-decoration-none text-secondary" href="https://github.com/JeonggonCho">조정곤</a>
</div>
</div>
</div>
</div>
</section>
</footer>
<!-- login Modal -->
<div class="modal fade" id="loginModal" tabindex="-1" aria-labelledby="loginModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content flex-column align-items-center w-75 p-4 py-5">
<!-- 로그인 타이틀 -->
<div class="d-flex flex-column align-items-center gap-5 mb-3">
<img src="asset/logo.svg" alt="">
<h6><b>로그인</b></h6>
</div>
<!-- 로그인 입력부분 -->
<div class="d-flex flex-column log-input w-100 gap-2 mb-4">
<input type="text" placeholder="이메일">
<input type="text" placeholder="비밀번호">
<input type="submit" value="로그인" class="log-submit_btn mt-3">
</div>
<!-- 회원가입 연결 -->
<div class="log-link">
<span>계정이 없으신가요?</span>
<a href="#">회원가입</a>
</div>
<div class="d-flex align-items-center gap-3 w-100 mt-3">
<div class="line"></div>
<div class="text-secondary">OR</div>
<div class="line"></div>
</div>
<!-- 소셜로그인 연결 -->
<div class="d-flex align-items-center justify-content-center gap-3 w-100 mt-3">
<a href="#" class="kakao-log_btn d-flex align-items-center justify-content-center"><img src="asset/kakao_logo.png" alt="" style="width: 22px; height: 20px;"></a>
<a href="#" class="google-log_btn d-flex align-items-center justify-content-center"><img src="asset/Google_logo.png" alt="" style="width: 20px; height: 20px;"></a>
<a href="#"class="naver-log_btn d-flex align-items-center justify-content-center text-white fw-bold fs-4 text-decoration-none">N</a>
</div>
</div>
</div>
</div>
<!-- signup Modal -->
<div class="modal fade" id="signupModal" tabindex="-1" aria-labelledby="signupModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content flex-column align-items-center w-75 p-4 py-5">
<!-- 회원가입 타이틀 -->
<div class="d-flex flex-column align-items-center gap-5 mb-3">
<img src="asset/logo.svg" alt="">
<h6><b>회원가입</b></h6>
</div>
<!-- 회원가입 입력부분 -->
<div class="d-flex flex-column log-input w-100 gap-2 mb-4">
<input type="text" placeholder="이름">
<input type="text" placeholder="이메일">
<input type="text" placeholder="비밀번호" class="input-password">
<input type="submit" value="회원가입" class="log-submit_btn mt-3">
</div>
<!-- 로그인 연결 -->
<div class="log-link">
<span>이미 가입하셨나요?</span>
<a href="#">로그인</a>
</div>
<div class="d-flex align-items-center gap-3 w-100 mt-3">
<div class="line"></div>
<div class="text-secondary">OR</div>
<div class="line"></div>
</div>
<!-- 소셜로그인 연결 -->
<div class="d-flex align-items-center justify-content-center gap-3 w-100 mt-3">
<a href="#" class="kakao-log_btn d-flex align-items-center justify-content-center"><img src="asset/kakao_logo.png" alt="" style="width: 22px; height: 20px;"></a>
<a href="#" class="google-log_btn d-flex align-items-center justify-content-center"><img src="asset/Google_logo.png" alt="" style="width: 20px; height: 20px;"></a>
<a href="#"class="naver-log_btn d-flex align-items-center justify-content-center text-white fw-bold fs-4 text-decoration-none">N</a>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ENjdO4Dr2bkBIFxQpeoTz1HIcje39Wm4jDKdf19U8gI4ddQ3GYNS7NTKfAdVQSZe" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</body>
</html>