qcast3/onsitesurvey-pub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

매물 상세 등록번호 임시저장시 색깔 클래스 추가

Browse Source
This commit is contained in:
김창수 2025-07-18 15:54:18 +09:00
parent 46d3c5c4cc
commit 279bcacada
3 changed files with 345 additions and 331 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

205
src/components/PublishList/PublishList.tsx
View File

@ -1,5 +1,5 @@
import Link from 'next/link' import Link from "next/link";
import '@/styles/publishpage.scss' import "@/styles/publishpage.scss";
export default function PublishList() { export default function PublishList() {
return ( return (
@ -9,30 +9,42 @@ export default function PublishList (){
</div> </div>
<div className="p-body"> <div className="p-body">
<div className="p-contents"> <div className="p-contents">
<div className='p-guide'> <div className="p-guide">
<div className="p-guide-header">Publish Guide</div> <div className="p-guide-header">Publish Guide</div>
<div className="p-guide-content"> <div className="p-guide-content">
<p>※ className은 케밥 케이스 사용 <span>ex) "sample-class"</span></p> <p>
<p>※ img네이밍은 "_"로 사용, 번호 사용시 01, 02 와 같이 2자리 숫자 사용 <span>ex) "img_sample01"</span></p> ※ className은 케밥 케이스 사용 <span>ex) "sample-class"</span>
<p>※ button, select, checkbox, radio... 등 기본 설정은 <span>InputCommon.jsx</span>에 정의된 내용만 사용 (icon버튼 제외)</p> </p>
<p>※ scss파일 생성시 "_"를 앞에 붙힌 후 생성, 또한 해당 카테고리에 적합한 폴더에 생성</p> <p>
<div className='p-guide-inputcommon'> ※ img네이밍은 "_"로 사용, 번호 사용시 01, 02 와 같이 2자리 숫자
사용 <span>ex) "img_sample01"</span>
</p>
<p>
※ button, select, checkbox, radio... 등 기본 설정은{" "}
<span>InputCommon.jsx</span>에 정의된 내용만 사용 (icon버튼
제외)
</p>
<p>
※ scss파일 생성시 "_"를 앞에 붙힌 후 생성, 또한 해당 카테고리에
적합한 폴더에 생성
</p>
<div className="p-guide-inputcommon">
<h3>기본 SetUp Input 모음</h3> <h3>기본 SetUp Input 모음</h3>
<Link href={'/inputcommon'}>InputCommon.jsx</Link> <Link href={"/inputcommon"}>InputCommon.jsx</Link>
</div> </div>
</div> </div>
</div> </div>
<div className='p-list-wrap'> <div className="p-list-wrap">
<h2>Publish List</h2> <h2>Publish List</h2>
<div className='p-list-table'> <div className="p-list-table">
<table> <table>
<colgroup> <colgroup>
<col style={{width: '10%'}}/> <col style={{ width: "10%" }} />
<col /> <col />
<col style={{width: '20%'}}/> <col style={{ width: "20%" }} />
<col style={{width: '13%'}}/> <col style={{ width: "13%" }} />
<col style={{width: '20%'}}/> <col style={{ width: "20%" }} />
<col style={{width: '13%'}}/> <col style={{ width: "13%" }} />
</colgroup> </colgroup>
<thead> <thead>
<tr> <tr>
@ -49,66 +61,54 @@ export default function PublishList (){
<td>Login</td> <td>Login</td>
<td>Login Page</td> <td>Login Page</td>
<td> <td>
<Link href={'login'}>LoginPage.tsx</Link> <Link href={"login"}>LoginPage.tsx</Link>
</td> </td>
<td></td> <td></td>
<td className='c'> <td className="c"></td>
<td className="c red">2025/04/28</td>
</td>
<td className='c red'>2025/04/28</td>
</tr> </tr>
<tr> <tr>
<td>Main</td> <td>Main</td>
<td>Main Page</td> <td>Main Page</td>
<td> <td>
<Link href={'main'}>MainPage.tsx</Link> <Link href={"main"}>MainPage.tsx</Link>
</td> </td>
<td className='c'> <td className="c">회원정보 팝업 포함</td>
회원정보 팝업 포함 <td className="c red">
</td>
<td className='c red'>
<ul> <ul>
<li>2025/05/15</li> <li>2025/05/15</li>
<li>* 팝업 img태그 Image 컴포넌트 변환</li> <li>* 팝업 img태그 Image 컴포넌트 변환</li>
</ul> </ul>
</td> </td>
<td className='c red'>2025/04/29</td> <td className="c red">2025/04/29</td>
</tr> </tr>
<tr> <tr>
<td>Alert</td> <td>Alert</td>
<td>Alert 모음</td> <td>Alert 모음</td>
<td> <td>
<Link href={'alert'}>AlertPage.tsx</Link> <Link href={"alert"}>AlertPage.tsx</Link>
</td> </td>
<td className='c'> <td className="c"></td>
<td className="c"></td>
</td> <td className="c red">2025/04/29</td>
<td className='c'>
</td>
<td className='c red'>2025/04/29</td>
</tr> </tr>
<tr> <tr>
<td rowSpan={3}>매물</td> <td rowSpan={3}>매물</td>
<td>매물 목록</td> <td>매물 목록</td>
<td> <td>
<Link href={'sale/salelist'}>SaleListPage.tsx</Link> <Link href={"sale/salelist"}>SaleListPage.tsx</Link>
</td> </td>
<td className='c'> <td className="c"></td>
</td> <td className="c"></td>
<td className='c'> <td className="c red">2025/04/29</td>
</td>
<td className='c red'>2025/04/29</td>
</tr> </tr>
<tr> <tr>
<td>매물 상세</td> <td>매물 상세</td>
<td> <td>
<Link href={'sale/saledetail'}>SaleDetailPage.tsx</Link> <Link href={"sale/saledetail"}>SaleDetailPage.tsx</Link>
</td> </td>
<td className='c'> <td className="c">제출 팝업 포함</td>
제출 팝업 포함 <td className="c red">
</td>
<td className='c red'>
{/* <ul> {/* <ul>
<li>2025/05/15</li> <li>2025/05/15</li>
<li>* 상세 페이지 전체 재수정</li> <li>* 상세 페이지 전체 재수정</li>
@ -123,26 +123,32 @@ export default function PublishList (){
<li>2025/05/27</li> <li>2025/05/27</li>
<li>* 제출 팝업 상단 select 영역 추가</li> <li>* 제출 팝업 상단 select 영역 추가</li>
</ul> */} </ul> */}
<ul> {/* <ul>
<li>2025/05/28</li> <li>2025/05/28</li>
<li>* 제출 팝업 발송자 영역 최상단 위치 조정</li> <li>* 제출 팝업 발송자 영역 최상단 위치 조정</li>
<li>* 제출 팝업 내용 영역 수정</li> <li>* 제출 팝업 내용 영역 수정</li>
<li>* 지붕 구조의 순서 영역 수정</li> <li>* 지붕 구조의 순서 영역 수정</li>
</ul> */}
<ul>
<li>2025/07/18</li>
<li>
* 매물 상세 등록번호 임시저장시 색깔 클래스 추가
</li>
</ul> </ul>
</td> </td>
<td className='c red'>2025/04/29</td> <td className="c red">2025/04/29</td>
</tr> </tr>
<tr> <tr>
<td>매물 신규등록</td> <td>매물 신규등록</td>
<td> <td>
<Link href={'sale/saleedit'}>SaleEditPage.tsx</Link> <Link href={"sale/saleedit"}>SaleEditPage.tsx</Link>
</td> </td>
<td className='c'> <td className="c">
<ul> <ul>
<li>주소 검색 팝업 포함</li> <li>주소 검색 팝업 포함</li>
</ul> </ul>
</td> </td>
<td className='c red'> <td className="c red">
{/* <ul> {/* <ul>
<li>2025/05/15</li> <li>2025/05/15</li>
<li>* 페이지 추가</li> <li>* 페이지 추가</li>
@ -154,48 +160,53 @@ export default function PublishList (){
<li>* 지붕 구조의 순서 영역 수정</li> <li>* 지붕 구조의 순서 영역 수정</li>
</ul> </ul>
</td> </td>
<td className='c red'>2025/05/15</td> <td className="c red">2025/05/15</td>
</tr> </tr>
<tr> <tr>
<td rowSpan={4}>1:1 문의</td> <td rowSpan={4}>1:1 문의</td>
<td>1:1 문의 목록</td> <td>1:1 문의 목록</td>
<td> <td>
<Link href={'inquiry/inquirylist'}>InquiryListPage.tsx</Link> <Link href={"inquiry/inquirylist"}>
InquiryListPage.tsx
</Link>
</td> </td>
<td className='c'> <td className="c"></td>
</td> <td className="c red">
<td className='c red'>
<ul> <ul>
<li>2025/05/13</li> <li>2025/05/13</li>
<li>* 제목 변경 및 문의 유형 추가</li> <li>* 제목 변경 및 문의 유형 추가</li>
</ul> </ul>
</td> </td>
<td className='c red'>2025/04/30</td> <td className="c red">2025/04/30</td>
</tr> </tr>
<tr> <tr>
<td>1:1 문의 작성</td> <td>1:1 문의 작성</td>
<td> <td>
<Link href={'inquiry/inquirycreate'}>InquiryCreatePage.tsx</Link> <Link href={"inquiry/inquirycreate"}>
InquiryCreatePage.tsx
</Link>
</td> </td>
<td className='c'> <td className="c"></td>
</td> <td className="c red">
<td className='c red'>
<ul> <ul>
<li>2025/05/13</li> <li>2025/05/13</li>
<li>* 문의 유형 필드 및 연락처, 이름 필드 추가, 제목 변경</li> <li>
* 문의 유형 필드 및 연락처, 이름 필드 추가, 제목 변경
</li>
</ul> </ul>
</td> </td>
<td className='c red'>2025/04/30</td> <td className="c red">2025/04/30</td>
</tr> </tr>
<tr> <tr>
<td>1:1 문의 상세</td> <td>1:1 문의 상세</td>
<td> <td>
<Link href={'inquiry/inquirydetail'}>InquiryDetailPage.tsx</Link> <Link href={"inquiry/inquirydetail"}>
InquiryDetailPage.tsx
</Link>
</td> </td>
<td className='c'> <td className="c"></td>
</td> <td className="c red">
<td className='c red'>
{/* <ul> {/* <ul>
<li>2025/05/13</li> <li>2025/05/13</li>
<li>* 이름, 연락처, 문의 유형 추가, 제목 변경</li> <li>* 이름, 연락처, 문의 유형 추가, 제목 변경</li>
@ -205,16 +216,17 @@ export default function PublishList (){
<li>* 상세 인적 정보 위치 변경</li> <li>* 상세 인적 정보 위치 변경</li>
</ul> </ul>
</td> </td>
<td className='c red'>2025/04/30</td> <td className="c red">2025/04/30</td>
</tr> </tr>
<tr> <tr>
<td>1:1 문의 상세 (답변)</td> <td>1:1 문의 상세 (답변)</td>
<td> <td>
<Link href={'inquiry/inquiryanswer'}>InquiryAnswerPage.tsx</Link> <Link href={"inquiry/inquiryanswer"}>
InquiryAnswerPage.tsx
</Link>
</td> </td>
<td className='c'> <td className="c"></td>
</td> <td className="c red">
<td className='c red'>
{/* <ul> {/* <ul>
<li>2025/05/13</li> <li>2025/05/13</li>
<li>* 이름, 연락처, 문의 유형 추가, 제목 변경</li> <li>* 이름, 연락처, 문의 유형 추가, 제목 변경</li>
@ -224,30 +236,28 @@ export default function PublishList (){
<li>* 상세 인적 정보 위치 변경</li> <li>* 상세 인적 정보 위치 변경</li>
</ul> </ul>
</td> </td>
<td className='c red'>2025/04/30</td> <td className="c red">2025/04/30</td>
</tr> </tr>
<tr> <tr>
<td>비밀번호 변경</td> <td>비밀번호 변경</td>
<td>비밀번호 변경 페이지</td> <td>비밀번호 변경 페이지</td>
<td> <td>
<Link href={'pwchange'}>PwChangePage.tsx</Link> <Link href={"pwchange"}>PwChangePage.tsx</Link>
</td> </td>
<td className='c'> <td className="c"></td>
</td> <td className="c"></td>
<td className='c'> <td className="c red">2025/04/30</td>
</td>
<td className='c red'>2025/04/30</td>
</tr> </tr>
<tr> <tr>
<td>지붕재 적합성</td> <td>지붕재 적합성</td>
<td>지붕재 적합성 페이지</td> <td>지붕재 적합성 페이지</td>
<td> <td>
<Link href={'roofcompliance'}>RoofCompliancePage.tsx</Link> <Link href={"roofcompliance"}>
RoofCompliancePage.tsx
</Link>
</td> </td>
<td className='c'> <td className="c">지붕재 적합성 상세 팝업 포함</td>
지붕재 적합성 상세 팝업 포함 <td className="c red">
</td>
<td className='c red'>
{/* <ul> {/* <ul>
<li>2025/05/13</li> <li>2025/05/13</li>
<li>* Search Input 지우기 버튼 추가가</li> <li>* Search Input 지우기 버튼 추가가</li>
@ -257,39 +267,36 @@ export default function PublishList (){
<li>* 팝업 img태그 Image 컴포넌트 변환</li> <li>* 팝업 img태그 Image 컴포넌트 변환</li>
<li>* 최하단 버튼 모음 float버튼 변환</li> <li>* 최하단 버튼 모음 float버튼 변환</li>
</ul> */} </ul> */}
<ul className='mt5'> <ul className="mt5">
<li>2025/06/05</li> <li>2025/06/05</li>
<li>* 팝업 버튼 float 변경</li> <li>* 팝업 버튼 float 변경</li>
</ul> </ul>
</td> </td>
<td className='c red'>2025/05/08</td> <td className="c red">2025/05/08</td>
</tr> </tr>
<tr> <tr>
<td rowSpan={2}>PDF 뷰어</td> <td rowSpan={2}>PDF 뷰어</td>
<td>조사매물 pdf</td> <td>조사매물 pdf</td>
<td> <td>
<Link href={'pdfview'}>PDFView.tsx</Link> <Link href={"pdfview"}>PDFView.tsx</Link>
</td> </td>
<td className='c'> <td className="c"></td>
</td> <td className="c red"></td>
<td className='c red'> <td className="c red">2025/05/19</td>
</td>
<td className='c red'>2025/05/19</td>
</tr> </tr>
<tr> <tr>
<td>지붕재 적합성 pdf</td> <td>지붕재 적합성 pdf</td>
<td> <td>
<Link href={'pdftable'}>PDFTablePage.tsx</Link> <Link href={"pdftable"}>PDFTablePage.tsx</Link>
</td> </td>
<td className='c'> <td className="c"></td>
</td> <td className="c red">
<td className='c red'> <ul className="mt5">
<ul className='mt5'>
<li>2025/06/02</li> <li>2025/06/02</li>
<li>* 하단 날짜 추가 및 min max width 수정</li> <li>* 하단 날짜 추가 및 min max width 수정</li>
</ul> </ul>
</td> </td>
<td className='c red'>2025/05/28</td> <td className="c red">2025/05/28</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
@ -298,5 +305,5 @@ export default function PublishList (){
</div> </div>
</div> </div>
</div> </div>
) );
} }

