Problem/Motivation

#3021388: Table style update introduced the following change:

table {
-  width: 100%;
-  margin: 0 0 10px;
+  min-width: 100%;
+  margin-top: var(--space-l);
+  margin-bottom: var(--space-l);

The width attribute is overridden by the default ckeditor skin in /core/assets/vendor/ckeditor/skins/moono-lisa/editor.css, but min-width is not:

.cke_reset_all * {
...
width: auto;
...
}

This causes some modal to display over the full width of the viewport:

Proposed resolution

Use table { width: 100%; } in line with the Seven implementation.

Remaining tasks

  1. Write a patch
  2. Review
  3. Commit

User interface changes

All modals use a width similar to Seven in Drupal core.

API changes

None.

Data model changes

None.

Comments

idebr created an issue. See original summary.

idebr’s picture

Issue summary: View changes
Status: Active » Needs review
StatusFileSize
new705 bytes

Attached patch replaces table { min-width: 100%; }with table { width: 100%; } in line with the Seven implementation.

idebr’s picture

Related issues: +#3021388: Table style update
zrpnr’s picture

Status: Needs review » Reviewed & tested by the community

Patch applied cleanly to the latest version of Claro.
I followed the steps, the tables now are a better width in the modal.

Changing min-width to width seems like a good solution to allow the editor css to override that property.

Marking RTBC

lauriii’s picture

Issue tags: +alpha target
lauriii’s picture

It seems like the CKEditor issue is separate from the dialog issue but nonetheless, both issues should be solved. It seems like changing to width rather than min-width solves the problem. I tested the patch and I couldn't find any regressions. Would be great to get a signoff from @huzooka as well.

huzooka’s picture

Since I can't really remember why I changed width to min-width, I'd say let's apply this fix!

  • lauriii committed c4464b0 on 8.x-1.x
    Issue #3049365 by idebr, lauriii, zrpnr, huzooka: table { min-width: 100...
lauriii’s picture

Status: Reviewed & tested by the community » Fixed

Committed. Thank you everyone!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.