https://issues.liferay.com/browse/LRDOCS-805

https://issues.liferay.com/browse/LRDOCS-805

Updated LiferayToHtmlSerializer to handle different types of sidebars: notes, tips, and warnings. The serializer now add a separate div with a '[note|tip|warning]-sidebar-image' CSS class for the background image and wraps the text paragraph in a div with a '[note|tip|warning]-sidebar-paragraph' CSS class.

If the alt text of the sidebar node is not equal to "note", "tip", or "warning", the old serializer logic is used and an tag is printed. With the new serializer, tags are not created for sidebars with alt text equal to "note", "tip", or "warning". Instead, a theme developer can use the hard-coded CSS classes to add a background-image CSS property to specify an image. E.g.,

hr {
clear: left;
}

.sidebar-note-image sidebar-tip-image sidebar-warning-image {
background-image: url("tip.png");
float: left;
height: 111;
width: 100;
}

Also added a wrapper div with the 'sidebar' CSS around the entire sidebar content so that the horizonatal rules are no longer necessary to separate the sidebar content from the rest of a document.

@sez11a