quickedit.module.css in Quick Edit 7

Generic base styles for Quick Edit module.

File

css/quickedit.module.css

/**
 * @file
 * Generic base styles for Quick Edit module.
 */

/**
 * Editable.
 */
.quickedit-editable {
  z-index: 98;
  position: relative;
  cursor: pointer;
}
.quickedit-editable:focus {
  outline: none;
}

/**
 * Highlighted (hovered) editable.
 */
.quickedit-editable.quickedit-highlighted {
  z-index: 99;
}
.quickedit-validation-errors > .messages {
  margin-left: 0;
  margin-right: 0;
}
.quickedit-validation-errors > .messages > ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

/**
 * In-place editors that don't use a popup.
 */
.quickedit-validation-errors {
  z-index: 300;
  position: relative;
}
.quickedit-validation-errors .messages.error {
  position: absolute;
  top: 6px;
  left: -5px; /* LTR */
  margin: 0;
  border: none;
}
[dir="rtl"] .quickedit-validation-errors .messages.error {
  left: auto;
  right: -5px;
}

/**
 * Styling specific to the 'form' in-place editor.
 */
#quickedit_backstage {
  display: none;
}
.quickedit-form {
  position: absolute;
  z-index: 300;
  max-width: 35em;
}
.quickedit-form .placeholder {
  min-height: 22px;
}

/**
 * Default form styling overrides.
 */
.quickedit-form .form-wrapper .form-wrapper {
  margin: inherit;
}
.quickedit-form .form-actions {
  display: none;
}
.quickedit-form input {
  max-width: 100%;
}

/**
 * Entity toolbar.
 */
.quickedit-toolbar-container {
  max-width: 100%;
  position: absolute;
  max-width: 320px;
  width: 320px;
  z-index: 100;
}
.quickedit-toolbar-container > .quickedit-toolbar-pointer,
.quickedit-toolbar-container > .quickedit-toolbar-lining {
  display: none;
}
.quickedit-form-container {
  position: relative;
  padding: 0;
  border: 0;
  margin: 0;
  vertical-align: baseline;
  z-index: 100;
}
.quickedit-toolgroup.ops {
  float: right; /* LTR */
}
[dir="rtl"] .quickedit-toolgroup.ops {
  float: left;
}
.quickedit-toolbar-label {
  overflow: hidden;
}
#quickedit-toolbar-fence {
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  position: fixed;
  z-index: -1;
}

/**
 * Modal.
 */
#quickedit_modal {
  z-index: 350;
  position: fixed;
  top: 40%;
  left: 40%; /* LTR */
}
[dir="rtl"] #quickedit_modal {
  left: auto;
  right: 40%;
}