Parcourir la source

Merge pull request #1060 from ckeditor/t/ckeditor5-build-decoupled-document/12

Docs: Updated the document editor example with a table markup. Updated document editor screenshot (see ckeditor/ckeditor5-build-decoupled-document#12).
Aleksander Nowodzinski il y a 7 ans
Parent
commit
7575fcc47d

+ 21 - 5
docs/_snippets/examples/document-editor.html

@@ -9,11 +9,27 @@
 			<p>We are delighted to welcome you to the annual <em>Flavorful Tuscany Meetup</em> and hope you will enjoy the programme as well as your stay at the <a href="http://ckeditor.com">Bilancino Hotel</a>.</p>
 			<p>Please find below the full schedule of the event.</p>
 
-			<ul>
-				<li>9:30 AM - 11:30 AM	Americano vs. Brewed - “know your coffee” session with <strong>Stefano Garau</strong></li>
-				<li>1:00 PM - 3:00 PM	Pappardelle al pomodoro - live cooking session with <strong>Rita Fresco</strong></li>
-				<li>5:00 PM - 8:00 PM	Tuscan vineyards at a glance - wine-tasting session with <strong>Frederico Riscoli</strong></li>
-			</ul>
+			<table>
+				<thead>
+					<tr>
+						<th colspan="2">Saturday, July 14</th>
+					</tr>
+				</thead>
+				<tbody>
+					<tr>
+						<td>9:30&nbsp;AM&nbsp;-&nbsp;11:30&nbsp;AM</td>
+						<td>Americano vs. Brewed - “know your coffee” session with <strong>Stefano Garau</strong></td>
+					</tr>
+					<tr>
+						<td>1:00&nbsp;PM&nbsp;-&nbsp;3:00&nbsp;PM</td>
+						<td>Pappardelle al pomodoro - live cooking session with <strong>Rita Fresco</strong></td>
+					</tr>
+					<tr>
+						<td>5:00&nbsp;PM&nbsp;-&nbsp;8:00&nbsp;PM</td>
+						<td>Tuscan vineyards at a glance - wine-tasting session with <strong>Frederico Riscoli</strong></td>
+					</tr>
+				</tbody>
+			</table>
 
 			<blockquote>
 				<p>The annual Flavorful Tuscany meetups are always a culinary discovery. You get the best of Tuscan flavors during an intense one-day stay at one of the top hotels of the region. All the sessions are lead by top chefs passionate about their profession. I would certainly recommend to save the date in your calendar for this one!</p>

BIN
docs/assets/img/editor-document.png


+ 6 - 0
docs/assets/snippet-styles.css

@@ -74,6 +74,12 @@ It breaks CKEditor 5 (see how <p><code>[]</code></p> looks). */
 	padding: 0;
 }
 
+/* https://github.com/ckeditor/ckeditor5/pull/1060 */
+.live-snippet .ck.ck-content .table table {
+	margin: 0;
+	display: table;
+}
+
 #snippet-inline-editor .ck-content {
 	margin-bottom: 1rem;
 	padding: 2rem;

+ 7 - 0
docs/assets/styles.css

@@ -9,6 +9,13 @@
 	}
 }
 
+/* https://github.com/ckeditor/ckeditor5-build-decoupled-document/issues/12 */
+@media only screen and (max-width: 1360px) {
+	.main .main__content-wide .main__content-inner {
+		max-width: 900px;
+	}
+}
+
 /* https://github.com/ckeditor/ckeditor5/issues/913 */
 @media only screen and (min-width: 1360px) {
 	.main .main__content.main__content-wide {

+ 1 - 1
docs/builds/guides/overview.md

@@ -60,7 +60,7 @@ To try it out online, check the {@link examples/builds/balloon-editor balloon ed
 
 The document editor is focused on rich text editing experience similar to the native word processors. It works best for creating documents which are usually later printed or exported to PDF files.
 
-{@img assets/img/editor-document.png 786 Screenshot of the user interface of the document editor.}
+{@img assets/img/editor-document.png 800 Screenshot of the user interface of the document editor.}
 
 To try it out online, check the {@link examples/builds/document-editor document editor example}. Jump to {@link builds/guides/quick-start#document-editor Quick start} to start using it.