editor.css

Same filename in other branches
  1. 9 core/modules/ckeditor5/css/editor.css
  2. 9 core/assets/vendor/ckeditor/skins/moono-lisa/editor.css
  3. 8.9.x core/assets/vendor/ckeditor/skins/moono-lisa/editor.css
  4. 10 core/modules/ckeditor5/css/editor.css

Styles for the CKEditor 5 editor.

File

core/modules/ckeditor5/css/editor.css

View source
  1. /**
  2. * @file
  3. * Styles for the CKEditor 5 editor.
  4. */
  5. /* Convert low opacity icons to full opacity. */
  6. .ck-button:not(.ck-disabled) .ck-icon * {
  7. opacity: 1 !important;
  8. fill-opacity: 1 !important;
  9. }
  10. .ck-editor__main > :is(.ck-editor__editable, .ck-source-editing-area) {
  11. /* Set the min-height equal to configuration value for the number of rows.
  12. * The `--ck-min-height` value is set on the parent `.ck-editor` element by
  13. * JavaScript. We add that there because the `.ck-editor__editable` element's
  14. * inline styles are cleared on focus. */
  15. min-height: var(--ck-min-height);
  16. /* Set the max-height to not grow beyond the height of the viewport (minus
  17. * any toolbars. */
  18. max-height: calc(100vh - var(--drupal-displace-offset-top, 0px) - var(--drupal-displace-offset-bottom, 0px) - 20px);
  19. }
  20. /* Show the scrollbar on the source editing area. */
  21. .ck-editor__main > .ck-source-editing-area textarea {
  22. overflow: auto;
  23. }
  24. /* Enhance visibility of selected/active buttons on the toolbar. */
  25. .ck-toolbar__items .ck.ck-button.ck-on {
  26. border: 1px solid var(--ck-color-button-on-color);
  27. }

Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.