When in the editor, alter the "twocolumns" and "threecolumns" classes to have a subtle border



2 years ago
2 years ago


(Reporter: sheppy, Assigned: sheppy)






2 years ago
When editing, there are options to apply the classes "twocolumns" or "threecolumns" to the content, using the toolbar. These classes do the obvious: they create a <div> which displays its content in either two or three columns.

While editing, it is hard to see where these special blocks are, and to see where the columns are, especially if you have only a small amount of information displayed. It would be helpful to have a subtle border, perhaps a very light grey or pale blue, drawn around the borders of each column while in the editor.

We already have a custom version of the "hidden" class while editing, so this ought not to be difficult to do.

Comment 1

2 years ago
I've submitted a PR for this: https://github.com/mozilla/kuma/pull/4080

It adds a light blue border around the columns in both two and three column modes both on desktop and mobile when editing only.
Severity: normal → enhancement
Keywords: in-triage

Comment 2

2 years ago
Commits pushed to master at https://github.com/mozilla/kuma

bug 1325097: Make columns more visible in editor

Updated the twocolumns and threecolumns classes so they draw with a pale
blue dotted border around the columns when in the editor, for ease of
layout work. The format is in a variable ($editor-box-border) so it can
be reused in other similar cases if needed.

Merge pull request #4115 from jwhitlock/column_editor_1325097

bug 1325097: Make columns more visible in editor
Pushed to staging
Assignee: nobody → eshepherd
Fix pushed to production
Last Resolved: 2 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.