Commit 80bd9870 authored by r03ert0's avatar r03ert0

improve html style

parent 3c007d60
This diff is collapsed.
<div id='tools-side' style='display:block'>
<div id='tools-minimized'>
<div id="tools-side" style="display:block">
<div id="tools-minimized">
<div>
<img style='width:28px;position:absolute;top:10px;left:10px' src='./img/bars.svg' />
<img style="width:28px;position:absolute;top:10px;left:10px" src="./img/bars.svg" />
</div>
</div>
<div id='tools-maximized' style='display:flex;flex-direction:column;height:100%'>
<div id="tools-maximized" style="display:flex;flex-direction:column;height:100%">
<!-- tools hide/show, display left/right -->
<div id='headerBlock' style='flex:0 1 28px;background:#333'>
<div id="headerBlock" style="flex:0 1 28px;background:#333">
<div style='display:flex'>
<div style='flex:0 0 28px'><div id='display-minimize' title='Minimize toolbar' class='a push noBorder'><img class='icon' src='./img/times-circle.svg' /></div></div>
<div style='flex:1 1 auto'></div>
<div style='flex:0 0 28px'><div id='display-left' title='Display to the left' class='a push noBorder'><img class='icon' src='./img/caret-square-o-left.svg' /></div></div>
<div style='flex:0 0 28px'><div id='display-right' title='Display to the right' class='a push noBorder'><img class='icon' src='./img/caret-square-o-right.svg' /></div></div>
<div style="display:flex">
<div style="flex:0 0 28px"><div id="display-minimize" title="Minimize toolbar" class="a push noBorder"><img class="icon" src="./img/times-circle.svg" /></div></div>
<div style="flex:1 1 auto"></div>
<div style="flex:0 0 28px"><div id="display-left" title="Display to the left" class="a push noBorder"><img class="icon" src="./img/caret-square-o-left.svg" /></div></div>
<div style="flex:0 0 28px"><div id="display-right" title="Display to the right" class="a push noBorder"><img class="icon" src="./img/caret-square-o-right.svg" /></div></div>
</div>
</div>
<!-- slider -->
<div id='sliderBlock' style='flex:0 0 28px'>
<div style='display:flex'>
<div style='flex:0 0 28px'>
<div id='prev' class='a push'>-</div>
<div id="sliderBlock" style="flex:0 0 28px">
<div style="display:flex">
<div style="flex:0 0 28px">
<div id="prev" class="a push">-</div>
</div>
<div style='flex:1 0 28px;display:flex'>
<div style='flex:1;position:relative'>
<div id='slice' class='slider' data-max=100 data-val=0 style='position:absolute;height:100%;margin-left:10px;width:calc(100% - 20px)'>
<div class='track' style='position:absolute;left:0;top:50%;width:100%;border-top:1px solid #fff;padding:0;display:inline-block'></div>
<div class='thumb' style='position:absolute;left:0;top:50%;transform:translate(-10px,-10px);border-radius:10px;padding:0;width:20px;height:20px;background:#fff;display:inline-block'></div>
<div style="flex:1 0 28px;display:flex">
<div style="flex:1;position:relative">
<div id="slice" class="slider" data-max="100" data-val="0" style="position:absolute;height:100%;margin-left:10px;width:calc(100% - 20px)">
<div class="track" style="position:absolute;left:0;top:50%;width:100%;border-top:1px solid #fff;padding:0;display:inline-block"></div>
<div class="thumb" style="position:absolute;left:0;top:50%;transform:translate(-10px,-10px);border-radius:10px;padding:0;width:20px;height:20px;background:#fff;display:inline-block"></div>
</div>
</div>
</div>
<div style='flex:0 0 28px'>
<div id='next' class='a push'>+</div>
<div style="flex:0 0 28px">
<div id="next" class="a push">+</div>
</div>
</div>
</div>
<!-- buttons -->
<div id='buttonsBlock' style='flex:0 0 auto'>
<div style='display:flex;flex-wrap:wrap'>
<div id="buttonsBlock" style="flex:0 0 auto">
<div style="display:flex;flex-wrap:wrap">
<div style='flex:1 0 150px;width:50px'>
<div id='plane' style='display:flex' class='chose'>
<div style='flex:1'><div title='sag' class='a pressed'>Sag</div></div>
<div style='flex:1'><div title='cor' class='a'>Cor</div></div>
<div style='flex:1'><div title='axi' class='a'>Axi</div></div>
<div style="flex:1 0 150px;width:50px">
<div id="plane" style="display:flex" class="chose">
<div style="flex:1"><div title="sag" class="a pressed">Sag</div></div>
<div style="flex:1"><div title="cor" class="a">Cor</div></div>
<div style="flex:1"><div title="axi" class="a">Axi</div></div>
</div>
</div>
<div style='flex:1 0 150px;width:50px'>
<div style='display:flex'>
<div style='flex:1'><div id='fullscreen' title='Full screen' class='a toggle'><img class='icon' src='./img/fullscreen.svg' /></div></div>
<div style='flex:1'><div id='3drender' title='3D render' class='a push'><img class='icon' src='./img/3drender.svg' /></div></div>
<div style='flex:1'><div id='link' title='Link' class='a push'><img class='icon' src='./img/link.svg' /></div></div>
<div style="flex:1 0 150px;width:50px">
<div style="display:flex">
<div style="flex:1"><div id="fullscreen" title="Full screen" class="a toggle"><img class="icon" src="./img/fullscreen.svg" /></div></div>
<div style="flex:1"><div id="3drender" title="3D render" class="a push"><img class="icon" src="./img/3drender.svg" /></div></div>
<div style="flex:1"><div id="link" title="Link" class="a push"><img class="icon" src="./img/link.svg" /></div></div>
</div>
</div>
<div style='flex:1 0 150px;width:50px'>
<div id='paintTool' style='display:flex' class='chose'>
<div style='flex:1'><div title='Show' class='a pressed'><img class='icon' src='./img/show.svg' /></div></div>
<div style='flex:1'><div title='Adjust' class='a'><img class='icon' src='./img/adjust.svg' /></div></div>
<div style='flex:1'><div title='Eyedrop' class='a'><img class='icon' src='./img/eyedropper.svg' /></div></div>
<div style="flex:1 0 150px;width:50px">
<div id="paintTool" style="display:flex" class="chose">
<div style="flex:1"><div title="Show" class="a pressed"><img class="icon" src="./img/show.svg" /></div></div>
<div style="flex:1"><div title="Adjust" class="a"><img class="icon" src="./img/adjust.svg" /></div></div>
<div style="flex:1"><div title="Eyedrop" class="a"><img class="icon" src="./img/eyedropper.svg" /></div></div>
</div>
</div>
......@@ -73,8 +73,8 @@
</div>
<!-- Loading indicator -->
<div id='loadingIndicator'>
<div id="loadingIndicator">
<p>Loading...</p>
<div class='disc'></div>
<div class="disc"></div>
</div>
<!-- End Loading indicator -->
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment