지붕면 할당 팝업 y스크롤 생성
This commit is contained in:
parent
18c509b8ff
commit
aabf3288df
@ -27,92 +27,196 @@ export default function RoofAllocation() {
|
||||
</div>
|
||||
<button className="allocation-edit"><i className="edit-ico"></i>追加</button>
|
||||
</div>
|
||||
<div className="grid-option-wrap">
|
||||
<div className="grid-option-box">
|
||||
<div className="d-check-radio pop no-text">
|
||||
<input type="radio" name="radio01" id="ra01" />
|
||||
<label htmlFor="ra01"></label>
|
||||
</div>
|
||||
<div className="grid-option-block-form">
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<div className="grid-select" style={{width: '248px'}}>
|
||||
<Qselect title={'瓦53A'} option={SelectOption01}/>
|
||||
</div>
|
||||
<span className="dec">基本屋根材</span>
|
||||
</div>
|
||||
<div className="grid-option-overflow">
|
||||
<div className="grid-option-wrap">
|
||||
<div className="grid-option-box">
|
||||
<div className="d-check-radio pop no-text">
|
||||
<input type="radio" name="radio01" id="ra01" />
|
||||
<label htmlFor="ra01"></label>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="grid-option-block-form">
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<div className="grid-select" style={{width: '248px'}}>
|
||||
<Qselect title={'瓦53A'} option={SelectOption01}/>
|
||||
</div>
|
||||
<span className="dec">基本屋根材</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>W</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex-ment">
|
||||
<span>L</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box" >
|
||||
<div className="flex-ment">
|
||||
<span>W</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<span>垂木の</span>
|
||||
<div className="input-grid" style={{width: '178px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex-ment">
|
||||
<span>L</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>垂木の間隔</span>
|
||||
<div className="grid-select" style={{width: '178px'}}>
|
||||
<Qselect title={'455'} option={SelectOption04}/>
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>垂木の間隔</span>
|
||||
<div className="grid-select" style={{width: '178px'}}>
|
||||
<Qselect title={'455'} option={SelectOption04}/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="icon-btn-wrap">
|
||||
<button className="act">並列式<i className="allocation01"></i></button>
|
||||
<button>カスケード <i className="allocation02"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid-option-box">
|
||||
<div className="d-check-radio pop no-text">
|
||||
<input type="radio" name="radio01" id="ra02" />
|
||||
<label htmlFor="ra02"></label>
|
||||
</div>
|
||||
<div className="grid-option-block-form">
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<div className="grid-select" style={{width: '248px'}}>
|
||||
<Qselect title={'瓦53A'} option={SelectOption01}/>
|
||||
</div>
|
||||
<button className="delete"></button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>W</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex-ment">
|
||||
<span>L</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
|
||||
<div className="block-box">
|
||||
<div className="icon-btn-wrap">
|
||||
<button className="act">並列式<i className="allocation01"></i></button>
|
||||
<button>カスケード <i className="allocation02"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>垂木の間隔</span>
|
||||
<div className="grid-select" style={{width: '178px'}}>
|
||||
<Qselect title={'세로 455mm이하'} option={SelectOption04}/>
|
||||
</div>
|
||||
<div className="grid-option-box">
|
||||
<div className="d-check-radio pop no-text">
|
||||
<input type="radio" name="radio01" id="ra02" />
|
||||
<label htmlFor="ra02"></label>
|
||||
</div>
|
||||
<div className="grid-option-block-form">
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<div className="grid-select" style={{width: '248px'}}>
|
||||
<Qselect title={'瓦53A'} option={SelectOption01}/>
|
||||
</div>
|
||||
<button className="delete"></button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>W</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex-ment">
|
||||
<span>L</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>垂木の間隔</span>
|
||||
<div className="grid-select" style={{width: '178px'}}>
|
||||
<Qselect title={'세로 455mm이하'} option={SelectOption04}/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="icon-btn-wrap">
|
||||
<button className="act">並列式<i className="allocation01"></i></button>
|
||||
<button>カスケード <i className="allocation02"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className="grid-option-box">
|
||||
<div className="d-check-radio pop no-text">
|
||||
<input type="radio" name="radio01" id="ra02" />
|
||||
<label htmlFor="ra02"></label>
|
||||
</div>
|
||||
<div className="grid-option-block-form">
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<div className="grid-select" style={{width: '248px'}}>
|
||||
<Qselect title={'瓦53A'} option={SelectOption01}/>
|
||||
</div>
|
||||
<button className="delete"></button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>W</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex-ment">
|
||||
<span>L</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>垂木の間隔</span>
|
||||
<div className="grid-select" style={{width: '178px'}}>
|
||||
<Qselect title={'세로 455mm이하'} option={SelectOption04}/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="icon-btn-wrap">
|
||||
<button className="act">並列式<i className="allocation01"></i></button>
|
||||
<button>カスケード <i className="allocation02"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="icon-btn-wrap">
|
||||
<button className="act">並列式<i className="allocation01"></i></button>
|
||||
<button>カスケード <i className="allocation02"></i></button>
|
||||
</div>
|
||||
<div className="grid-option-box">
|
||||
<div className="d-check-radio pop no-text">
|
||||
<input type="radio" name="radio01" id="ra02" />
|
||||
<label htmlFor="ra02"></label>
|
||||
</div>
|
||||
<div className="grid-option-block-form">
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<div className="grid-select" style={{width: '248px'}}>
|
||||
<Qselect title={'瓦53A'} option={SelectOption01}/>
|
||||
</div>
|
||||
<button className="delete"></button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>W</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex-ment">
|
||||
<span>L</span>
|
||||
<div className="input-grid" style={{width: '100px'}}>
|
||||
<input type="text" className="input-origin block" defaultValue={100} readOnly/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="flex-ment">
|
||||
<span>垂木の間隔</span>
|
||||
<div className="grid-select" style={{width: '178px'}}>
|
||||
<Qselect title={'세로 455mm이하'} option={SelectOption04}/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="block-box">
|
||||
<div className="icon-btn-wrap">
|
||||
<button className="act">並列式<i className="allocation01"></i></button>
|
||||
<button>カスケード <i className="allocation02"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -209,11 +209,15 @@ export default function PublishPage() {
|
||||
<li>2024-12-11</li>
|
||||
<li>*배치면 초기설정 팝업 마지막 설정 버튼 추가</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<ul className='mb10'>
|
||||
<li>2024-12-17</li>
|
||||
<li>*배치면 초기설정 팝업 W,L input box 변환</li>
|
||||
<li>*지붕면할당 팝업 W,L input box 변환</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>2025-01-03</li>
|
||||
<li>*지붕면 할당 팝업 y스크롤 생성</li>
|
||||
</ul>
|
||||
</td>
|
||||
<td className="t-center">2024-10-28</td>
|
||||
</tr>
|
||||
|
||||
@ -251,6 +251,20 @@ $alert-color: #101010;
|
||||
border-bottom: 1px solid #424242;
|
||||
}
|
||||
}
|
||||
.grid-option-overflow{
|
||||
max-height: 350px;
|
||||
overflow-y: auto;
|
||||
&::-webkit-scrollbar {
|
||||
width: 4px;
|
||||
background-color: transparent;
|
||||
}
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: #D9D9D9;
|
||||
}
|
||||
&::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
.grid-option-wrap{
|
||||
.grid-option-box{
|
||||
display: flex;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user