79 lines
4.3 KiB
JavaScript
79 lines
4.3 KiB
JavaScript
import Image from "next/image";
|
|
|
|
export default function PlaneShapeTab01(){
|
|
return(
|
|
<>
|
|
<div className="plane-shape-wrapper">
|
|
<div className="plane-box shape-box">
|
|
<h3 className="plane-box-tit">設定</h3>
|
|
<div className="shape-box-inner">
|
|
<div className="shape-img">
|
|
<Image src="/static/images/canvas/plane_tab01.svg" alt="react" width={0} height={0} style={{width: 'auto', height:'auto'}}/>
|
|
</div>
|
|
<div className="shape-data">
|
|
<div className="eaves-keraba-table">
|
|
<div className="eaves-keraba-item">
|
|
<div className="eaves-keraba-th">
|
|
①
|
|
</div>
|
|
<div className="eaves-keraba-td">
|
|
<div className="outline-form">
|
|
<div className="input-grid mr5" style={{width: '57px'}}>
|
|
<input type="text" className="input-origin plane block" defaultValue={4500}/>
|
|
</div>
|
|
<span className="thin">mm</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="eaves-keraba-item">
|
|
<div className="eaves-keraba-th">
|
|
②
|
|
</div>
|
|
<div className="eaves-keraba-td">
|
|
<div className="outline-form">
|
|
<div className="input-grid mr5" style={{width: '57px'}}>
|
|
<input type="text" className="input-origin plane block" defaultValue={2600}/>
|
|
</div>
|
|
<span className="thin">mm</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="eaves-keraba-item">
|
|
<div className="eaves-keraba-th">
|
|
斜めの長さ
|
|
</div>
|
|
<div className="eaves-keraba-td">
|
|
<div className="outline-form">
|
|
<div className="input-grid mr5" style={{width: '57px'}}>
|
|
<input type="text" className="input-origin plane block" defaultValue={3500}/>
|
|
</div>
|
|
<span className="thin">mm</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="plane-box direction-box">
|
|
<h3 className="plane-box-tit">設定</h3>
|
|
<div className="plane-direction-box">
|
|
<div className="plane-direction">
|
|
<span className="top">北</span>
|
|
<span className="right">ドン</span>
|
|
<span className="bottom">南</span>
|
|
<span className="left">立つ</span>
|
|
<button className="plane-btn up"></button>
|
|
<button className="plane-btn right"></button>
|
|
<button className="plane-btn down act"></button>
|
|
<button className="plane-btn left"></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="plane-tab-guide">
|
|
ⓘ ①の長さ入力後に対角線の長さを入力すると、②の長さを自動計算します。
|
|
</div>
|
|
</>
|
|
)
|
|
} |