8
0
Piotrek Koszuliński 5 лет назад
Родитель
Сommit
32efc5f68f
35 измененных файлов с 67 добавлено и 1 удалено
  1. 0 0
      packages/ckeditor5-build-balloon-block/build/ckeditor.js
  2. 0 0
      packages/ckeditor5-build-balloon-block/build/ckeditor.js.map
  3. 0 0
      packages/ckeditor5-build-balloon-block/build/translations/fa.js
  4. 0 0
      packages/ckeditor5-build-balloon-block/build/translations/fr.js
  5. 0 0
      packages/ckeditor5-build-balloon-block/build/translations/ug.js
  6. 0 0
      packages/ckeditor5-build-balloon-block/build/translations/zh-cn.js
  7. 0 0
      packages/ckeditor5-build-balloon/build/ckeditor.js
  8. 0 0
      packages/ckeditor5-build-balloon/build/ckeditor.js.map
  9. 0 0
      packages/ckeditor5-build-balloon/build/translations/fa.js
  10. 0 0
      packages/ckeditor5-build-balloon/build/translations/fr.js
  11. 0 0
      packages/ckeditor5-build-balloon/build/translations/ug.js
  12. 0 0
      packages/ckeditor5-build-balloon/build/translations/zh-cn.js
  13. 0 0
      packages/ckeditor5-build-classic/build/ckeditor.js
  14. 0 0
      packages/ckeditor5-build-classic/build/ckeditor.js.map
  15. 0 0
      packages/ckeditor5-build-classic/build/translations/fa.js
  16. 0 0
      packages/ckeditor5-build-classic/build/translations/fr.js
  17. 0 0
      packages/ckeditor5-build-classic/build/translations/ug.js
  18. 0 0
      packages/ckeditor5-build-classic/build/translations/zh-cn.js
  19. 0 0
      packages/ckeditor5-build-decoupled-document/build/ckeditor.js
  20. 0 0
      packages/ckeditor5-build-decoupled-document/build/ckeditor.js.map
  21. 0 0
      packages/ckeditor5-build-decoupled-document/build/translations/fa.js
  22. 0 0
      packages/ckeditor5-build-decoupled-document/build/translations/fr.js
  23. 0 0
      packages/ckeditor5-build-decoupled-document/build/translations/it.js
  24. 0 0
      packages/ckeditor5-build-decoupled-document/build/translations/ug.js
  25. 0 0
      packages/ckeditor5-build-decoupled-document/build/translations/zh-cn.js
  26. 0 0
      packages/ckeditor5-build-inline/build/ckeditor.js
  27. 0 0
      packages/ckeditor5-build-inline/build/ckeditor.js.map
  28. 0 0
      packages/ckeditor5-build-inline/build/translations/fa.js
  29. 0 0
      packages/ckeditor5-build-inline/build/translations/fr.js
  30. 0 0
      packages/ckeditor5-build-inline/build/translations/ug.js
  31. 0 0
      packages/ckeditor5-build-inline/build/translations/zh-cn.js
  32. 2 1
      packages/ckeditor5-html-embed/src/htmlembedediting.js
  33. 7 0
      packages/ckeditor5-html-embed/tests/htmlembedediting.js
  34. 16 0
      packages/ckeditor5-html-embed/theme/htmlembed.css
  35. 42 0
      packages/ckeditor5-theme-lark/theme/ckeditor5-html-embed/htmlembed.css

Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon-block/build/ckeditor.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon-block/build/ckeditor.js.map


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon-block/build/translations/fa.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon-block/build/translations/fr.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon-block/build/translations/ug.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon-block/build/translations/zh-cn.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon/build/ckeditor.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon/build/ckeditor.js.map


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon/build/translations/fa.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon/build/translations/fr.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon/build/translations/ug.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-balloon/build/translations/zh-cn.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-classic/build/ckeditor.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-classic/build/ckeditor.js.map


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-classic/build/translations/fa.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-classic/build/translations/fr.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-classic/build/translations/ug.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-classic/build/translations/zh-cn.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-decoupled-document/build/ckeditor.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-decoupled-document/build/ckeditor.js.map


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-decoupled-document/build/translations/fa.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-decoupled-document/build/translations/fr.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-decoupled-document/build/translations/it.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-decoupled-document/build/translations/ug.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-decoupled-document/build/translations/zh-cn.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-inline/build/ckeditor.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-inline/build/ckeditor.js.map


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-inline/build/translations/fa.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-inline/build/translations/fr.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-inline/build/translations/ug.js


Разница между файлами не показана из-за своего большого размера
+ 0 - 0
packages/ckeditor5-build-inline/build/translations/zh-cn.js


+ 2 - 1
packages/ckeditor5-html-embed/src/htmlembedediting.js

