N°7552 - CKEditor: Cleanup remains of previous mentions overloads

This commit is contained in:
Molkobain
2024-07-23 22:06:21 +02:00
parent aba737ab48
commit ce0d17e042
3 changed files with 32 additions and 82 deletions

View File

@@ -41,8 +41,8 @@ $ibo-input-select--select-wrapper--action-button--margin-right: 20px !default;
$ibo-input-select--action-button--padding-left: 6px !default;
$ibo-input-select--action-button--padding-right: $ibo-spacing-100 !default;
$ibo-input-select--autocomplete-item-image--size: 25px !default;
$ibo-input-select--autocomplete-item-image--margin-right: 0.5rem !default;
$ibo-input-select--autocomplete-item-image--size: 30px !default;
$ibo-input-select--autocomplete-item-image--margin-right: 0.7rem !default;
$ibo-input-select--autocomplete-item-image--background-color: $ibo-color-blue-100 !default;
$ibo-input-select--autocomplete-item-image--border: 1px solid $ibo-color-grey-600 !default;
@@ -233,6 +233,7 @@ $ibo-input-select--autocomplete-item-image--border: 1px solid $ibo-color-grey-60
}
.ibo-input-select--autocomplete-item-txt {
@extend %ibo-font-ral-nor-100;
@extend %ibo-text-truncated-with-ellipsis;
}

View File

