canvas 팝업 수정

src/app/canvas/page.jsx

@@ -106,7 +106,7 @@ export default function CanvasPage() {
                     {/* <PropertiesSetting/> */}
 
                     {/* 지붕형상 설정 */}
-                    {/* <RoofShapeOption/> */}
+                    <RoofShapeOption/>
 
                     {/* 지붕형상 수동 설정 */}
                     {/* <ManualRoofShape/> */}
@@ -135,10 +135,10 @@ export default function CanvasPage() {
                     {/* <SlopeOption/> */}
 
                     {/* 배치면 그리기 */}
-                    {/* <ArrangementSetting/> */}
+                    <ArrangementSetting/>
 
                     {/* 면형상 배치 */}
-                    <PlaneShapeOption/>
+                    {/* <PlaneShapeOption/> */}
                     
                     {/* 오브젝트 배치*/}
                     {/* <ObjectOption/> */}
@@ -158,13 +158,13 @@ export default function CanvasPage() {
                     {/* <DrawingFlow/> */}
 
                     {/* 지붕모듈선택 */}
-                    {/* <RoofModuleOption/> */}
+                    <RoofModuleOption/>
 
                     {/* 육지붕모듈 선택 */}
-                    {/* <HexagonalRoofOption/> */}
+                    <HexagonalRoofOption/>
 
                     {/* 회로 및 가대설정 */}
-                    {/* <CircuitStandSetting/> */}
+                    <CircuitStandSetting/>
 
                     {/* 모듈 부가기능 */}
 

src/components/canvas/MenuDepth03.jsx

@@ -7,8 +7,8 @@ export default function MenuDepth03(){
     return( 
         <div className="canvas-depth2-inner">
             <ul className="canvas-depth2-list">
-                <li className="canvas-depth2-item active"><button>基本設定</button></li>
+                <li className="canvas-depth2-item active"><button>モジュール/架台設定</button></li>
-                <li className="canvas-depth2-item"><button>回路と架台の設定</button></li>
+                <li className="canvas-depth2-item"><button>回路設定</button></li>
                 <li className="canvas-depth2-item"><button>図面方位の適用</button></li>
             </ul>
         </div>

src/components/canvas/modal/additionalfunction/additionoption/AdditionalBundleCopy.jsx

@@ -4,7 +4,7 @@ export default function AdditionalBundleCopy(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">単コピー設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AdditionalBundleCopy(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/additionoption/AdditionalBundleMove.jsx

@@ -4,7 +4,7 @@ export default function AdditionalBundleMove(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">単移動設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AdditionalBundleMove(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/additionoption/AdditionalColumnCopy.jsx

@@ -4,7 +4,7 @@ export default function AdditionalColumnCopy(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">列コピーの設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AdditionalColumnCopy(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/additionoption/AdditionalColumnMove.jsx

@@ -4,7 +4,7 @@ export default function AdditionalColumnMove(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">列移動設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AdditionalColumnMove(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/additionoption/AdditionalCopy.jsx

@@ -4,7 +4,7 @@ export default function AdditionalCopy(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">コピー設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -34,6 +34,7 @@ export default function AdditionalCopy(){
                         <button className="btn-frame modal act">キャンセル</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/additionoption/AdditionalMove.jsx

@@ -4,7 +4,7 @@ export default function AdditionalMove(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">移動設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -34,6 +34,7 @@ export default function AdditionalMove(){
                         <button className="btn-frame modal act">キャンセル</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/additionoption/AllModuleCopy.jsx

@@ -4,7 +4,7 @@ export default function AllModuleCopy(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">モジュール一括コピー設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AllModuleCopy(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/additionoption/AllModuleMove.jsx

@@ -4,7 +4,7 @@ export default function AllModuleMove(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">モジュール一括移動設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AllModuleMove(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/additionoption/AllModuleNumChange.jsx

@@ -4,7 +4,7 @@ export default function AllModuleNumChange(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">モジュール一括回路番号の変更</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -26,6 +26,7 @@ export default function AllModuleNumChange(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalBundleDelete.jsx

@@ -12,7 +12,7 @@ export default function AdditionalBundleDelete(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">ただし削除 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -71,6 +71,7 @@ export default function AdditionalBundleDelete(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalBundleEdit.jsx

@@ -12,7 +12,7 @@ export default function AdditionalBundleEdit(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">段挿入 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -61,6 +61,7 @@ export default function AdditionalBundleEdit(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalColumnDelete.jsx

@@ -12,7 +12,7 @@ export default function AdditionalColumnDelete(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">コピー設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -71,6 +71,7 @@ export default function AdditionalColumnDelete(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalColumnEdit.jsx

@@ -12,7 +12,7 @@ export default function AdditionalColumnEdit(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">列の挿入 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -61,6 +61,7 @@ export default function AdditionalColumnEdit(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/arrangementsetting/ArrangementSetting.jsx

@@ -11,7 +11,7 @@ export default function ArrangementSetting(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">配置面の描画</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -49,7 +49,6 @@ export default function ArrangementSetting(){
                         </button>
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <ArrangementTab01/>}
                         {buttonAct === 2 && <ArrangementTab02/>}
                         {buttonAct === 3 && <ArrangementTab03/>}
@@ -59,9 +58,10 @@ export default function ArrangementSetting(){
                     
                     <div className="grid-btn-wrap">
                         <button className="btn-frame modal mr5">一変戦に戻る</button>
-                        <button className="btn-frame modal act">外壁線確定</button>
+                        <button className="btn-frame modal act">配置面確定</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/auxiliarylineoprion/AuxiliarylineOption.jsx

@@ -20,7 +20,7 @@ export default function AuxiliarylineOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">補助線の作成</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -37,7 +37,6 @@ export default function AuxiliarylineOption(){
                         ))}
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <AuxiliaryTab01/>}
                         {buttonAct === 2 && <AuxiliaryTab02/>}
                         {buttonAct === 3 && <AuxiliaryTab03/>}
@@ -50,6 +49,7 @@ export default function AuxiliarylineOption(){
                         <button className="btn-frame modal act">外壁線確定</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/auxiliarysupport/AuxiliaryCopy.jsx

@@ -4,7 +4,7 @@ export default function AuxiliaryCopy(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">補助線のコピー </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -43,6 +43,7 @@ export default function AuxiliaryCopy(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/auxiliarysupport/AuxiliaryMove.jsx

@@ -4,7 +4,7 @@ export default function AuxiliaryMove(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">補助線の移動 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -43,6 +43,7 @@ export default function AuxiliaryMove(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/auxiliarysupport/AuxiliarySize.jsx

@@ -4,7 +4,7 @@ export default function AuxiliarySize(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">補助線サイズ変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -51,6 +51,7 @@ export default function AuxiliarySize(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/circuitstandsetting/CircuitStandSetting.jsx

@@ -9,8 +9,8 @@ export default function CircuitStandSetting(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap l-2`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
-                    <h1 className="title">回路と架台設定 </h1>
+                    <h1 className="title">回路設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
                 <div className="modal-body">
@@ -23,6 +23,7 @@ export default function CircuitStandSetting(){
                     {tabNum === 2 && <CircuitStandTab02 setTabNum={setTabNum}/>}
                     {tabNum === 3 && <CircuitStandTab03 setTabNum={setTabNum}/>}
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/colorselect/ColorSelect.jsx

@@ -5,7 +5,7 @@ export default function ColorSelect (){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lr`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">カラー設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -20,6 +20,7 @@ export default function ColorSelect (){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/displaychange/DisplayChange.jsx

@@ -9,7 +9,7 @@ export default function DisplayChange(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">表示の変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -63,6 +63,7 @@ export default function DisplayChange(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/distancemeasurement/DistanceMeasurement01.jsx

@@ -4,7 +4,7 @@ export default function DistanceMeasurement01(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">距離測定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -22,6 +22,7 @@ export default function DistanceMeasurement01(){
                         <button className="btn-frame modal act">確認</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/distancemeasurement/DistanceMeasurement02.jsx

@@ -4,7 +4,7 @@ export default function DistanceMeasurement02(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">距離測定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -57,6 +57,7 @@ export default function DistanceMeasurement02(){
                         <button className="btn-frame modal act">確認</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/distancemeasurement/DistanceMeasurement03.jsx

@@ -4,7 +4,7 @@ export default function DistanceMeasurement03(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">距離測定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -22,6 +22,7 @@ export default function DistanceMeasurement03(){
                         <button className="btn-frame modal act">確認</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/drawingflow/DrawingFlow.jsx

@@ -11,7 +11,7 @@ export default function DrawingFlow(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ml`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">面フローの設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -90,6 +90,7 @@ export default function DrawingFlow(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/eachpropertychange/EachPropertyChange.jsx

@@ -4,7 +4,7 @@ export default function EachPropertyChange() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">各辺属性の変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -14,7 +14,6 @@ export default function EachPropertyChange() {
                         <span>選択した値 [龍丸]</span>
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         <div className="outline-wrap">
                             <div className="radio-grid-wrap">
                                 <div className="d-check-radio pop">
@@ -88,6 +87,7 @@ export default function EachPropertyChange() {
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/eaves_keraba/EavesKerabaOption.jsx

@@ -18,7 +18,7 @@ export default function EvaseKerabaOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">軒・ケラバ変更</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -35,14 +35,13 @@ export default function EvaseKerabaOption(){
                         ))}
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <EavesKerabaTab01/>}
                         {buttonAct === 2 && <EavesKerabaTab02/>}
                         {buttonAct === 3 && <EavesKerabaTab03/>}
                         {buttonAct === 4 && <EavesKerabaTab04/>}
                     </div>
-                    
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/font_lineoption/FontOption.jsx

@@ -7,7 +7,7 @@ export default function FontOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lrr`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">フォント </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -51,6 +51,7 @@ export default function FontOption(){
                         <button className="btn-frame modal act">ストレージ</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/font_lineoption/LineOption.jsx

@@ -8,7 +8,7 @@ export default function LineOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">寸法線 設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -44,6 +44,7 @@ export default function LineOption(){
                         <button className="btn-frame modal act">ストレージ</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/font_lineoption/ShapeSizeOption.jsx

@@ -4,7 +4,7 @@ export default function ShapeSizeOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xsm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">図面サイズの設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -29,6 +29,7 @@ export default function ShapeSizeOption(){
                         <button className="btn-frame modal act">ストレージ</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/gridoption/GridCopy.jsx

@@ -19,7 +19,7 @@ export default function GridCopy() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm ${modalOption.gridcopy ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">グリッドのコピー </h1>
                     <button className="modal-close" onClick={HandleClickClose}>닫기</button>
                 </div>
@@ -48,6 +48,7 @@ export default function GridCopy() {
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/gridoption/GridMove.jsx

@@ -19,7 +19,7 @@ export default function GridMove() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm ${modalOption.gridmove ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">グリッド移動 </h1>
                     <button className="modal-close" onClick={HandleClickClose}>닫기</button>
                 </div>
@@ -62,6 +62,7 @@ export default function GridMove() {
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/gridoption/GridOption.jsx

@@ -24,7 +24,7 @@ export default function GridOption() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ssm ${modalOption.gridoption ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">ドット・ライングリッドの設定</h1>
                     <button className="modal-close" onClick={HandleClickClose}>닫기</button>
                 </div>
@@ -82,6 +82,7 @@ export default function GridOption() {
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/hexagonalroofoption/HexagonalRoofOption.jsx

@@ -9,8 +9,8 @@ export default function HexagonalRoofOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lx-2`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
-                    <h1 className="title">基本設定 </h1>
+                    <h1 className="title">モジュール/架台設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
                 <div className="modal-body">
@@ -25,6 +25,7 @@ export default function HexagonalRoofOption(){
                     {tabNum === 2 && <HexagonalRoofTab02 setTabNum={setTabNum}/>}
                     {tabNum === 3 && <HexagonalRoofTab03 setTabNum={setTabNum}/>}
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab01.jsx

@@ -5,7 +5,6 @@ export default function HexagonalRoofTab01({setTabNum}){
     return(
         <>
             <div className="properties-setting-wrap">
-                <div className="setting-tit">方位設定</div>
                 <div className="outline-wrap">
                     <div className="guide">※シミュレーション計算用方位を指定します。南の方位を設定してください。</div>
                     <div className="roof-module-compas">

src/components/canvas/modal/imagesize/ImageSize.jsx

@@ -6,7 +6,7 @@ export default function ImageSize(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">画像のサイズ変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -16,6 +16,7 @@ export default function ImageSize(){
                         <label htmlFor="size">{sizeValue}%</label>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/imgload/ImgLoad.jsx

@@ -4,7 +4,7 @@ export default function ImgLoad(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">画像を読み込む </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -55,6 +55,7 @@ export default function ImgLoad(){
                         <button className="btn-frame modal act">完了</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/manualroofshape/ManualRoofShape.jsx

@@ -15,7 +15,7 @@ export default function ManualRoofShape(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">屋根形状の設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -32,7 +32,6 @@ export default function ManualRoofShape(){
                         ))}
                     </div>
                     <div className="modal-bottom-border-bx">
-                        <div className="setting-tit">設定</div>
                         <div className="discrimination-box">
                             {buttonAct === 1 && <ManualTab01/>}
                             {buttonAct === 2 && <ManualTab02/>}
@@ -47,6 +46,7 @@ export default function ManualRoofShape(){
                         <button className="btn-frame modal act">設定完了</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/measuredvalueoption/MeasuredValueOption.jsx

@@ -4,7 +4,7 @@ export default function MeasuredValueOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ssm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">実測値設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -13,7 +13,6 @@ export default function MeasuredValueOption(){
                         <span>※隅棟・谷・棟の実際の寸法を入力してください。</span>
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         <div className="outline-wrap">
                             <div className="eaves-keraba-table">
                                 <div className="eaves-keraba-item">
@@ -50,6 +49,7 @@ export default function MeasuredValueOption(){
                         <button className="btn-frame modal act">適用</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/movingupdown/MovingUpDown.jsx

@@ -14,7 +14,7 @@ export default function MovingUpDonw(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">軒・ケラバ変更</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -31,7 +31,6 @@ export default function MovingUpDonw(){
                         ))}
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <MovingTab01/>}
                         {buttonAct === 2 && <MovingTab02/>}
                     </div>
@@ -39,6 +38,7 @@ export default function MovingUpDonw(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/objectoption/ObjectOption.jsx

@@ -17,7 +17,7 @@ export default function ObjectOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lrr`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">オブジェクトの配置 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -34,7 +34,6 @@ export default function ObjectOption(){
                         ))}
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <ObjectOptionTab01/>}
                         {buttonAct === 2 && <ObjectOptionTab02/>}
                         {buttonAct === 3 && <ObjectOptionTab03/>}
@@ -44,6 +43,7 @@ export default function ObjectOption(){
                         <button className="btn-frame modal act">作成</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/outerlinesetting/OuterLineWall.jsx

@@ -25,7 +25,7 @@ export default function OuterLineWall (){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r ${modalOption.outerwall ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">外壁線を描</h1>
                     <button className="modal-close" onClick={HandleClickClose}>닫기</button>
                 </div>
@@ -64,7 +64,6 @@ export default function OuterLineWall (){
                         </button>
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <Tab01/>}
                         {buttonAct === 2 && <Tab02/>}
                         {buttonAct === 3 && <Tab03/>}
@@ -77,6 +76,7 @@ export default function OuterLineWall (){
                         <button className="btn-frame modal act">外壁線確定</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/outerwalloffset/OuterWallOffset.jsx

@@ -15,7 +15,7 @@ export default function OuterWallOffset(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">外壁の編集とオフセット</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -32,7 +32,6 @@ export default function OuterWallOffset(){
                         ))}
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <OffsetTab01/>}
                         {buttonAct === 2 && <OffsetTab02/>}
                     </div>
@@ -40,6 +39,7 @@ export default function OuterWallOffset(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/placementsetting/PlacementSettingPop.jsx

@@ -13,7 +13,7 @@ export default function PlacementSettingPop(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ll`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">配置面初期設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -168,6 +168,7 @@ export default function PlacementSettingPop(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
                 {/* <PlacementGuidePop/>
                 <RoofingMaterialGudiePop/> */}
             </div>

src/components/canvas/modal/planeshapeoption/PlaneShapeOption.jsx

@@ -28,7 +28,7 @@ export default function PlaneShapeOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lr-2`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">屋根形状の設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -81,7 +81,7 @@ export default function PlaneShapeOption(){
                         </div>
                     </div>
                 </div>
-                <div className="modal-foot"></div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/propertiessetting/PropertiesSetting.jsx

@@ -4,7 +4,7 @@ export default function PropertiesSetting() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ssm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">外壁のプロパティの設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -24,6 +24,7 @@ export default function PropertiesSetting() {
                         <button className="btn-frame modal act">設定完了</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/roofallocation/RoofAllocation.jsx

@@ -12,7 +12,7 @@ export default function RoofAllocation() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lr`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">屋根面の割り当て</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -260,6 +260,7 @@ export default function RoofAllocation() {
                         <button className="btn-frame modal act">選択した屋根材として割り当て</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/roofmoduleoption/RoofModuleOption.jsx

@@ -9,8 +9,8 @@ export default function RoofModuleOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lx-2`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
-                    <h1 className="title">基本設定 </h1>
+                    <h1 className="title">モジュール/架台設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
                 <div className="modal-body">
@@ -25,6 +25,7 @@ export default function RoofModuleOption(){
                     {tabNum === 2 && <RoofModuleOptionTab02 setTabNum={setTabNum}/>}
                     {tabNum === 3 && <RoofModuleOptionTab03 setTabNum={setTabNum}/>}
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab01.jsx

@@ -5,7 +5,6 @@ export default function RoofModuleOptionTab01({setTabNum}){
     return(
         <>
             <div className="properties-setting-wrap">
-                <div className="setting-tit">方位設定</div>
                 <div className="outline-wrap">
                     <div className="guide">※シミュレーション計算用方位を指定します。南の方位を設定してください。</div>
                     <div className="roof-module-compas">

src/components/canvas/modal/roofselect/RoofSelect.jsx

@@ -9,7 +9,7 @@ export default function RoofSelect(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -23,6 +23,7 @@ export default function RoofSelect(){
                         <button className="btn-frame modal act">ストレージ</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/roofshapeoption/RoofShapeOption.jsx

@@ -23,7 +23,7 @@ export default function RoofShapeOption() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lr`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">屋根形状の設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -39,7 +39,6 @@ export default function RoofShapeOption() {
                         ))}
                     </div>
                     <div className="properties-setting-wrap">
-                        <div className="setting-tit">設定</div>
                         {shapeNum === 1 && <ShapeTab01/>}
                         {shapeNum === 2 && <ShapeTab02/>}
                         {shapeNum === 3 && <ShapeTab03/>}
@@ -50,6 +49,7 @@ export default function RoofShapeOption() {
                         <button className="btn-frame modal act">設定完了</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/roofshapeoption/ShapeTab01.jsx

@@ -2,14 +2,14 @@ export default function ShapeTab01() {
     return(
         <div className="setting-box">
             <div className="outline-form mb10">
-                <span className="mr10" style={{width: '24px'}}>傾斜</span>
+                <span className="mr10" style={{width: '50px'}}>傾斜</span>
                 <div className="input-grid mr5" style={{width: '100px'}}>
                     <input type="text" className="input-origin block" defaultValue={100}/>
                 </div>
                 <span className="thin">寸法</span>
             </div>
             <div className="outline-form">
-                <span className="mr10" style={{width: '24px'}}>軒の</span>
+                <span className="mr10" style={{width: '50px'}}>軒の出幅</span>
                 <div className="input-grid mr5" style={{width: '100px'}}>
                     <input type="text" className="input-origin block" defaultValue={100}/>
                 </div>

src/components/canvas/modal/roofshapeoption/discriminationtab/DiscriminationTab01.jsx

@@ -2,14 +2,14 @@ export default function DiscriminationTab01(){
     return(
         <>
             <div className="outline-form mb10">
-                <span className="mr10" style={{width: '24px'}}>傾斜</span>
+                <span className="mr10" style={{width: '50px'}}>傾斜</span>
                 <div className="input-grid mr5" style={{width: '100px'}}>
                     <input type="text" className="input-origin block" defaultValue={4}/>
                 </div>
                 <span className="thin">寸法</span>
             </div>
             <div className="outline-form">
-                <span className="mr10" style={{width: '24px'}}>軒の</span>
+                <span className="mr10" style={{width: '50px'}}>軒の出幅</span>
                 <div className="input-grid mr5" style={{width: '100px'}}>
                     <input type="text" className="input-origin block" defaultValue={500}/>
                 </div>

src/components/canvas/modal/settoing01/SettingModal01.jsx

@@ -34,7 +34,7 @@ export default function SettingModal01 (){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap sm ${modalOption.option ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">Canvas設定</h1>
                     <button className="modal-close" onClick={HandleClickClose}>닫기</button>
                 </div>
@@ -64,6 +64,7 @@ export default function SettingModal01 (){
                     {buttonAct === 2 && <SecondOption {...propsClick}/>}
                     {buttonAct === 3 && <ThirdOption {...propsClick}/>}
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/sizechange/SizeChang.jsx

@@ -6,7 +6,7 @@ export default function SizeChange(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ssm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">サイズ変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -50,6 +50,7 @@ export default function SizeChange(){
                         <button className="btn-frame modal act">作成</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/canvas/modal/slopeoption/SlopeOption.jsx

@@ -4,7 +4,7 @@ export default function SlopeOption (){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">傾斜設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -22,6 +22,7 @@ export default function SlopeOption (){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )

src/components/common/draggable/withDraggable.jsx

@@ -16,7 +16,7 @@ export default function WithDraggable({ isShow, handle = '', children }) {
         <Draggable
           position={{ x: position.x, y: position.y }}
           onDrag={(_, data) => handleOnDrag(data)}
-          handle={handle === '' ? '.modal-head' : handle}
+          handle={handle === '' ? '.handle' : handle}
         >
           {children}
         </Draggable>

src/components/publishpage/PublishPage.jsx

@@ -143,7 +143,7 @@ export default function PublishPage() {
                 </td>
                 <td className="coding_stat_web"></td>
                 <td className='red al-c'>
-                  <ul className='mb10'>
+                  {/* <ul className='mb10'>
                     <li>2024-10-28</li>
                     <li>*canvas-setting pop 수정</li>
                     <li>*이미지 크기조절 pop 추가</li>
@@ -239,9 +239,19 @@ export default function PublishPage() {
                     <li>2025-01-10</li>
                     <li>*지붕모듈선택 팝업 메뉴 2번 수정</li>
                   </ul>
-                  <ul>
+                  <ul className='mb10'>
                     <li>2025-01-17</li>
                     <li>*면형상 배치 팝업에 handle가능 공통 modal-foot 추가</li>
+                  </ul> */}
+                  <ul className=''>
+                    <li>2025-01-20</li>
+                    <li>*지붕모듈 설정 팝업 title, 회로 및 가대설정 팝업title, 해당 메뉴 명칭 변경</li>
+                    <li>*배치면 그리기 팝업 버튼명 변경경</li>
+                    <li>*지붕형상 설정 각 input title 명칭 간격 조정</li>
+                    <li>
+                      *팝업당 '설정' 텍스트 제거 리스트<br/>
+                      &#40;지붕형상 수동 설정, 배치면 그리기, 외벽선 작성, 오브젝트 배치, 동선이동 형 올림 내림, 지붕형상 설정, 지붕모듈 설정, 보조선 작성, 처마∙케라바 변경, 외벽선 편집 및 오프셋, 각 변 속성 변경, 실측치 설정	&#41;
+                    </li>
                   </ul>
                 </td>
                 <td className="t-center">2024-10-28</td>