10
src/components/sale/saledetail/SaleDetailData.tsx
View File

@ -3,13 +3,13 @@ export default function SaleDetailData(){
<div className="sale-data-table-wrap"> <div className="sale-data-table-wrap">
<table className="sale-data-table"> <table className="sale-data-table">
<colgroup> <colgroup>
<col style={{width: '80px'}}/> <col style={{ width: "80px" }} />
<col /> <col />
</colgroup> </colgroup>
<tbody> <tbody>
<tr> <tr>
<th>登録番号</th> <th>登録番号</th>
<td>0000000020</td> <td className="sale-data-num">0000000020</td>
</tr> </tr>
<tr> <tr>
<th>登録日</th> <th>登録日</th>
@ -26,11 +26,13 @@ export default function SaleDetailData(){
<tr> <tr>
<th>ダウンロード</th> <th>ダウンロード</th>
<td> <td>
<button className="data-down">HWJ現地調査票確認<i className="down-icon"></i></button> <button className="data-down">
HWJ現地調査票確認<i className="down-icon"></i>
</button>
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div> </div>
) );
} }

119
src/styles/components/_sub.scss
View File

@ -10,16 +10,16 @@
@include defaultFont($font-s-13, $font-w-500, $font-c); @include defaultFont($font-s-13, $font-w-500, $font-c);
margin-bottom: 10px; margin-bottom: 10px;
.import { .import {
color: #F00; color: #f00;
} }
span { span {
display: block; display: block;
@include defaultFont($font-s-13, $font-w-400, #A8B6C7); @include defaultFont($font-s-13, $font-w-400, #a8b6c7);
} }
} }
.data-input-guide { .data-input-guide {
margin-top: 8px; margin-top: 8px;
@include defaultFont($font-s-13, $font-w-400, #A8B6C7); @include defaultFont($font-s-13, $font-w-400, #a8b6c7);
} }
} }
@ -46,7 +46,7 @@
right: 15px; right: 15px;
width: 38px; width: 38px;
height: 38px; height: 38px;
background-color: rgba(0, 0, 0, 0.50); background-color: rgba(0, 0, 0, 0.5);
background-image: url(/assets/images/sub/top_btn_icon.svg); background-image: url(/assets/images/sub/top_btn_icon.svg);
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
@ -57,11 +57,11 @@
.sale-contents { .sale-contents {
width: 100%; width: 100%;
background-color: #F5F5F5; background-color: #f5f5f5;
.sale-frame { .sale-frame {
padding: 0 20px; padding: 0 20px;
border-top: 1px solid #ECECEC; border-top: 1px solid #ececec;
border-bottom: 1px solid #ECECEC; border-bottom: 1px solid #ececec;
margin-bottom: 10px; margin-bottom: 10px;
padding-bottom: 24px; padding-bottom: 24px;
padding-top: 24px; padding-top: 24px;
@ -96,7 +96,7 @@
.sale-list-item { .sale-list-item {
padding-top: 14px; padding-top: 14px;
padding-bottom: 14px; padding-bottom: 14px;
border-bottom: 1px solid #ECECEC; border-bottom: 1px solid #ececec;
cursor: pointer; cursor: pointer;
&:first-child { &:first-child {
padding-top: 0; padding-top: 0;
@ -117,18 +117,18 @@
@include defaultFont($font-s-13, $font-w-400, $font-c); @include defaultFont($font-s-13, $font-w-400, $font-c);
padding-right: 6px; padding-right: 6px;
&::after { &::after {
content: ''; content: "";
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 0; right: 0;
transform: translateY(-50%); transform: translateY(-50%);
width: 1px; width: 1px;
height: 10px; height: 10px;
background-color: #A2ABB8; background-color: #a2abb8;
} }
} }
.sale-item-date { .sale-item-date {
@include defaultFont($font-s-13, $font-w-400, #A2ABB8); @include defaultFont($font-s-13, $font-w-400, #a2abb8);
padding-left: 6px; padding-left: 6px;
} }
} }
@ -146,21 +146,21 @@
align-items: center; align-items: center;
.sale-item-name { .sale-item-name {
position: relative; position: relative;
@include defaultFont($font-s-13, $font-w-400, #A2ABB8); @include defaultFont($font-s-13, $font-w-400, #a2abb8);
padding-right: 6px; padding-right: 6px;
&::after { &::after {
content: ''; content: "";
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 0; right: 0;
transform: translateY(-50%); transform: translateY(-50%);
width: 1px; width: 1px;
height: 10px; height: 10px;
background-color: #A2ABB8; background-color: #a2abb8;
} }
} }
.sale-item-update { .sale-item-update {
@include defaultFont($font-s-13, $font-w-400, #A2ABB8); @include defaultFont($font-s-13, $font-w-400, #a2abb8);
padding-left: 6px; padding-left: 6px;
} }
} }
@ -180,7 +180,10 @@
.sale-data-table-wrap { .sale-data-table-wrap {
padding: 24px; padding: 24px;
background-color: #fff; background-color: #fff;
border-top: 1px solid #ECECEC; border-top: 1px solid #ececec;
.sale-data-num {
color: #1259cb;
}
} }
.sale-data-table { .sale-data-table {
width: 100%; width: 100%;
@ -198,7 +201,7 @@
.data-down { .data-down {
@include flex(8px); @include flex(8px);
align-items: center; align-items: center;
color: #1259CB; color: #1259cb;
i { i {
display: block; display: block;
width: 8px; width: 8px;
@ -209,12 +212,14 @@
} }
} }
&:first-child { &:first-child {
th,td{ th,
td {
padding-top: 0; padding-top: 0;
} }
} }
&:last-child { &:last-child {
th,td{ th,
td {
padding-bottom: 0; padding-bottom: 0;
} }
} }
@ -223,10 +228,10 @@
} }
.sale-detail-toggle-wrap { .sale-detail-toggle-wrap {
border-top: 1px solid #ECECEC; border-top: 1px solid #ececec;
} }
.sale-detail-toggle-bx { .sale-detail-toggle-bx {
border-bottom: 1px solid #ECECEC; border-bottom: 1px solid #ececec;
} }
.sale-detail-toggle-head { .sale-detail-toggle-head {
@include flex(5px); @include flex(5px);
@ -243,7 +248,7 @@
width: 22px; width: 22px;
height: 22px; height: 22px;
background: url(/assets/images/sub/sale_toggle_btn.svg) no-repeat center; background: url(/assets/images/sub/sale_toggle_btn.svg) no-repeat center;
background-size: cover background-size: cover;
} }
} }
} }
@ -263,13 +268,14 @@
.sale-detail-toggle-bx { .sale-detail-toggle-bx {
&.act { &.act {
.sale-detail-toggle-head { .sale-detail-toggle-head {
background-color: #5F738E; background-color: #5f738e;
.sale-detail-toggle-name { .sale-detail-toggle-name {
color: #fff color: #fff;
} }
.sale-detail-toggle-btn-wrap { .sale-detail-toggle-btn-wrap {
.sale-detail-toggle-btn { .sale-detail-toggle-btn {
background: url(/assets/images/sub/sale_toggle_btn_white.svg)no-repeat center; background: url(/assets/images/sub/sale_toggle_btn_white.svg)
no-repeat center;
} }
} }
} }
@ -295,7 +301,7 @@
@include defaultFont($font-s-15, $font-w-500, $font-c); @include defaultFont($font-s-15, $font-w-500, $font-c);
padding-bottom: 10px; padding-bottom: 10px;
margin-bottom: 20px; margin-bottom: 20px;
border-bottom: 1px solid #2E3A59; border-bottom: 1px solid #2e3a59;
} }
.data-check-wrap { .data-check-wrap {
@include flex(10px); @include flex(10px);
@ -320,7 +326,6 @@
} }
} }
// 1:1 문의 common // 1:1 문의 common
.inquiry-frame { .inquiry-frame {
padding: 0 20px; padding: 0 20px;
@ -335,16 +340,15 @@
font-size: $font-s-12; font-size: $font-s-12;
font-weight: $font-w-500; font-weight: $font-w-500;
&.blue { &.blue {
color: #5497E9; color: #5497e9;
background-color: #ECF5FF; background-color: #ecf5ff;
} }
&.orange { &.orange {
color: #F86A56; color: #f86a56;
background-color: #FFEFED; background-color: #ffefed;
} }
&.block { &.block {
width: 100%; width: 100%;
} }
} }
// 1:1 문의 목록 // 1:1 문의 목록
@ -356,7 +360,7 @@
} }
.inquiry-list-tit { .inquiry-list-tit {
padding-bottom: 10px; padding-bottom: 10px;
border-bottom: 1px solid #2E3A59; border-bottom: 1px solid #2e3a59;
@include defaultFont($font-s-13, $font-w-400, $font-c); @include defaultFont($font-s-13, $font-w-400, $font-c);
span { span {
font-weight: $font-w-500; font-weight: $font-w-500;
@ -366,7 +370,7 @@
.inquiry-item { .inquiry-item {
padding: 10px 0; padding: 10px 0;
cursor: pointer; cursor: pointer;
border-bottom: 1px solid #ECECEC; border-bottom: 1px solid #ececec;
&:last-child { &:last-child {
border-bottom: none; border-bottom: none;
padding-bottom: 0; padding-bottom: 0;
@ -393,14 +397,14 @@
} }
} }
&::before { &::before {
content: ''; content: "";
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 0; right: 0;
transform: translateY(-50%); transform: translateY(-50%);
width: 1px; width: 1px;
height: 10px; height: 10px;
background-color: #A2ABB8; background-color: #a2abb8;
} }
} }
} }
@ -410,7 +414,7 @@
margin-bottom: 5px; margin-bottom: 5px;
} }
.inquiry-item-date { .inquiry-item-date {
@include defaultFont($font-s-13, $font-w-400, #A2ABB8); @include defaultFont($font-s-13, $font-w-400, #a2abb8);
} }
.inquiry-badge { .inquiry-badge {
position: absolute; position: absolute;
@ -442,7 +446,7 @@
.file-list { .file-list {
margin-top: 14px; margin-top: 14px;
.file-item { .file-item {
border-top: 1px solid #EDEDED; border-top: 1px solid #ededed;
cursor: default; cursor: default;
.file-item-bx { .file-item-bx {
width: 100%; width: 100%;
@ -460,7 +464,8 @@
margin-left: auto; margin-left: auto;
width: 16px; width: 16px;
height: 16px; height: 16px;
background: url(/assets/images/common/id_delete_icon.svg)no-repeat center; background: url(/assets/images/common/id_delete_icon.svg) no-repeat
center;
background-size: cover; background-size: cover;
} }
} }
@ -475,11 +480,11 @@
// 1:1 문의 상세 // 1:1 문의 상세
.inquiry-detail-data-table { .inquiry-detail-data-table {
padding: 20px 0; padding: 20px 0;
border-bottom: 1px solid #ECECEC; border-bottom: 1px solid #ececec;
} }
.inquiry-detail-data { .inquiry-detail-data {
padding: 20px 0; padding: 20px 0;
border-bottom: 1px solid #2E3A59; border-bottom: 1px solid #2e3a59;
margin-bottom: 24px; margin-bottom: 24px;
.inquiry-detail-category { .inquiry-detail-category {
display: flex; display: flex;
@ -500,14 +505,14 @@
} }
} }
&::before { &::before {
content: ''; content: "";
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 0; right: 0;
transform: translateY(-50%); transform: translateY(-50%);
width: 1px; width: 1px;
height: 10px; height: 10px;
background-color: #A2ABB8; background-color: #a2abb8;
} }
} }
} }
@ -524,18 +529,17 @@
// 1:1 문의 답변 // 1:1 문의 답변
.inquiry-answer-wrap { .inquiry-answer-wrap {
margin-top: 24px; margin-top: 24px;
} }
.inquiry-answer-header { .inquiry-answer-header {
padding: 20px 0; padding: 20px 0;
border-top: 1px solid #F86A56; border-top: 1px solid #f86a56;
border-bottom: 1px solid #ECECEC; border-bottom: 1px solid #ececec;
.inquiry-answer-tit { .inquiry-answer-tit {
@include defaultFont($font-s-14, $font-w-500, #F86A56); @include defaultFont($font-s-14, $font-w-500, #f86a56);
margin-bottom: 5px; margin-bottom: 5px;
} }
.inquiry-answer-date { .inquiry-answer-date {
@include defaultFont($font-s-13, $font-w-400, #F86A56); @include defaultFont($font-s-13, $font-w-400, #f86a56);
} }
} }
.inquiry-answer-tit { .inquiry-answer-tit {
@ -546,8 +550,8 @@
// 비밀번호 변경 // 비밀번호 변경
.border-frame { .border-frame {
padding: 20px; padding: 20px;
border-top: 1px solid #ECECEC; border-top: 1px solid #ececec;
border-bottom: 1px solid #ECECEC; border-bottom: 1px solid #ececec;
background-color: #fff; background-color: #fff;
margin-bottom: 10px; margin-bottom: 10px;
&:last-child { &:last-child {
@ -558,10 +562,10 @@
} }
.pw-guide { .pw-guide {
.pw-guide-tit { .pw-guide-tit {
@include defaultFont($font-s-16, $font-w-500, #1259CB); @include defaultFont($font-s-16, $font-w-500, #1259cb);
} }
.pw-guide-txt { .pw-guide-txt {
@include defaultFont($font-s-13, $font-w-400, #417DDC); @include defaultFont($font-s-13, $font-w-400, #417ddc);
} }
} }
@ -575,7 +579,7 @@
.compliance-check-bx { .compliance-check-bx {
position: relative; position: relative;
padding: 14px 18px; padding: 14px 18px;
border: 1px solid #EFEFEF; border: 1px solid #efefef;
border-radius: 4px; border-radius: 4px;
margin-bottom: 10px; margin-bottom: 10px;
&:last-child { &:last-child {
@ -586,7 +590,7 @@
transform: rotate(0) !important; transform: rotate(0) !important;
} }
.reference-list { .reference-list {
display: block display: block;
} }
} }
} }
@ -603,7 +607,8 @@
display: block; display: block;
width: 22px; width: 22px;
height: 22px; height: 22px;
background: url(/assets/images/sub/compliance_bx_icon.svg)no-repeat center; background: url(/assets/images/sub/compliance_bx_icon.svg) no-repeat
center;
transform: rotate(180deg); transform: rotate(180deg);
} }
} }
@ -612,8 +617,8 @@
display: none; display: none;
margin-top: 10px; margin-top: 10px;
padding-top: 14px; padding-top: 14px;
border-top: 1px solid #ECECEC; border-top: 1px solid #ececec;
transition: all .15s ease-in-out; transition: all 0.15s ease-in-out;
.reference-item { .reference-item {
margin-bottom: 8px; margin-bottom: 8px;
padding-left: 14px; padding-left: 14px;