Issue #3255204: [SUPPORT] CKEditor5 (5c464364) · Commits · project / gin

dist/css/base/gin.css

+4 −1

Original line number	Diff line number	Diff line
		@@ -3336,7 +3336,10 @@ hr {
		.form-actions .action-link:focus,
		.paragraphs-tabs-wrapper .field-multiple-table .draggable.drag,
		.layout-paragraphs-field .layout-paragraphs-actions input.layout-paragraphs-edit:focus,
		.layout-paragraphs-field .layout-paragraphs-actions input.layout-paragraphs-remove:focus {
		.layout-paragraphs-field .layout-paragraphs-actions input.layout-paragraphs-remove:focus,
		.ck .ck.ck-button:active,
		.ck .ck.ck-button:focus,
		.ck .ck.ck-button:active:focus {
		outline: none;
		box-shadow: 0 0 0 1px var(--gin-color-focus-border), 0 0 0 4px var(--gin-color-focus);
		}

dist/css/components/ckeditor5.css

0 → 100644

+100 −0

Original line number	Diff line number	Diff line
		.ck {
		--ck-spacing-small: var(--gin-spacing-xs);
		--ck-color-text: var(--gin-color-text);
		--ck-color-toolbar-background: var(--gin-bg-layer3);
		--ck-color-toolbar-border: var(--gin-border-color-form-element);
		--ck-color-base-foreground: var(--gin-bg-layer3);
		--ck-color-base-background: var(--gin-bg-input);
		--ck-color-base-border: var(--ck-color-toolbar-border);
		--ck-color-list-button-on-text: var(--gin-color-button-text);
		--ck-color-list-button-on-background: var(--gin-color-primary);
		--ck-color-list-button-on-background-focus: var(--gin-color-primary-hover);
		--ck-color-list-button-hover-background: var(--gin-color-primary-light-hover);
		--ck-color-panel-background: var(--gin-bg-layer3);
		--ck-color-panel-border: transparent;
		--ck-color-button-default-background: transparent;
		--ck-color-button-default-hover-background: var(--gin-color-primary-light);
		--ck-color-button-default-active-background: var(--gin-color-primary-light-active);
		--ck-color-button-default-disabled-background: transparent;
		--ck-color-button-on-color: var(--gin-color-primary);
		--ck-color-button-on-background: var(--gin-color-primary-light);
		--ck-color-button-on-hover-background: var(--gin-color-primary-light-hover);
		--ck-color-button-on-active-background: var(--gin-color-primary-active);
		--ck-color-split-button-hover-background: var(--gin-bg-layer2);
		--ck-color-split-button-hover-border: var(--gin-border-color-layer);
		--ck-color-button-save: var(--gin-color-green);
		--ck-color-button-cancel: var(--gin-color-danger);
		--ck-color-link-default: var(--gin-color-primary);
		--ck-color-link-selected-background: var(--gin-bg-item-hover);
		--ck-color-input-background: var(--gin-bg-input);
		--ck-color-input-border: var(--gin-border-color-form-element);
		--ck-color-labeled-field-label-background: var(--gin-bg-layer3);
		--ck-color-list-background: var(--gin-bg-layer3);
		--ck-focus-ring: 1px solid var(--gin-color-focus);
		--ck-focus-outer-shadow: 0 0 0 1px var(--gin-color-focus-border), 0 0 0 4px var(--gin-color-focus);
		--ck-inner-shadow: var(--ck-focus-outer-shadow);
		--ck-drop-shadow: var(--gin-shadow-l2);
		--ck-color-focus-border: var(--gin-color-primary);
		--ck-color-widget-type-around-button-active: var(--gin-color-primary);
		--ck-color-widget-blurred-border: var(--gin-color-primary-hover);
		--ck-color-widget-hover-border: var(--gin-color-text);
		--ck-color-widget-type-around-button-hover: var(--gin-color-text);
		--ck-color-image-caption-text: var(--gin-color-text-light);
		--ck-color-image-caption-background: transparent;
		--ck-border-radius: var(--gin-border-m);
		--ck-z-modal: 98;
		}

		.ck .ck-content blockquote,
		.ck .ck.ck-dropdown__panel {
		border: none;
		}

		.ck.ck-sticky-panel .ck-sticky-panel__content.ck-sticky-panel__content_sticky {
		top: var(--gin-sticky-offset);
		}

		.ck .ck-toolbar__separator {
		opacity: .3;
		}

		.ck .ck-button[aria-pressed=true] {
		color: var(--gin-color-primary-active);
		border: 2px solid var(--gin-color-primary);
		}

		[dir="ltr"] .ck .ck-button.ck-source-editing-button {
		padding-left: var(--gin-spacing-m);
		}

		[dir="rtl"] .ck .ck-button.ck-source-editing-button {
		padding-right: var(--gin-spacing-m);
		}

		.ck.ck-button:not(.ck-disabled):hover {
		color: var(--gin-color-primary-active);
		}

		.ck .ck-source-editing-area {
		overflow: inherit;
		}

		.ck textarea {
		color: var(--ck-color-text);
		background: var(--ck-color-base-background);
		}

		.ck textarea:focus {
		outline: none;
		box-shadow: var(--ck-focus-outer-shadow);
		}

		.ck .ck.ck-media-alternative-text-form .ck-button {
		border: none;
		}

		.ck .ck-content .drupal-media > figcaption {
		color: var(--ck-color-image-caption-text);
		background: var(--ck-color-image-caption-background);
		}

gin.info.yml

+4 −0

Original line number	Diff line number	Diff line
		@@ -149,6 +149,10 @@ libraries-extend:
		- gin/autocomplete
		core/ckeditor:
		- gin/ckeditor
		ckeditor/ckeditor:
		- gin/ckeditor
		core/ckeditor5:
		- gin/ckeditor5
		core/drupal.dialog:
		- gin/dialog
		core/drupal.ajax:

gin.libraries.yml

+5 −0

Original line number	Diff line number	Diff line
		@@ -187,6 +187,11 @@ ckeditor:
		dependencies:
		- core/once

		ckeditor5:
		css:
		theme:
		dist/css/components/ckeditor5.css: { minified: false }

		ajax:
		css:
		theme:

styles/base/_focus.scss

+4 −1

Original line number	Diff line number	Diff line
		@@ -15,7 +15,10 @@
		.form-actions .action-link:focus,
		.paragraphs-tabs-wrapper .field-multiple-table .draggable.drag,
		.layout-paragraphs-field .layout-paragraphs-actions input.layout-paragraphs-edit:focus,
		.layout-paragraphs-field .layout-paragraphs-actions input.layout-paragraphs-remove:focus {
		.layout-paragraphs-field .layout-paragraphs-actions input.layout-paragraphs-remove:focus,
		.ck .ck.ck-button:active,
		.ck .ck.ck-button:focus,
		.ck .ck.ck-button:active:focus {
		outline: none;
		box-shadow: 0 0 0 1px var(--gin-color-focus-border), 0 0 0 4px var(--gin-color-focus);
		}