mediaembedediting.css 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. /*
  2. * Copyright (c) 2003-2020, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  4. */
  5. @import "@ckeditor/ckeditor5-ui/theme/components/tooltip/mixins/_tooltip.css";
  6. .ck-media__wrapper {
  7. & .ck-media__placeholder {
  8. display: flex;
  9. flex-direction: column;
  10. align-items: center;
  11. & .ck-media__placeholder__url {
  12. @mixin ck-tooltip_enabled;
  13. /* Otherwise the URL will overflow when the content is very narrow. */
  14. max-width: 100%;
  15. position: relative;
  16. &:hover {
  17. @mixin ck-tooltip_visible;
  18. }
  19. & .ck-media__placeholder__url__text {
  20. overflow: hidden;
  21. display: block;
  22. }
  23. }
  24. }
  25. &[data-oembed-url*="twitter.com"],
  26. &[data-oembed-url*="google.com/maps"],
  27. &[data-oembed-url*="facebook.com"],
  28. &[data-oembed-url*="instagram.com"] {
  29. & .ck-media__placeholder__icon * {
  30. display: none;
  31. }
  32. }
  33. }
  34. /* Disable all mouse interaction as long as the editor is not read–only.
  35. https://github.com/ckeditor/ckeditor5-media-embed/issues/58 */
  36. .ck-editor__editable:not(.ck-read-only) .ck-media__wrapper > *:not(.ck-media__placeholder) {
  37. pointer-events: none;
  38. }
  39. /* Disable all mouse interaction when the widget is not selected (e.g. to avoid opening links by accident).
  40. https://github.com/ckeditor/ckeditor5-media-embed/issues/18 */
  41. .ck-editor__editable:not(.ck-read-only) .ck-widget:not(.ck-widget_selected) .ck-media__placeholder {
  42. pointer-events: none;
  43. }