Pasted text background color using themes

[WebCMS]

When I copy/paste text from a page into a post/comment and another user reads using a different theme, the background color of the pasted text is displayed in the origin theme's background color. I know there is an option to Paste in Plain Text but users may not use it because the pasted text in the editor displays with the same background as the current theme and hence not noticeable.

Eg: Dark theme - copy text from a page and paste into the editor and post.

Other users using a light/default theme see the pasted text with dark background.

How do I workaround this issue? Here is the text I pasted that I copied from the dark theme into this editor here that is using light theme.

Welcome to your community!

Edited October 18, 2023 by WebCMS

[Robert Angle]

Frustrating isn't it. My Light Theme users complain complain when Dark Theme users paste white text. My Dark Theme users complain when my Light Theme users paste black text, because they can see any text at all unless they highlight it. It would be wonderful if "paste as Rich Text" could strip the background color and the text color so that they are just default 'automatic'.

You can switch from "paste as Rich Text" to "paste as plain text" in your AdminCP, but if you have users like I do who compose and format messages in an offline word processor, then they will complain when they are unable to paste their compositions with all the formatting they applied to it.

[Marc]

The above would be the only way around in at present

[WebCMS]

Welcome to your

19 hours ago, Robert Angle said:

Frustrating isn't it. My Light Theme users complain complain when Dark Theme users paste white text. My Dark Theme users complain when my Light Theme users paste black text, because they can see any text at all unless they highlight it. It would be wonderful if "paste as Rich Text" could strip the background color and the text color so that they are just default 'automatic'.

You can switch from "paste as Rich Text" to "paste as plain text" in your AdminCP, but if you have users like I do who compose and format messages in an offline word processor, then they will complain when they are unable to paste their compositions with all the formatting they applied to it.

Which option are you using to please most of your users?

[Robert Angle]

For right now, we leave Paste a Rich Text on. We call our dark theme "Dark Mode Beta (buggy)" and when a dark theme user complains to a light theme user, we kindly correct them that they are the ones using the buggy theme, and if they keep it up we will remove dark mode altogether, lol.

By far most of our users use our default light theme.

Hopefully this gets fixed in V5 with it's new click of a button dark/light CSS sorcery 😄

[Marc]

3 hours ago, Robert Angle said:

Hopefully this gets fixed in V5 with it's new click of a button dark/light CSS sorcery

I'll certainly mention this internally, however its worth pointing out here this would be an addition to the software rather than a fix as such, as its actually showing what was pasted.

[WebCMS]

18 minutes ago, Marc Stridgen said:

I'll certainly mention this internally, however its worth pointing out here this would be an addition to the software rather than a fix as such, as its actually showing what was pasted.

Text entered in the editor has no issues on any theme. When copied and pasted, your editor could sense the background/foreground color of the pasted text and compare it with the current theme's colors and make transparent adjustments (not sure if that is even possible).

This is how the text looks like when pasted from a Dark theme (when viewed on a Light theme).
This is how the text looks like when pasted from a Light theme (when viewed on a Dark theme).

With more power, comes more problems...

Edited October 19, 2023 by WebCMS

[opentype]

5 hours ago, WebCMS said:

Which option are you using to please most of your users?

Plain text.

I’m still surprised this isn’t the default with the IPS suite, even though it is everywhere else. You can’t paste color text in Facebook, Twitter and so on. It would only cause issues – as it does in Invision Community. 

Edited October 19, 2023 by opentype

[Randy Calvert]

In the latest v5 theme preview thread, the video talks about how you won’t need two separate themes in order to support dark mode. It shows the if you change a button from blue to say yellow, it automatically will change the text in the button to something with more contrast if needed. (Instead of a yellow button with white text, it would automatically change it to black for example.)

We don’t have full details yet, but it leaves hope the move to a single theme with full dark mode support will handle this better especially since it appears “auto” (match OS) is the default setting. 

I would keep an eye on the preview blogs as this MAY already be addressed!

[WebCMS]

23 hours ago, opentype said:

Plain text.

I’m still surprised this isn’t the default with the IPS suite, even though it is everywhere else. You can’t paste color text in Facebook, Twitter and so on. It would only cause issues – as it does in Invision Community. 

I like this for now as most users may not notice/use the option to Paste as Plain Text.

After pasting as Plain Text, users can reformat it if necessary. At least, the color of the pasted content won't get messed up awkwardly on the site across various themes.

Edited October 20, 2023 by WebCMS

[WebCMS]

Hello Team,

When rich text is pasted into the editor, the text has style attributes like so (taken this example from this IC site and pasted into editor using color themes):

<p style="background-color:#ffffff; color:#2f3d4b; font-size:14px; text-align:start">

The pasted rich text displays fine on a white theme due to matching colors. However, on a dark theme, the pasted text displays in black on a white background (opaque).

To make this transparent and display pasted content as expected on any color theme using current theme's colors, we just have to get rid of the background, background-color and color attributes from the HTML.

Please eliminate the background, background-color and color attributes from the HTML of the pasted rich text which would resolve the issue and users will be able to paste rich text as-is on any color theme which will be a HUGE breakthrough! Eliminating these color attributes will retain all other formatting and displays text in current theme colors. Forcing to paste as plain text results in a bad UX as the users would be required to reformat the text all over if the formatting like headers, tabular data, bullet lists, font-sizes, bolds, italics, etc. are important.

Even if only the attribute "keys" are removed (background-color: , background: and color:), it results in markup like below and it works fine too.

<p style="#ffffff; #2f3d4b; font-size:14px; text-align:start">

 

Please confirm if this is added to your roadmap..

Edited May 5 by WebCMS

[Jim M]

4 hours ago, WebCMS said:

Hello Team,

When rich text is pasted into the editor, the text has style attributes like so (taken this example from this IC site and pasted into editor using color themes):

<p style="background-color:#ffffff; color:#2f3d4b; font-size:14px; text-align:start">

The pasted rich text displays fine on a white theme due to matching colors. However, on a dark theme, the pasted text displays in black on a white background (opaque).

To make this transparent and display pasted content as expected on any color theme using current theme's colors, we just have to get rid of the background, background-color and color attributes from the HTML.

Please eliminate the background, background-color and color attributes from the HTML of the pasted rich text which would resolve the issue and users will be able to paste rich text as-is on any color theme which will be a HUGE breakthrough! Eliminating these color attributes will retain all other formatting and displays text in current theme colors. Forcing to paste as plain text results in a bad UX as the users would be required to reformat the text all over if the formatting like headers, tabular data, bullet lists, font-sizes, bolds, italics, etc. are important.

Even if only the attribute "keys" are removed (background-color: , background: and color:), it results in markup like below and it works fine too.

<p style="#ffffff; #2f3d4b; font-size:14px; text-align:start">

 

Please confirm if this is added to your roadmap..

Would recommend posting any feature suggestions in our Feedback forum.

[WebCMS]

2 hours ago, Jim M said:

Would recommend posting any feature suggestions in our Feedback forum.

Here you go...