Missing list styles in WYSIWYG editor, Detail views

pgorod commented 5 years ago

Issue

When content from WYSIWYG editors is shown in Detail views, some of the formatting is broken.

From this forum thread: https://suitecrm.com/suitecrm/forum/suitecrm-7-0-discussion/19469-knowledge-base-presentation-strips-formatting

It seems to affect several modules: Knowledge Base, Cases, Tasks, Project Tasks, maybe others.

Expected Behavior

Show same formatting when editing, and when seeing in detail view. Otherwise, what you see is not what you get...

Actual Behavior

Ordered lists and numbered lists appear without formatting.

Possible Fix

One user says it can be fixed with this change:

/*
CUSTOM CSS FOR DETAIL VIEW LIST ITEMS
 */

#description ul li {
    display: list-item;
    list-style-position: inside;
    list-style-type: disc;
}

#description ol li {
    display: list-item;
    list-style-position: inside;
    list-style-type: decimal;
}

He's adding this in custom/themes/SuiteP/css/[Each subtheme]/style.css, but this should be fixed in the base files.

It's important to make sure that CSS is correct, and that it doesn't affect other places we don't intend it to...

Steps to Reproduce

Please see forum thread, there are examples with screenshots there.

Your Environment

SuiteCRM Version used: 7.10.7

belchfireid commented 5 years ago

Thanks for the proposed fix - it made KB useful for us. However, it is incomplete - it doesn't fix structured lists (indented list elements).

Also, the editor is a different style from the email template editors, and it is not WYSIWYG in a lot of other ways. Perhaps fix by using the same style editor as in the email template editor (configurable by the administrator), as that seems to work.

pgorod commented 5 years ago

@belchfireid Can you use your browser's developer console to see which CSS classes/ids still need to be fixed?

belchfireid commented 5 years ago

I'm not sure where to find what you're looking for in the developer console. Perhaps someone with more CSS knowledge can help.

The KB entry is displayed in the editor ok, saved by the editor ok, it just doesn't display ok once saved.

This editor entry: