771645 - Styles "Callout box", "Two Columns", and "Three Columns" have no effect.

Status: RESOLVED FIXED

(developer.mozilla.org Graveyard :: Wiki pages, defect, P1)

Description

[John Karahalis [:openjck]]

Steps to repeat:

1. https://developer-dev.allizom.org/en-US/docs/Lorem_Ipsum$edit
2. Select the first paragraph.
3. Apply any of the styles mentioned in the bug summary.

Expected result:

Styles are applied in WYSIWYG and in rendered page.

Actual result:

The styles are not applied. Instead, the selected paragraph loses a bottom margin in the WYSIWYG and on the resulting page.

Comment 1

[David Walsh :davidwalsh]

Sheppy: please comment; should these go in the main site stylesheet or a customizable stylesheet for you?

https://github.com/mozilla/kuma/pull/359

I would prefer the main stylesheet but we can do whichever.

Comment 2

[[github robot]]

Commit pushed to master at https://github.com/mozilla/kuma

https://github.com/mozilla/kuma/commit/07497b65930afe5c01756861bf90c384d79d5113
fix bug 771645 - Update styles dropdown classes

Comment 3

[John Karahalis [:openjck]]

Awesome! Thanks for taking care of this, David.

Two things:
* On allizom, "Two Columns" and "Three Columns" still look great but "Callout Box" still has no effect.
* Also, all of these styles remove the bottom margin of the paragraph.

Comment 4

[David Walsh :davidwalsh]

Hmmm;  looks like :groovecoder removed the .geckoVersion class from my PR.  Can you let me know on that groovecoder?

Also, to prevent the margin issue, it the geckoVersion class should have the following added to it:

margin: 0 0 1.286em;

Comment 5

[Luke Crouch [:groovecoder]]

.geckoVersion is in https://developer-new.mozilla.org/en-US/docs/Template:CustomCSS now.

Comment 6

[John Karahalis [:openjck]]

Still seeing the same thing on allizom.

Comment 7

[David Walsh :davidwalsh]

Does that template exist on allizom?

Comment 8

[John Karahalis [:openjck]]

Good point. Not seeing it on -new either, though.

Comment 9

[David Walsh :davidwalsh]

Works for me on -new:

https://developer-new.mozilla.org/en-US/docs/David_Walsh_Test

If we desire the same bottom margin as paragraphs, adding this style to .geckoVersion will do so:

margin: 0 0 1.286em;

I don't have permissions to do this so I'll need :sheppy to do so.

Comment 10

[John Karahalis [:openjck]]

(In reply to David Walsh :davidwalsh from comment #9)
> Works for me on -new:
> 
> https://developer-new.mozilla.org/en-US/docs/David_Walsh_Test

Awesome. That works for me, too. The only thing is that the style is not applied within the WYSIWYG itself. Also, the "Callout box" button is not using the style like buttons for "Note box", "Warning box", and others. Any idea why that is?

Comment 11

[David Walsh :davidwalsh]

:groovecoder -- is this the result of weird or aggressive caching?

Les merged my PR (https://github.com/mozilla/kuma/pull/367/files) which is an array instead of a single file, yet going to (https://developer-new.mozilla.org/en-US/docs/David_Walsh_Test$edit) and typing "CKEDITOR.config.contentsCss" into the console still shows the old, single file path.  Any idea here?

Comment 12

[Eric Shepherd [:sheppy]]

For what it's worth, using these from the style drop-down never worked in MindTouch; it's why we had the <div> button, so we could use that to pick the style from there. It worked but was lame.

Comment 13

[David Walsh :davidwalsh]

Just so the status of this is clear, I'm fairly certain this is a caching issue.  And everything displays properly on the view page, the callout button just doesn't look blue-ish in the editor.

Comment 14

[Eric Shepherd [:sheppy]]

The problem is that the styles are applied individually to each paragraph in the selecction, instead of the entire selection being wrapped in the appropriate style. This makes a huge difference, and breaks these styles pretty badly in terms of how they're meant to be used.

Comment 15

[John Karahalis [:openjck]]

(In reply to Eric Shepherd [:sheppy] from comment #14)
> The problem is that the styles are applied individually to each paragraph in
> the selecction, instead of the entire selection being wrapped in the
> appropriate style. This makes a huge difference, and breaks these styles
> pretty badly in terms of how they're meant to be used.

Sheppy: Does this apply to all styles? Could you file a bug for this?

Comment 16

[John Karahalis [:openjck]]

A few other things were mentioned in this thread, but I do think it makes sense to break them down into separate bugs.

Opened bug 773916, bug 773917, and bug 773918 about those things.