html, body { margin: 0; padding: 0; width: 100%; height: 100%; font-size: 12px; color: #333333; } #mount canvas { /* border-right: 1px solid #aaaaaa40; */ border: 1px solid #aaaaaa2a; background-image: linear-gradient(#aaaaaa2a 1px, transparent 0), linear-gradient(90deg, #aaaaaa2a 1px, transparent 0), linear-gradient(#aaaaaa4a 1px, transparent 0), linear-gradient(90deg, #aaaaaa4a 1px, transparent 0); background-size: 10px 10px, 10px 10px, 50px 50px, 50px 50px; } .dashboard { display: flex; width: 100%; flex-direction: column; } .dashboard .row { /* margin-top: 20px; */ display: flex; width: 100%; flex-direction: row; } .dashboard .row .col { display: flex; /* flex: 1; width: 100%; */ } .center { justify-content: center; align-items: center; } .transform { display: flex; margin-top: 10px; } .transform input { width: 100px; margin-right: 12px; } .elem-item { height: 32px; min-width: 300px; border: 1px solid #999999; border-bottom: none; line-height: 30px; color: #666; font-size: 14px; user-select: none; } .elem-item:last-child { border-bottom: 1px solid #999999; } .elem-item-name { margin: 0 10px; cursor: pointer; } .elem-item-btn { float: right; font-size: 12px; height: 24px; min-width: 40px; padding: 0 6px; border-radius: 12px; border: 1px solid #cccccc; text-align: center; line-height: 24px; margin-top: 2px; margin-right: 6px; cursor: pointer; } .btn-hidden { visibility: hidden; } .elem-item-btn:hover { color: #4183c4; border-color: #4183c4; } #mount { margin-top: 20px; margin-left: 20px; }