@shopify/polaris/build/esnext/components/DropZone/DropZone.css

Shopify’s admin product component library

.Polaris-DropZone_1ehhx{ position:relative; display:flex; justify-content:center; background-color:var(--p-surface); border-radius:var(--p-border-radius-base); }

.Polaris-DropZone_1ehhx::after{ content:''; position:absolute; z-index:29; top:0; right:0; bottom:0; left:0; border:0.1rem dashed transparent; border-radius:var(--p-border-radius-base); pointer-events:none; }

.Polaris-DropZone_1ehhx:not(.Polaris-DropZone--focused_17w4h)::after{ top:0; left:0; right:0; bottom:0; opacity:1; transform:scale(1); border:0.1rem dashed transparent; }

.Polaris-DropZone_1ehhx:hover{ outline:0.1rem solid transparent; }

.Polaris-DropZone--hasOutline_1z0fh{ padding:0.1rem; }

.Polaris-DropZone--hasOutline_1z0fh::after{ border-color:var(--p-border); }

.Polaris-DropZone--hasOutline_1z0fh:not(.Polaris-DropZone--isDisabled_7e21n):hover{ cursor:pointer; background-color:var(--p-surface-selected-hovered); }

.Polaris-DropZone--hasOutline_1z0fh:not(.Polaris-DropZone--isDisabled_7e21n):hover::after{ border-color:var(--p-interactive-hovered); }

.Polaris-DropZone--hasOutline_1z0fh:not(.Polaris-DropZone--focused_17w4h)::after{ top:0; left:0; right:0; bottom:0; opacity:1; transform:scale(1); border:0.1rem dashed transparent; border-radius:calc(var(--p-border-radius-base) + 0.2rem); border-color:var(--p-border); }

.Polaris-DropZone--isDragging_yvz0y:not(.Polaris-DropZone--isDisabled_7e21n){ background-color:var(--p-surface-hovered); }

.Polaris-DropZone--isDisabled_7e21n{ cursor:not-allowed; }

.Polaris-DropZone--isDisabled_7e21n::after{ border-color:var(--p-border-disabled); }

.Polaris-DropZone--sizeLarge_61dxo{ min-height:10rem; }

.Polaris-DropZone--sizeMedium_5f35p{ min-height:10rem; align-items:center; }

.Polaris-DropZone--sizeSmall_7647q{ padding:0; align-items:center; min-height:5rem; }

.Polaris-DropZone--measuring_wb2tw{ visibility:hidden; min-height:0; }

.Polaris-DropZone__Container_13mbo{ position:relative; flex:1 1; }

.Polaris-DropZone__Container_13mbo::after{ content:''; position:absolute; z-index:1; top:-0.2rem; right:-0.2rem; bottom:-0.2rem; left:-0.2rem; display:block; pointer-events:none; box-shadow:0 0 0 -0.2rem var(--p-focused); transition:box-shadow 100ms var(--p-ease); border-radius:calc(var(--p-border-radius-base) + 0.1rem); }

.Polaris-DropZone__Overlay_ib7rj{ border-radius:calc(var(--p-border-radius-base) + 0.2rem); position:absolute; z-index:30; top:0; right:0; bottom:0; left:0; display:flex; justify-content:center; align-items:center; padding:1.5rem; border:0.1rem dashed var(--p-interactive); text-align:center; color:var(--p-interactive); background-color:var(--p-surface-selected); pointer-events:none; }

.Polaris-DropZone--hasError_7q9ec .Polaris-DropZone__Overlay_ib7rj{ border-color:var(--p-border-critical); color:var(--p-text-critical); background-color:var(--p-surface-critical-subdued); }

.Polaris-DropZone--sizeSmall_7647q .Polaris-DropZone__Overlay_ib7rj{ padding:0; }

.Polaris-DropZone--focused_17w4h:not(.Polaris-DropZone--isDisabled_7e21n) .Polaris-DropZone__Container_13mbo::after{ box-shadow:0 0 0 0.2rem var(--p-focused); outline:0.1rem solid transparent; }