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

지붕제 적합성 페이지 최하단 버튼 float메뉴 변경

Browse Source
This commit is contained in:
김창수 2025-05-15 16:48:13 +09:00
parent ff40cd2666
commit f4e09b55a2
5 changed files with 22 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/roofcompliance/page.tsx
View File

@ -24,7 +24,7 @@ export default function RoofCompliancePage(){
<button className="top-btn"></button> <button className="top-btn"></button>
</div> </div>
{/* 지붕제 적합성 상세 팝업 */} {/* 지붕제 적합성 상세 팝업 */}
<RoofComplianceDetailPop/> {/* <RoofComplianceDetailPop/> */}
</> </>
) )
} }

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

@ -228,6 +228,7 @@ export default function PublishList (){
<ul className='mt5'> <ul className='mt5'>
<li>2025/05/15</li> <li>2025/05/15</li>
<li>* 팝업 img태그 Image 컴포넌트 변환</li> <li>* 팝업 img태그 Image 컴포넌트 변환</li>
<li>* 최하단 버튼 모음 float버튼 변환</li>
</ul> </ul>
</td> </td>
<td className='c red'>2025/05/08</td> <td className='c red'>2025/05/08</td>

20
src/components/roofcompliance/RoofCompliance.tsx
View File

@ -80,15 +80,17 @@ export default function RoofCompliance(){
<RoofComplianceCheckData/> <RoofComplianceCheckData/>
<RoofComplianceCheckData/> <RoofComplianceCheckData/>
<RoofComplianceCheckData/> <RoofComplianceCheckData/>
<div className="btn-flex-wrap com"> <div className="float-btn-wrap">
<div className="btn-bx"> <div className="btn-flex-wrap com">
<button className="btn-frame n-blue icon">全選択<i className="btn-arr"></i></button> <div className="btn-bx">
</div> <button className="btn-frame n-blue icon">全選択<i className="btn-arr"></i></button>
<div className="btn-bx"> </div>
<button className="btn-frame red icon">詳細を見る<i className="btn-arr"></i></button> <div className="btn-bx">
</div> <button className="btn-frame red icon">詳細を見る<i className="btn-arr"></i></button>
<div className="btn-bx"> </div>
<button className="btn-frame n-blue icon">選択ダウンロード<i className="btn-arr"></i></button> <div className="btn-bx">
<button className="btn-frame n-blue icon">選択ダウンロード<i className="btn-arr"></i></button>
</div>
</div> </div>
</div> </div>
</div> </div>

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

@ -651,7 +651,14 @@
@include flex(0px); @include flex(0px);
align-items: center; align-items: center;
} }
.float-btn-wrap{
position: sticky;
bottom: 10px;
left: 0;
width: 100%;
background-color: #fff;
z-index: 9;
}
@media screen and (max-width: 360px){ @media screen and (max-width: 360px){
.btn-flex-wrap{ .btn-flex-wrap{
flex-direction: column; flex-direction: column;

2
src/styles/layout/_layout.scss
View File

@ -6,7 +6,7 @@
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
min-height: 100vh; min-height: 100vh;
overflow-x: hidden; // overflow-x: hidden;
.container{ .container{
flex: 1 1 auto; flex: 1 1 auto;
} }