www.aleph1.co.uk Git - yaffs-website/blob - web/core/modules/quickedit/css/quickedit.module.css

   1 /**
   2  * @file
   3  * Generic base styles for Quick Edit module.
   4  *
   5  * Note: every class is prefixed with "quickedit-" to prevent collisions with
   6  * modules or themes. In Edit module-specific DOM subtrees, this is not
   7  * necessary.
   8  */
   9
  10 /**
  11  * Editable.
  12  */
  13 .quickedit-editable {
  14   z-index: 98;
  15   position: relative;
  16   cursor: pointer;
  17 }
  18 .quickedit-editable:focus {
  19   outline: none;
  20 }
  21
  22 /**
  23  * Highlighted (hovered) editable.
  24  */
  25 .quickedit-editable.quickedit-highlighted {
  26   z-index: 99;
  27 }
  28 .quickedit-validation-errors > .messages {
  29   margin-left: 0;
  30   margin-right: 0;
  31 }
  32 .quickedit-validation-errors > .messages > ul {
  33   list-style: none;
  34   margin: 0;
  35   padding: 0;
  36 }
  37
  38 /**
  39  * In-place editors that don't use a popup.
  40  */
  41 .quickedit-validation-errors {
  42   z-index: 300;
  43   position: relative;
  44 }
  45 .quickedit-validation-errors .messages.error {
  46   position: absolute;
  47   top: 6px;
  48   left: -5px; /* LTR */
  49   margin: 0;
  50   border: none;
  51 }
  52 [dir="rtl"] .quickedit-validation-errors .messages.error {
  53   left: auto;
  54   right: -5px;
  55 }
  56
  57 /**
  58  * Styling specific to the 'form' in-place editor.
  59  */
  60 #quickedit_backstage {
  61   display: none;
  62 }
  63 .quickedit-form {
  64   position: absolute;
  65   z-index: 300;
  66   max-width: 35em;
  67 }
  68 .quickedit-form .placeholder {
  69   min-height: 22px;
  70 }
  71
  72 /**
  73  * Default form styling overrides.
  74  */
  75 .quickedit-form .form-wrapper .form-wrapper {
  76   margin: inherit;
  77 }
  78 .quickedit-form .form-actions {
  79   display: none;
  80 }
  81 .quickedit-form input {
  82   max-width: 100%;
  83 }
  84
  85 /**
  86  * Entity toolbar.
  87  */
  88 .quickedit-toolbar-container {
  89   position: absolute;
  90   max-width: 320px;
  91   width: 320px;
  92   z-index: 100;
  93 }
  94 .quickedit-toolbar-container > .quickedit-toolbar-pointer,
  95 .quickedit-toolbar-container > .quickedit-toolbar-lining {
  96   display: none;
  97 }
  98 .quickedit-form-container {
  99   position: relative;
 100   padding: 0;
 101   border: 0;
 102   margin: 0;
 103   vertical-align: baseline;
 104   z-index: 100;
 105 }
 106 .quickedit-toolgroup.ops {
 107   float: right; /* LTR */
 108 }
 109 [dir="rtl"] .quickedit-toolgroup.ops {
 110   float: left;
 111 }
 112 .quickedit-toolbar-label {
 113   overflow: hidden;
 114 }
 115 #quickedit-toolbar-fence {
 116   bottom: 0;
 117   left: 0;
 118   right: 0;
 119   top: 0;
 120   position: fixed;
 121   z-index: -1;
 122 }