@@ -132,7 +132,8 @@ export default class HtmlEmbedEditing extends Plugin {
 				let domContentWrapper, state, props;
 
 				const viewContainer = writer.createContainerElement( 'div', {
-					class: 'raw-html-embed'
+					class: 'raw-html-embed',
+					'data-html-embed-label': t( 'HTML snippet' )
 				} );
 				// Widget cannot be a raw element because the widget system would not be able
 				// to add its UI to it. Thus, we need this wrapper.

+ 7 - 0
packages/ckeditor5-html-embed/tests/htmlembedediting.js

@@ -242,6 +242,13 @@ describe( 'HtmlEmbedEditing', () => {
 				expect( contentWrapper.hasClass( 'raw-html-embed__content-wrapper' ) );
 			} );
 
+			it( 'the widget should have the data-html-embed-label attribute for the CSS label', () => {
+				setModelData( model, '<rawHtml></rawHtml>' );
+				const widget = viewDocument.getRoot().getChild( 0 );
+
+				expect( widget.getAttribute( 'data-html-embed-label' ) ).to.equal( 'HTML snippet' );
+			} );
+
 			it( 'the main element should expose rawHtmlApi custom property', () => {
 				setModelData( model, '<rawHtml></rawHtml>' );
 				const widget = viewDocument.getRoot().getChild( 0 );

+ 16 - 0
packages/ckeditor5-html-embed/theme/htmlembed.css

@@ -8,6 +8,18 @@
 	/* Give the embed some air. */
 	margin: 1em auto;
 	position: relative;
+	clear: both;
+
+	/* ----- Emebed label in the upper left corner ----------------------------------------------- */
+
+	&::before {
+		position: absolute;
+
+		/* Make sure the content does not cover the label. */
+		z-index: 1;
+	}
+
+	/* ----- Emebed internals --------------------------------------------------------------------- */
 
 	/* The switch mode button wrapper. */
 	& .raw-html-embed__buttons-wrapper {
@@ -20,4 +32,8 @@
 .ck-content .raw-html-embed {
 	/* Give the embed some air. */
 	margin: 1em auto;
+
+	/* Give the html embed some minimal width in the content to prevent them
+	from being "squashed" in tight spaces, e.g. in table cells (https://github.com/ckeditor/ckeditor5/issues/8331) */
+	min-width: 15em;
 }

+ 42 - 0
packages/ckeditor5-theme-lark/theme/ckeditor5-html-embed/htmlembed.css

@@ -6,6 +6,7 @@
 :root {
 	--ck-html-embed-content-width: calc(100% - 1.5 * var(--ck-icon-size));
 	--ck-html-embed-source-height: 10em;
+	--ck-html-embed-unfocused-outline-width: 1px;
 	--ck-html-embed-content-min-height: calc(var(--ck-icon-size) + var(--ck-spacing-standard));
 }
 
@@ -14,6 +15,47 @@
 	font-size: var(--ck-font-size-base);
 	background-color: var(--ck-color-base-foreground);
 
+	&:not(.ck-widget_selected):not(:hover) {
+		outline: var(--ck-html-embed-unfocused-outline-width) dashed var(--ck-color-widget-blurred-border);
+	}
+
+	& .ck-widget__type-around .ck-widget__type-around__button.ck-widget__type-around__button_before {
+		margin-left: 50px;
+	}
+
+	/* ----- Emebed label in the upper left corner ----------------------------------------------- */
+
+	&::before {
+		content: attr(data-html-embed-label);
+		top: calc(-1 * var(--ck-html-embed-unfocused-outline-width));
+		left: var(--ck-spacing-standard);
+		background: hsl(0deg 0% 60%);
+		transition: background var(--ck-widget-handler-animation-duration) var(--ck-widget-handler-animation-curve);
+		padding: calc(var(--ck-spacing-tiny) + var(--ck-html-embed-unfocused-outline-width)) var(--ck-spacing-small) var(--ck-spacing-tiny);
+		border-radius: 0 0 var(--ck-border-radius) var(--ck-border-radius);
+		color: var(--ck-color-base-background);
+		font-size: var(--ck-font-size-tiny);
+		font-family: var(--ck-font-face);
+	}
+
+	@nest .ck.ck-editor__editable.ck-blurred &.ck-widget_selected::before {
+		top: 0px;
+		padding: var(--ck-spacing-tiny) var(--ck-spacing-small);
+	}
+
+	@nest .ck.ck-editor__editable:not(.ck-blurred) &.ck-widget_selected::before {
+		top: 0;
+		padding: var(--ck-spacing-tiny) var(--ck-spacing-small);
+		background: var(--ck-color-focus-border);
+	}
+
+	@nest .ck.ck-editor__editable &:not(.ck-widget_selected):hover::before {
+		top: 0px;
+		padding: var(--ck-spacing-tiny) var(--ck-spacing-small);
+	}
+
+	/* ----- Emebed internals --------------------------------------------------------------------- */
+
 	& .raw-html-embed__content-wrapper {
 		padding: var(--ck-spacing-standard);
 	}

Некоторые файлы не были показаны из-за большого количества измененных файлов