-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathnew_feed2.html
187 lines (181 loc) · 7.3 KB
/
new_feed2.html
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
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
<!--
게시물 작성 페이지-2
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="../css/base.css" />
<link rel="stylesheet" href="../css/new_feed2.css" />
<title>Logged.me</title>
<script src="../js/api.js"></script>
</head>
<body>
<form id="new-post-form">
<div class="page__wrap">
<div class="page__img">
<div class="page__inner">
<div class="new_feed1">
<div class="head">
<a href="#" onclick="goBack()">
<img src="../image/new_feed1_closeBtn.png" id="closeBtn" />
</a>
<div class="New_post">New post</div>
<p class="Next" id="Next" role="button">Next</p>
</div>
<main class="main_body">
<div id="new_post_image">
<div id="preview_image"></div>
</div>
<div class="photo_add">
<div class="container">
<p class="preview_title">photo</p>
<div class="preview" id="preview">
<label class="label" id="label" for="input">
<div class="inner" id="inner">
<img
src="../image/new_feed1_AddBtn.png"
id="add_btn"
/>
</div>
</label>
</div>
<!-- accept: 파일 유형, type: 파일, required: form양식에서 꼭 필요한 값, multiple: 여러개의 파일 업로드 가능(true), hidden: 위의 label을 사용하기 위해서 input을 겉으로 보이지 않게 함.-->
<input
name="images"
id="input"
class="input"
accept="image/*"
type="file"
required="true"
multiple="true"
hidden="true"
/>
</div>
</div>
</main>
</div>
<div class="new_feed2">
<div class="head">
<img src="../image/new_feed2_backBtn.png" id="backBtn" />
<div class="New_post">New post</div>
<div id="Share">Share</div>
</div>
<main>
<!-- 게시물 사진 부분 (슬라이드)-->
<div class="slider__wrap">
<div class="slider__img">
<div class="slider__inner Next">
<!--<div class="slider" role="group"><img class="sliderImg" src="../image/bottom_nav_person.png"></div>-->
</div>
</div>
<div class="slider__btn">
<img
src="../image/new_feed2_leftarrow.png"
class="prev"
role="button"
/>
<img
src="../image/new_feed2_rightarrow.png"
class="next"
role="button"
/>
</div>
<div class="slider__dot"></div>
</div>
<!-- 게시물 내용(프로필, 내용, 기업태그) 부분 -->
<div id="feed_content">
<div id="profile_image">
<img id="profile" src="../image/new_feed1_rectangle.png" />
</div>
<textarea
id="text"
type="text"
onchange="giveText()"
name="content"
maxlength="1800"
placeholder="Write a caption..."
></textarea>
<!--
input으로 text를 입력하는 것에 있어서 개행과 줄바꿈, 입력의 시작점 상단 설정이 불가능 하다.
가능한 방법은 textarea 또는 pre 태그 같은 놈들 이용
그러고 위에 id="text"의 input태그의 value값에 textarea의 value 값을 넣어주고
input type=text인 태그를 백에 전송해 주는 방법 밖에 없다.
-->
</div>
<!-- 기업 태그 부분(모달창 띄우기 버튼)-->
<button id="open_modal">
<p class="Tag_text">Tag company</p>
<img class="arrow" src="../image/tagCompanyArrow.png" />
</button>
<div class="modal_overlay">
<div class="modal_content">
<div class="modal_header">
<img class="close_btn" src="../image/Cancel.png" />
<p class="Done" role="button">Done</p>
</div>
<div class="modal_container">
<p class="tagCompany_text">태그할 기업을 검색해주세요.</p>
<!-- 디바운스 파트! -->
<div class="search_box">
<img class="search_img" src="../image/search.png" />
<input class="box" type="text" placeholder="search" />
</div>
<div class="company_list">
<!-- 기업 목록들! -->
</div>
</div>
</div>
</div>
</main>
</div>
</div>
</div>
</div>
</form>
<!-- 여기서부터 -->
<section class="base_bottom_nav">
<a href="./corporation_feed.html" class="base_bottom_nav_item"
><img
src="../image/bottom_nav_enterprise.png"
alt="enterprise"
id="bottom_nav_enterprise_image"
class="base_bottom_nav_item_image"
/></a>
<a href="./personal_feed.html" class="base_bottom_nav_item"
><img
src="../image/bottom_nav_person.png"
alt="person"
id="bottom_nav_person_image"
class="base_bottom_nav_item_image"
/></a>
<a href="./search_main.html" class="base_bottom_nav_item"
><img
src="../image/bottom_nav_search.png"
alt="search"
id="bottom_nav_search_image"
class="base_bottom_nav_item_image"
/></a>
<a href="./new_feed2.html" class="base_bottom_nav_item"
><img
src="../image/bottom_nav_plus.png"
alt="addPost"
class="base_bottom_nav_plus_image"
/>
</a>
<div class="base_bottom_nav_item">
<img
src="../image/bottom_nav_profile.png"
alt="profile"
id="bottom_nav_profile_image"
class="base_bottom_nav_item_image"
/>
</div>
</section>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="../js/base.js"></script>
<!-- 여기까지 복붙 하면 됩니다ㅏ(본인 js 연결코드 지우지 않게 조심...)-->
<script src="../js/new_feed2.js"></script>
</html>