@znuny/ckeditor5-autocomplete-plugin
Version:
A plugin for CKEditor 5 that provides an extendable autocomplete functionality with predefined mention and HTML replacement logic.
53 lines (43 loc) • 1.51 kB
CSS
/**
* @copyright Copyright (c) 2024, Znuny GmbH.
* @copyright Copyright (c) 2003-2024, CKSource Holding sp. z o.o.
*
* @license GNU GPL version 3
*
* This software comes with ABSOLUTELY NO WARRANTY. For details, see
* the enclosed file COPYING for license information (GPL). If you
* did not receive this file, see https://www.gnu.org/licenses/gpl-3.0.txt.
*/
:root {
--ck-mention-list-max-height: 300px;
}
.ck.ck-mentions {
max-height: var(--ck-mention-list-max-height);
overflow-y: auto;
/* Prevent unnecessary horizontal scrollbar in Safari
https://github.com/ckeditor/ckeditor5-mention/issues/41 */
overflow-x: hidden;
overscroll-behavior: contain;
/* Prevent unnecessary vertical scrollbar in Safari
https://github.com/ckeditor/ckeditor5-mention/issues/41 */
& > .ck-list__item {
overflow: hidden;
flex-shrink: 0;
}
.ck-button,
.ck-button.ck-off {
background: var(--ck-color-mention-selection-background, var(--ck-color-button-default-background)) ;
color: var(--ck-color-mention-selection-text, var(--ck-color-text)) ;
}
.ck-button.ck-on {
background: var(--ck-color-mention-selection-background-selected, var(--ck-color-list-button-on-background)) ;
color: var(--ck-color-mention-selection-text-selected, var(--ck-color-list-button-on-text)) ;
}
.ck-button:hover, .ck-button>*:hover {
cursor: pointer;
}
.custom-flex-column-item {
display: flex;
flex-direction: column;
}
}