Merge pull request #240 from ckeditor/t/236,239

Docs: Enabled text wrapping to the new line in the decorators demo output. Simplified the markup of the decorators demo in the link feature guide. Closes #236. Closes #239.

docs/_snippets/features/linkdecorators.html

@@ -1,10 +1,23 @@
-<div id="snippet-link-decorators">
-	<p>
-		An <a href="https://ckeditor.com">external page</a> and a
-		<a download="download" href="https://cdn.ckeditor.com/ckeditor5/12.2.0/classic/ckeditor.js">downloadable resource</a>.
-	</p>
-</div>
+<!-- Used a textarea because of https://github.com/ckeditor/ckeditor5-link/pull/240#issuecomment-509269480 -->
+<textarea id="snippet-link-decorators">
+	&lt;p>
+		An &lt;a href="https://ckeditor.com">external page&lt;/a> and a
+		&lt;a download="download" href&#61;"image.png">downloadable resource&lt;/a>.
+	&lt;/p>
+</textarea>
 
 <pre class="highlight">
 	<code class="html hljs" id="output-link-decorators"></code>
 </pre>
+
+<style>
+	/*
+	 * The output is easier to read when it wraps to the next line.
+	 * See https://github.com/ckeditor/ckeditor5-link/issues/236.
+	 */
+	#output-link-decorators {
+		overflow: hidden;
+		white-space: normal;
+		word-break: break-all;
+	}
+</style>

docs/features/link.md

@@ -38,7 +38,7 @@ By default, all links created in the editor have the `href="..."` attribute in t
 
 ### Demo
 
-In the editor below, all **external** links get the `target="_blank"` and `rel="noopener noreferrer"` attributes ([automatic decorator](#adding-attributes-to-links-based-on-predefined-rules-automatic-decorators)). Click a link and edit it to see that it is possible to control the `downloadable` attribute of specific links using the switch button in the editing balloon ([manual decorator](#adding-attributes-to-links-using-the-ui-manual-decorators)). Take a look at the editor data below (updated live) to see the additional link attributes.
+In the editor below, all **external** links get the `target="_blank"` and `rel="noopener noreferrer"` attributes ([automatic decorator](#adding-attributes-to-links-based-on-predefined-rules-automatic-decorators)). Click a link and edit it to see that it is possible to control the `download` attribute of specific links using the switch button in the editing balloon ([manual decorator](#adding-attributes-to-links-using-the-ui-manual-decorators)). Take a look at the editor data below (updated live) to see the additional link attributes.
 
 {@snippet features/linkdecorators}
 
@@ -57,7 +57,7 @@ ClassicEditor
 			// Automatically add target="_blank" and rel="noopener noreferrer" to all external links.
 			addTargetToExternalLinks: true,
 
-			// Allow users control the "downloadable" attribute of each link.
+			// Allow users control the "download" attribute of each link.
 			decorators: [
 				{
 					mode: 'manual',