/** * @file * Functional styles for the Image module's in-place editor. */ /** * A minimum width/height is required so that users can drag and drop files * onto small images. */ .quickedit-image-element { min-width: 200px; min-height: 200px; } .quickedit-image-dropzone { display: flex; flex-direction: column; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .quickedit-image-icon { display: block; width: 50px; height: 50px; background-repeat: no-repeat; background-size: cover; } .quickedit-image-field-info { display: flex; align-items: center; justify-content: flex-end; } .quickedit-image-text { display: block; } /** * If we do not prevent pointer-events for child elements, our drag+drop events * will not fire properly. This can lead to unintentional redirects if a file * is dropped on a child element when a user intended to upload it. */ .quickedit-image-dropzone * { pointer-events: none; }