add auto-layout, free-layout, group-import, stock auto-sizing

This commit is contained in:
Stewart Allen 2020-02-25 20:42:48 -05:00
commit 852f72253d
5 changed files with 135 additions and 80 deletions

View file

@ -141,8 +141,8 @@
</div>
</div>
<!-- selection info -->
<div id="selection">
<span>
<div id="widget-info">
<span id="selection">
<label class="label">width:</label><label id="sel_width" class="value">mm</label>
<label class="label">depth:</label><label id="sel_depth" class="value">mm</label>
<label class="label">height:</label><label id="sel_height" class="value">mm</label>
@ -158,15 +158,22 @@
<button id="y+" title="hold SHIFT to rotate 5 degrees">y+</button><button id="y-" title="hold SHIFT to rotate 5 degrees">y-</button>
<button id="z+" title="hold SHIFT to rotate 5 degrees">z+</button><button id="z-" title="hold SHIFT to rotate 5 degrees">z-</button>
</span>
<span id="stock">
<label class="label">stock</label>
<label id="stock-width" class="value">mm</label> x
<label id="stock-depth" class="value">mm</label> x
<label id="stock-height" class="value">mm</label>
</span>
</div>
<!-- layer slider -->
<div id="layer-view" class="flow-row">
<button id="layer-toggle">layers</button>
<button id="layer-toggle" title="toggle layers">layers</button>
<div id="layers"></div>
<input id="layer-id" size="4">
<input id="layer-slider" type="range">
<button id="layer-range">section</button>
<input id="layer-span" size="4" value="1">
<input id="layer-id" size="4" title="selected layer">
<input id="layer-slider" type="range" title="layer selection">
<button id="layer-range" title="toggle section view">section</button>
<input id="layer-span" size="4" value="1" title="layer span">
<input id="opacity" type="range" title="opacity" min=0 max=100>
</div>
<!-- alert area -->
<div id="alert-area">

View file

@ -34,32 +34,34 @@ select {
font-family: monospace;
white-space: pre;
}
#selection {
display: none;
#widget-info {
text-align: center;
position: fixed;
width: 100%;
bottom: 3px;
}
#selection span {
#widget-info span {
border: 1px solid #ccc;
border-radius: 5px;
padding: 3px 8px 8px 8px;
background-color: rgba(170,221,255,0.75);
color: rgba(0,0,0,0.5);
}
#selection label {
#widget-info label {
border: 0;
}
#selection .value {
#widget-info .value {
font-weight: bold;
font-style: italic;
color: black;
}
#selection button {
#widget-info button {
margin: 0 2px 0 2px !important;
border: 1px solid rgba(255,255,255,0.75);
}
#stock,#selection {
display: none;
}
#appid {
text-align: center;
position: fixed;
@ -598,10 +600,15 @@ button[import="1"] {
margin-left: 4px !important;
margin-right: 4px !important;
}
#layer-slider {
#opacity {
max-width: 75px;
}
#layer-slider,#opacity {
border: 0;
margin: 0;
padding: 0;
}
#layer-slider {
flex-grow: 1;
}
#layers {