42 lines
2.1 KiB
JavaScript
42 lines
2.1 KiB
JavaScript
'use client'
|
|
|
|
import { useRecoilState } from "recoil";
|
|
import { ToggleonMouse } from "../layout/Header"
|
|
import { modalState } from "@/store/modalAtom";
|
|
|
|
export default function MenuDepth01(){
|
|
const [modalOption, setModalOption] = useRecoilState(modalState); //modal 열림닫힘 state
|
|
return(
|
|
<div className="canvas-depth2-inner">
|
|
<ul className="canvas-depth2-list">
|
|
<li className="canvas-depth2-item active"><button onClick={() => setModalOption({...modalOption, outerwall: true})}>外壁線を描</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>
|
|
<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>
|
|
<ul className="canvas-depth2-btn-list">
|
|
<li className="depth2-btn-box"
|
|
onMouseEnter={(e) => ToggleonMouse(e, 'add', 'ul')}
|
|
onMouseLeave={(e) => ToggleonMouse(e, 'remove', 'ul')}
|
|
>
|
|
<button>屋根面の割り当て</button>
|
|
</li>
|
|
<li className="depth2-btn-box"
|
|
onMouseEnter={(e) => ToggleonMouse(e, 'add', 'ul')}
|
|
onMouseLeave={(e) => ToggleonMouse(e, 'remove', 'ul')}
|
|
>
|
|
<button>屋根材の設定と変更</button>
|
|
</li>
|
|
<li className="depth2-btn-box"
|
|
onMouseEnter={(e) => ToggleonMouse(e, 'add', 'ul')}
|
|
onMouseLeave={(e) => ToggleonMouse(e, 'remove', 'ul')}
|
|
>
|
|
<button>屋根面全体削除</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
)
|
|
} |