@@ -1,4 +1,4 @@
/*
/*!
* @copyright Copyright (C) 2010-2024 Combodo SAS
* @license http://opensource.org/licenses/AGPL-3.0
*/
@@ -7,16 +7,16 @@
$ibo-vendors-highlightjs--padding: 0.9rem !default;
$ibo-vendors-highlightjs--border-radius: $ibo-border-radius-300 !default;
$ibo-vendors-ckeditor--autocomplete-panel--border: none !default;
$ibo-vendors-ckeditor--autocomplete-panel--border-radius: $ibo-border-radius-300 !default;
$ibo-vendors-ckeditor--autocomplete-panel--background-color: $ibo-color-white-100 !default;
$ibo-vendors-ckeditor--autocomplete-item-image--size: 25px !default;
$ibo-vendors-ckeditor--autocomplete-item-image--margin-right: 0.5rem !default;
$ibo-vendors-ckeditor--autocomplete-item-image--background-color: $ibo-color-blue-100 !default;
$ibo-vendors-ckeditor--autocomplete-item-image--border: 1px solid $ibo-color-grey-600 !default;
$ibo-vendors-ckeditor--autocomplete-item-title--text-color: #3A3A3A !default;
//$ibo-vendors-ckeditor--autocomplete-panel--border: none !default;
//$ibo-vendors-ckeditor--autocomplete-panel--border-radius: $ibo-border-radius-300 !default;
//$ibo-vendors-ckeditor--autocomplete-panel--background-color: $ibo-color-white-100 !default;
//
//$ibo-vendors-ckeditor--autocomplete-item-image--size: 25px !default;
//$ibo-vendors-ckeditor--autocomplete-item-image--margin-right: 0.5rem !default;
//$ibo-vendors-ckeditor--autocomplete-item-image--background-color: $ibo-color-blue-100 !default;
//$ibo-vendors-ckeditor--autocomplete-item-image--border: 1px solid $ibo-color-grey-600 !default;
//
//$ibo-vendors-ckeditor--autocomplete-item-title--text-color: #3A3A3A !default;
$ibo-vendors-ckeditor--ck-content--text-color: $ibo-color-grey-900 !default;
$ibo-vendors-ckeditor--ck-content-pre-language--padding: 0 !default;
$ibo-vendors-ckeditor--ck-content-pre-language--code--background-color: $ibo-color-grey-900 !default;
@@ -35,6 +35,10 @@ $ibo-vendors-ckeditor--ck-text-huge-font-size: $ibo-font-size-350 !default;
$ibo-vendors-ckeditor--ck-color-image-caption-text: $ibo-color-grey-900 !default;
$ibo-vendors-ckeditor--ck-mentions--item--line-height: 1.6rem !default;
$ibo-vendors-ckeditor--ck-mentions--item--padding-x: $ibo-spacing-300 !default;
$ibo-vendors-ckeditor--ck-mentions--item--padding-y: $ibo-spacing-200 !default;
/* CSS3 variables */
.ck {
--ck-color-list-button-on-background: #{$ibo-vendors-ckeditor--ck-color-list-button-on-background};
@@ -72,25 +76,6 @@ $ibo-vendors-ckeditor--ck-color-image-caption-text: $ibo-color-grey-900 !default
height: 200px;
}
/* Fullscreen button (Combodo custom plugin) */
.ck.ck-editor.cke-maximized {
position: fixed;
left: 0px;
top:0px;
width: 100%;
height: 100%;
z-index: 999;
display: flex;
flex-direction: column;
.ck-editor__main{
flex-grow: 1;
}
.ck-editor__editable_inline:not(.ck-comment__input *), .ck-source-editing-area{
height: 100% !important; /* !important to overload inline style from configuration.height */
width: 100% !important; /* !important to overload inline style from configuration.width */
}
}
.ck-content pre[data-language] {
padding: $ibo-vendors-ckeditor--ck-content-pre-language--padding !important;
code {
@@ -106,6 +91,14 @@ $ibo-vendors-ckeditor--ck-color-image-caption-text: $ibo-color-grey-900 !default
overflow: auto !important;
}
/* Mentions */
.ck-mentions {
.ck-button {
line-height: $ibo-vendors-ckeditor--ck-mentions--item--line-height;
padding: $ibo-vendors-ckeditor--ck-mentions--item--padding-y $ibo-vendors-ckeditor--ck-mentions--item--padding-x !important; /* Important in order to overload the CKE native rule */
}
}
/* Highlight JS */
.hljs {
padding: $ibo-vendors-highlightjs--padding !important;
@@ -117,50 +110,3 @@ $ibo-vendors-ckeditor--ck-color-image-caption-text: $ibo-color-grey-900 !default
.ibo-hljs-container{
padding: 0 !important;
}
/* Mentions */
.ibo-mention-item{
line-height: 1.6rem;
}
[data-role="object-mention"]{
color: #0782C1;
}
[data-role="object-mention"]:hover{
color: #2b6bb0;
}
/* Mentions in caselogs */
/* Note: Mind the "ul", it allows us to have a more precise rule than the original plugin's CSS so we can override it */
ul.cke_autocomplete_panel{
background-color: $ibo-vendors-ckeditor--autocomplete-panel--background-color;
border: $ibo-vendors-ckeditor--autocomplete-panel--border;
border-radius: $ibo-vendors-ckeditor--autocomplete-panel--border-radius;
@extend %ibo-elevation-300;
.ibo-vendors-ckeditor--autocomplete-item{
display: flex;
justify-content: left;
align-items: center;
}
.ibo-vendors-ckeditor--autocomplete-item-image{
width: $ibo-vendors-ckeditor--autocomplete-item-image--size;
height: $ibo-vendors-ckeditor--autocomplete-item-image--size;
/* min-xxx are here to avoid medallion to be horizontally compressed when the title is to long */
min-width: $ibo-vendors-ckeditor--autocomplete-item-image--size;
min-height: $ibo-vendors-ckeditor--autocomplete-item-image--size;
background-position: center center;
background-size: 100%;
border-radius: 100%;
margin-right: $ibo-vendors-ckeditor--autocomplete-item-image--margin-right;
background-color: $ibo-vendors-ckeditor--autocomplete-item-image--background-color;
border: $ibo-vendors-ckeditor--autocomplete-item-image--border;
@extend %ibo-fully-centered-content;
}
.ibo-vendors-ckeditor--autocomplete-item-title{
white-space: nowrap; /* Here we don't want to truncate the text as in an autocomplete we might have similar values and we need the user to see the entire text to be able to differenciate them */
color: $ibo-vendors-ckeditor--autocomplete-item-title--text-color;
@extend %ibo-font-weight-700;
}
}