core/modules/ckeditor5/css/editor.css


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

/**
 * @file
 * Styles for the CKEditor 5 editor.
 */

/* Convert low opacity icons to full opacity. */
.ck-button:not(.ck-disabled) .ck-icon * {
  opacity: 1 !important;
  fill-opacity: 1 !important;
}

.ck-editor__main > :is(.ck-editor__editable, .ck-source-editing-area) {
  /* Set the min-height equal to configuration value for the number of rows.
   * The `--ck-min-height` value is set on the parent `.ck-editor` element by
   * JavaScript. We add that there because the `.ck-editor__editable` element's
   * inline styles are cleared on focus. */
  min-height: var(--ck-min-height);
  /* Set the max-height to not grow beyond the height of the viewport (minus
   * any toolbars. */
  max-height: calc(100vh - var(--drupal-displace-offset-top, 0px) - var(--drupal-displace-offset-bottom, 0px) - 20px);
}

/* Show the scrollbar on the source editing area. */
.ck-editor__main > .ck-source-editing-area textarea {
  overflow: auto;
}

/* Enhance visibility of selected/active buttons on the toolbar. */
.ck-toolbar__items .ck.ck-button.ck-on {
  border: 1px solid var(--ck-color-button-on-color);
}