vue-grabbing-box/dist/vue2/index.css

vue-grabbing-box is a container component that allows you to grab to change view-box and also with scaling

.relative{position:relative}.flex{display:flex}.h-full{height:100%}.w-full{width:100%}.cursor-grab{cursor:grab}.cursor-grabbing{cursor:grabbing}.flex-col{flex-direction:column}.overflow-hidden{overflow:hidden}.items-center{align-items:center}.justify-center{justify-content:center}.scale-btn-group[data-v-0123c1b8]{position:absolute;top:20px;right:10px;z-index:999;user-select:none}.scale-button[data-v-0123c1b8]{height:28px;text-align:center;color:#606266;background:#fff;border:1px solid #dcdfe6;cursor:pointer;box-sizing:border-box;vertical-align:middle;outline:none}.scale-button[data-v-0123c1b8]:hover:not(.is-disabled){color:#409eff;border-color:#c6e2ff;background-color:#ecf5ff}.scale-button[data-v-0123c1b8]:active:not(.is-disabled){color:#3a8ee6;border-color:#3a8ee6;outline:0}.scale-button.is-disabled[data-v-0123c1b8]{color:#c0c4cc;cursor:not-allowed;background-image:none;background-color:#fff;border-color:#ebeef5}.scale-button.btn-plus[data-v-0123c1b8],.scale-button.btn-minus[data-v-0123c1b8]{width:28px;font-size:1.25rem;border-radius:50%;line-height:24px}.scale-button.btn-reset[data-v-0123c1b8]{padding:5px 15px;font-size:12px;border-radius:2px;margin-left:10px}.grabbing-box-container .cursor-grab[data-v-ef31f3e2],.grabbing-box-container .cursor-grab *[data-v-ef31f3e2] :not(:hover){cursor:grab}.grabbing-box-container .cursor-grabbing[data-v-ef31f3e2],.grabbing-box-container .cursor-grabbing *[data-v-ef31f3e2]{cursor:grabbing}.grabbing-box-container .scale-button-group[data-v-ef31f3e2]{--scale-buttons-space-x: 10px;--scale-buttons-space-y: 20px}.grabbing-box-container .scale-button-group.custom-position-top[data-v-ef31f3e2]{top:var(--scale-buttons-space-y);bottom:unset}.grabbing-box-container .scale-button-group.custom-position-bottom[data-v-ef31f3e2]{bottom:var(--scale-buttons-space-y);top:unset}.grabbing-box-container .scale-button-group.custom-position-left[data-v-ef31f3e2]{left:var(--scale-buttons-space-x);right:unset}.grabbing-box-container .scale-button-group.custom-position-right[data-v-ef31f3e2]{right:var(--scale-buttons-space-x);left:unset}.grabbing-box-container .grabbing-box *[data-v-ef31f3e2]{-webkit-user-drag:none}