1 |
- .editor{width:990px;min-height:100vh;margin:auto;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start;margin-left:0}.editor,.editor .editor-empty{display:-webkit-box;display:-ms-flexbox;display:flex}.editor .editor-empty{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%}.editor .layers{margin-bottom:10px;width:99.5%;position:relative}.editor .layers,.editor .layers .main{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-line-pack:start;align-content:flex-start}.editor .layers .main{width:100%;height:100%;border:1px dashed #ccc}.editor .layers .main:hover{border:1px dashed red}.editor .layers .main .empty-box{border:1px dashed #ccc;width:100%;height:40px}.editor .layers .label{position:absolute;top:50%;right:-80px;width:80px;height:50px;line-height:50px;-webkit-transform:translateY(-50%);transform:translateY(-50%);color:#323233;background-color:#fff;text-align:center;font-size:12px;-webkit-box-shadow:0 0 4px 0 rgba(10,42,97,.2);box-shadow:0 0 4px 0 rgba(10,42,97,.2);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.editor .layers .label .del{width:100%;position:absolute;height:100%;background:#000;opacity:.8;top:0;left:0;display:none}.editor .layers .label:hover .del{display:block}.editor .layers .controller{position:absolute;top:0;right:-50px;width:50px;height:100px;font-size:12px;border:1px dashed #ccc;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.editor .layers .controller,.editor .layers .controller .attr{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.editor .layers .controller .attr{height:50px;width:100%;border-bottom:1px solid #fff}.editor .layers .controller .attr .attr-icon-size{width:28px;height:28px}.editor .layers .controller .del{height:50px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.editor .layers .controller .del .attr-icon-size{width:28px;height:28px}.editor .active-layer{-webkit-box-shadow:0 0 5px rgba(0,0,0,.5);box-shadow:0 0 5px rgba(0,0,0,.5);border:1px solid #000}.btn-save{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;margin-right:10px}
|