Update the theme to use CKEditor 5

Created on 25 September 2023, 9 months ago
Updated 12 October 2023, 9 months ago

Problem/Motivation

Update the theme to use CKEditor 5
https://www.drupal.org/node/3259165 →

Steps to reproduce

1. Enable ckeditor5 and go to admin/config/content/formats and change all Text editors from CKEditor to CKEditor 5
2. Go to any field where CKEditor 5 is used (preferably the one that use Full HTML text format)

3a. Insert a Link
3b. You will see that link color is wrong and link is not underlined
3c. With this improvement applied, link has correct color and is underlined
3.d Furthermore, go to admin/appearance/settings/socialblue > Color scheme > Link color and change it - you should see the link color changed in CKEeditor as well

CKEditor4 (edit mode):

CKEditor5 (edit mode, without this improvement):

Front-end (content view, also expected result):

4a. Insert a Block Quote
4b. You will see that Block Quote style is wrong, comparing to what is rendered when you view the content
4c. With this improvement applied, Block Quote style correct
4.d Furthermore, go to admin/appearance/settings/socialblue > Color scheme > Primary color and change it - you should see the Block Quote style changed in CKEeditor as well

CKEditor4 (edit mode):

CKEditor5 (edit mode, without this improvement):

Front-end (content view, also expected result):

Proposed resolution

- Set ckeditor5-stylesheets: false to remove the warning without having to add any stylesheets.
- Apply socialblue color scheme defined in settings for link and blockquote html element in CKEditor 5.

Remaining tasks

N/A

User interface changes

N/A

API changes

N/A

Data model changes

N/A

📌 Task
Status

Fixed

Version

2.5

Component

Code

Created by

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Production build 0.69.0 2024