OrchardCMS / OrchardCore

Orchard Core is an open-source modular and multi-tenant application framework built with ASP.NET Core, and a content management system (CMS) built on top of that framework.
https://orchardcore.net
BSD 3-Clause "New" or "Revised" License
7.23k stars 2.34k forks source link

Trumbowyg - Missing table column dividers #13412

Open MikeKry opened 1 year ago

MikeKry commented 1 year ago

Describe the bug

Trumbowyg is missing column dividers. Problem is just visual (css), in HTML everything is ok.

image

MikeKry commented 1 year ago

Also table expands to 100% instead of just content width

hishamco commented 1 year ago

@agriffard any idea?

MikeKry commented 1 year ago

Locally we have fixed this by including these css rules in our custom css:

html[dir][data-theme=default] .trumbowyg-editor thead,
html[dir][data-theme=default] .trumbowyg-editor tbody,
html[dir][data-theme=default] .trumbowyg-editor tfoot,
html[dir][data-theme=default] .trumbowyg-editor tr,
html[dir][data-theme=default] .trumbowyg-editor td,
html[dir][data-theme=default] .trumbowyg-editor th {
    border-color: inherit;
    border-style: solid;
    border-width: 1px;
}

/*Used to set "empty" content in table cells. Without it cells have 0 height and only padding. */
html[dir][data-theme=default] .trumbowyg-editor td:after,
html[dir][data-theme=default] .trumbowyg-editor th:after {
    content: ".";
    opacity: 0;
}

and

/*Reset trumbowyg editor table width*/ html[data-theme=default] .trumbowyg-editor table { width: unset; }

hishamco commented 1 year ago

@MikeKry could you please submit a PR, if it fixes the current issue, if the fix for another related issue I prefer to file an issue describing the UI bug, then submit your PR