Feat: applyRequest.html 레이아웃 구조

A-to-P · Jul 3, 2023 · c03afe0 · c03afe0
1 parent 4732c6c
commit c03afe0
Show file tree

Hide file tree

Showing 2 changed files with 94 additions and 11 deletions.
diff --git a/matching/static/css/applyRequest.css b/matching/static/css/applyRequest.css
@@ -1,10 +1,66 @@
-.request_wrapper{
+.request_wrapper, .application_wrapper{
     margin: 0 auto;
     padding: 1rem;
-    width: 30rem;
-    height: 33rem;
+    width: 70%;
+    height: fit-content;
 }
 
-.request_container {
+.request_container, .application_container{
+    padding: 1rem;
+    background-color: white;
+}
+
+.request_container > *, .application_container > * {
+    margin : 1rem 0;
+}
+
+div[class^="request_info_"], div[class^="application_input_"]{  /*~로 시작하는 속성 선택*/
+    margin: 0.5rem 0.5rem;
+    padding: 0.5rem 1.5rem;
+    max-height: 15rem;
+    border : gray 0.2rem solid;
     background-color: white;
+}
+
+.consultant_wrapper{
+    position: relative;
+}
+.consultant_wrapper>*{
+    width: 50%;
+}
+
+.application_input_category{
+    /* float:left; */
+}
+
+div[class^="request_info_"]:not(.request_info_title, .request_info_content){  /*~로 시작하는 속성 선택*/
+
+}
+
+.restaurant_info_wrapper, .consulting_info_wrapper {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.request_text, .application_text{
+    margin: 0.2rem;
+    font-size: 1rem;
+    font-weight: 600;
+}
+
+.request_info_content{
+    overflow-y: scroll;
+}
+
+.application_input_content{
+    width: 100%;
+    height: 14rem;
+}
+
+.submit_button{
+    position: absolute;
+    width: 8rem;
+    height: 3rem;
+    bottom: 0rem;
+    right: 0rem;
 }
diff --git a/matching/templates/applyRequest.html b/matching/templates/applyRequest.html
@@ -11,16 +11,43 @@
 <div class="request_wrapper">
     <div class="request_text">컨설팅 의뢰 글 내용</div>
     <div class="request_container">
-        <div class="reqeust_title">의뢰글 제목</div>
-        <div class="restaurant_info_wrapper">
-            <div class="request_text">요식업자 정보(프로필 보러가기)</div>
+        <div class="request_info_title">의뢰글 제목</div>
+        <div class="restaurant_wrapper">
+            <div class="request_text">
+                요식업자 정보
+                <a href="{% url 'myProfile' %}" >(프로필 보러가기)</a>
+            </div>
+            <div class="restaurant_info_wrapper">
+                <div class="request_info_name">이름(나이) 아무개(35세)</div>
+                <div class="request_info_category">요식업 분야 양식</div>
+                <div class="request_info_sales">월 평균 매출 x,xxx,xxx원</div>
+            </div>            
         </div>
-        <div class="consultant_info_wrapper">
+        <div class="consulting_wrapper">
             <div class="request_text">컨설팅 정보</div>
-            <div class="request_category">컨설팅 분야 마케팅</div>
-            <div class="request_money">컨설팅비 xxx,xxx원</div>
+            <div class="consulting_info_wrapper">
+                <div class="request_info_category">컨설팅 분야 마케팅</div>
+                <div class="request_info_money">컨설팅비 xxx,xxx원</div>
+            </div>
         </div>
-        <div class="request_text_content">의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용</div>
+        <div class="request_info_content">의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용의뢰글내용</div>
+    </div>
+</div>
+
+<div class="application_wrapper">
+    <div class="application_text">컨설팅 기획안</div>
+    <div class="application_container">
+        <textarea class="application_input_content" placeholder="지원서를 작성해주세요."></textarea>
+        <div class="consultant_wrapper">
+            <div class="application_text">컨설턴트 정보 입력</div>
+            <div class="application_input_name">이름: 김양식</div>
+            <div class="application_input_age">나이: 35세</div>
+            <div class="application_input_education">학력: 국민대학교 경영학과 3학년</div>
+            <div class="application_input_category">컨설팅 분야: 마케팅</div>
+            <input type="submit" value="전송하기" class="submit_button">
+        </div>
+
+
     </div>
 </div>