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

팝업 수정

Browse Source
This commit is contained in:
김창수 2025-03-20 16:50:36 +09:00
parent 8c16488dda
commit 344a1a890d
5 changed files with 34 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab02.jsx
View File

@ -135,7 +135,6 @@ export default function HexagonalRoofTab03({setTabNum}){
</div> */}
<div className="grid-btn-wrap">
<button className="btn-frame modal mr5" onClick={() => setTabNum(1)}>以前</button>
<button className="btn-frame modal mr5">単数指定配置</button>
<button className="btn-frame modal mr5">手動配置</button>
<button className="btn-frame modal act">設定値に自動配置</button>
</div>

2
src/components/canvas/modal/roofmoduleoption/RoofModuleOption.jsx
View File

@ -7,7 +7,7 @@ import RoofModuleOptionTab03 from "./RoofModuleOptionTab03";
export default function RoofModuleOption(){
const [tabNum, setTabNum] = useState(1);
return(
<WithDraggable isShow={true} size={'lx-2'}>
<WithDraggable isShow={true} size={'ll'}>
<div className="modal-head handle">
<h1 className="title">モジュール/架台設定 </h1>
<button className="modal-close">닫기</button>

29
src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab02.jsx
View File

@ -11,16 +11,12 @@ export default function RoofModuleOptionTab02({setTabNum}){
<div className="roof-module-tab2-overflow">
<div className="module-table-box mb10">
<div className="module-box-tab">
<button className="module-btn act">屋根材1</button>
<button className="module-btn">屋根材2</button>
<button className="module-btn">屋根材3</button>
<button className="module-btn">屋根材4</button>
<button className="module-btn act">アスファルトシングル（21.8度）</button>
<button className="module-btn">アスファルトシングル（21.8度）</button>
<button className="module-btn">アスファルトシングル（21.8度）</button>
<button className="module-btn">アスファルトシングル（21.8度）</button>
</div>
<div className="module-table-inner">
<div className="module-flex-item-tit-wrap">
<div className="module-flex-item-tit">屋根材：スレーツ（4寸）</div>
<button className="btn-frame roof">架台保存</button>
</div>
<div className="module-table-flex-wrap tab2">
<div className="module-flex-item">
<div className="eaves-keraba-table">
@ -82,6 +78,16 @@ export default function RoofModuleOptionTab02({setTabNum}){
</div>
</div>
</div>
<div className="eaves-keraba-item">
<div className="eaves-keraba-th">
屋根の下
</div>
<div className="eaves-keraba-td">
<div className="grid-select">
<Qselect title={'構造用合板12mm以上 又はOSB12mm以上'} option={SelectOption01}/>
</div>
</div>
</div>
</div>
</div>
<div className="module-flex-item non-flex">
@ -92,7 +98,7 @@ export default function RoofModuleOptionTab02({setTabNum}){
<button className="btn-frame roof">多設施工（II）</button>
<button className="btn-frame roof">強化施工</button>
</div>
<div className="grid-check-form-block">
<div className="grid-check-form-flex">
<div className="d-check-box pop">
<input type="checkbox" id="ch01" />
<label htmlFor="ch01">軒カバーの設置</label>
@ -102,6 +108,9 @@ export default function RoofModuleOptionTab02({setTabNum}){
<label htmlFor="ch02">落雪防止金具設置</label>
</div>
</div>
<div className="flex-item-button">
<button className="btn-frame roof">架台保存</button>
</div>
</div>
</div>
</div>
@ -124,7 +133,7 @@ export default function RoofModuleOptionTab02({setTabNum}){
</div>
<span className="thin">mm</span>
</div>
<div className="outline-form ">
<div className="outline-form mr10">
<span>けらぱ</span>
<div className="input-grid mr10" >
<input type="text" className="input-origin block" defaultValue={13}/>

2
src/styles/_contents.scss
View File

@ -346,7 +346,7 @@
padding: 9.6px 20px;
font-size: 12px;
color: #fff;
background-color: #777777;
background-color: #1083E3;
}
.canvas-plane-wrap{
display: flex;

19
src/styles/_modal.scss
View File

@ -279,10 +279,11 @@ $alert-color: #101010;
border-bottom: 1px solid #424242;
}
}
.grid-check-form-block{
display: block;
> div{
margin-bottom: 10px;
.grid-check-form-flex{
display: flex;
gap: 10px;
.d-check-box{
flex: 1;
}
}
.grid-option-overflow{
@ -2183,14 +2184,20 @@ $alert-color: #101010;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 8px;
margin-bottom: 24px;
margin-bottom: 10px;
}
&.non-flex{
display: flex;
flex-direction: column;
justify-content: flex-start;
flex: none;
width: 260px;
width: 340px;
}
.flex-item-button{
margin-top: 10px;
button{
width: 100%;
}
}
}
}