www.aleph1.co.uk Git - yaffs-website/blob - web/core/modules/image/css/editors/image.css

   1 /**
   2  * @file
   3  * Functional styles for the Image module's in-place editor.
   4  */
   5
   6 /**
   7  * A minimum width/height is required so that users can drag and drop files
   8  * onto small images.
   9  */
  10 .quickedit-image-element {
  11   min-width: 200px;
  12   min-height: 200px;
  13 }
  14
  15 .quickedit-image-dropzone {
  16   display: flex;
  17   flex-direction: column;
  18   align-items: center;
  19   justify-content: center;
  20   position: absolute;
  21   top: 0;
  22   left: 0;
  23   width: 100%;
  24   height: 100%;
  25 }
  26
  27 .quickedit-image-icon {
  28   display: block;
  29   width: 50px;
  30   height: 50px;
  31   background-repeat: no-repeat;
  32   background-size: cover;
  33 }
  34
  35 .quickedit-image-field-info {
  36   display: flex;
  37   align-items: center;
  38   justify-content: flex-end;
  39 }
  40
  41 .quickedit-image-text {
  42   display: block;
  43 }
  44
  45 /**
  46  * If we do not prevent pointer-events for child elements, our drag+drop events
  47  * will not fire properly. This can lead to unintentional redirects if a file
  48  * is dropped on a child element when a user intended to upload it.
  49  */
  50 .quickedit-image-dropzone * {
  51   pointer-events: none;
  52 }