Twenty Seventeen: Ordered List's "start" attribute doesn't work inside Post/Page Editor

[mmaumio]

Ordered list with a start attribute like this "<ol start="8"></ol>" doesn't show the list from the number specified on the editor.

It works great in the front end though.

So, the visual appearances of ol with start attribute in front-end and back-end are different.
Also, the numbers are bold in the editor whereas they are regular on the front end.
Isn't it the purpose of the Visual Editor to keep them visually similar at both ends?
Please, amend me if I'm wrong.

I have attached some screenshots along with a patch.

[mmaumio]

This is how it looked before the patch

[mmaumio]

This is how it looks on Front End

[mmaumio]

This is how it look in backend editor. Visually same with the frontend

[laurelfulford]

Thank you for reporting this issue, @mmaumio, and for your patch!

The bold numbered styles were originally going to be in Twenty Seventeen, but they ended up causing some issues (like breaking the start attribute) and were removed from the front end. It looks like they were missed in the editor styles, though.

I've tested your patch, and the fix looks good! The start attribute is actually followed now, and lists are styled to look like they do on the front-end.

One thing I do notice is that there's still a bit of CSS left in the editor-style.css related to the old list styles -- specifically:

ol {
	counter-reset: item;
}

and

.rtl ol {
	counter-reset: item;
}

Neither of these styles is actually causing an issue, but they're also no longer needed. Are you able to refresh your patch with those styles removed as well?

Just let me know if you have any questions at all about the above!

[mmaumio]

Thank you for your insights @laurelfulford I've made the amendment and uploaded the new patch.

[laurelfulford]

Thanks for updating the patch, @mmaumio!

[laurelfulford]

#40137 was marked as a duplicate.

[laurelfulford]

Thanks @mmaumio! olstartfixamend.diff​ looks good to me!

I'm going to mark this as commit in hopes it can get in with the 5.0.2 changes - otherwise, it should be able to be added to 5.1.

Also, I belatedly realized that #40137 is an earlier ticket that duplicates part of the same issue: the numbers in the editor were not correct.

I've closed that ticket in favour of this one since it's ready to go, but @edpittol should also get props in this commit for the work done in #40137 (thanks @edpittol!).

[mmaumio]

Thank You @laurelfulford

[laurelfulford]

In 44203:

Twenty Seventeen: Remove unnecessary ol styles from editor.

Twenty Seventeen was designed with bolded numbers for its ordered list styles. This was removed from the theme prior to launch, but it was left in the editor styles, so it needed to be removed there, too.

Props mmaumio, edpittol.
Fixes #44775.

[laurelfulford]

Reopening and marking fixed-5.0 so that this can be properly merged into trunk.

[desrosj]

In 44307:

Twenty Seventeen: Bug Fixes.

• Remove unnecessary ol styles from editor. Twenty Seventeen was designed with bolded numbers for its ordered list styles. This was removed from the theme prior to launch, but it was left in the editor styles, so it needed to be removed there, too.
• To improve accessibility, the cookies content checkbox in the comment form needed some visible indication when it’s in focus.
• Twenty Seventeen’s editor styles contained an Internet Explorer 8 specific fix that stopped images from being scalable in the editor in other browsers. Since the editor no longer supports IE8, this fix can safely be removed.
• Fix the font-family used for Simplified Chinese (zh_CN) in the block editor CSS.

Props mmaumio, edpittol, pratikthink, afercia, audrasjb, mihaivalentin, subrataemfluence, vaishalipanchal, ze3kr, laurelfulford.

Merges [44203-44205] and [44235] into trunk.

Fixes #44775, #44699, #39738, #45408.