Problem/Motivation

The context menu in CKEditor looks odd, as stylesand accent are not applied:
Current look

Steps to reproduce

Add a link on text, image or drupal-media or else and then right-click it.

Proposed resolution

Add the styles via contextmenu_contentsCss to the context menu IFRAME using JS magic.
The custom accent color will not be taken into account as is seems to much code duplication and could be brought in in another issue (refactoring the custom accent color to a reuseable function).

User interface changes

The context menu will look nicer, especially in the dark-mode (dark and high-contrast and accent will be taken into account):
Patch applied

CommentFileSizeAuthor
#7 interdiff_2-7.txt1021 bytesytsurk
#7 3163905-ckeditor_context_menu-7.patch76.71 KBytsurk
#3 Screenshot from 2020-08-07 00-27-07.png37.07 KBytsurk
#3 Screenshot from 2020-08-07 00-29-14.png16.37 KBytsurk
#2 3163905-ckeditor_context_menu-2.patch76.71 KBytsurk
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

ytsurk created an issue. See original summary.

ytsurk’s picture

ytsurk
Location Switzerland
CreditAttribution: ytsurk at Flash AG commented
Status: Active » Needs review
FileSize
3163905-ckeditor_context_menu-2.patch76.71 KB

Bringing in the magic :D

ytsurk’s picture

ytsurk
Location Switzerland
CreditAttribution: ytsurk at Flash AG commented
Issue summary: View changes
FileSize
Screenshot from 2020-08-07 00-29-14.png16.37 KB
Screenshot from 2020-08-07 00-27-07.png37.07 KB
ytsurk’s picture

ytsurk
Location Switzerland
CreditAttribution: ytsurk at Flash AG commented
Issue summary: View changes
ytsurk’s picture

ytsurk
Location Switzerland
CreditAttribution: ytsurk at Flash AG commented
Issue summary: View changes
ytsurk’s picture

ytsurk
Location Switzerland
CreditAttribution: ytsurk at Flash AG commented
Title: CKEditor context menu not taking gin styles into account » CKEditor context menu should respect theme colors
Issue summary: View changes
ytsurk’s picture

ytsurk
Location Switzerland
CreditAttribution: ytsurk at Flash AG commented
FileSize
3163905-ckeditor_context_menu-7.patch76.71 KB
interdiff_2-7.txt1021 bytes

Fixed typo.

saschaeggi’s picture

saschaeggi
he/him
CreditAttribution: saschaeggi at Unic commented

This is great, thanks for your work. I'll review it tonight 👏

  • saschaeggi committed 2a0ac14 on 8.x-3.x authored by ytsurk 
    Issue #3163905 by ytsurk, saschaeggi: CKEditor context menu should...
saschaeggi’s picture

saschaeggi
he/him
CreditAttribution: saschaeggi at Unic commented

I did some minor adjustments and added it to dev.
Thanks!

  • saschaeggi committed 233b8b4 on 8.x-3.x authored by ytsurk 
    Issue #3163905 by ytsurk, saschaeggi: CKEditor context menu should...
ytsurk’s picture

ytsurk
Location Switzerland
CreditAttribution: ytsurk at Flash AG commented
Status: Needs review » Fixed

Thank you for bringing this in, I tested on the -dev branch. Looks all good :D

saschaeggi’s picture

saschaeggi
he/him
CreditAttribution: saschaeggi at Unic commented
Status: Fixed » Closed (fixed)

Included in 8.x-3.0-alpha25

funana’s picture

funana CreditAttribution: funana as a volunteer commented

@saschaeggi

We are on gin 8.x-3.0-alpha37 and the issue exists again.
Patch in #7 can't be applied. 

 - Applying patches for drupal/gin
    https://www.drupal.org/files/issues/2020-08-07/3163905-ckeditor_context_menu-2.patch (3163905: CKEditor context menu should respect theme colors)
   Could not apply patch! Skipping. The error was: Cannot apply patch https://www.drupal.org/files/issues/2020-08-07/3163905-ckeditor_context_menu-2.patch
saschaeggi’s picture

saschaeggi
he/him
CreditAttribution: saschaeggi at Unic commented

@funana -> #3245058: [CKEditor] Darkmode gets removed after checking the source