Skip to content

Commit

Permalink
Document Editor demo source updated.
Browse files Browse the repository at this point in the history
  • Loading branch information
@AnnaTomanek
AnnaTomanek committed Oct 16, 2017
1 parent 3a7ed5a commit 6b80958
Show file tree
Hide file tree
Showing 2 changed files with 70 additions and 57 deletions.
92 changes: 38 additions & 54 deletions editors/document-editor/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="https://cdn.ckeditor.com/4.6.1/full-all/ckeditor.js"></script>
<script src="https://cdn.ckeditor.com/4.7.3/full-all/ckeditor.js"></script>
<title>Document Editor</title>
<style type="text/css">
/* Minimal styling to center the editor in this sample */
Expand All @@ -22,58 +22,42 @@
<div class="container">
<h2><label for="editor1">Document Editor</label></h2>
<textarea id="editor1">
&lt;h1 style="text-align:center"&gt;&lt;span style="font-family:Georgia,serif"&gt;&lt;span
style="color:#006699"&gt;Recognition of Achievement&lt;/span&gt;&lt;/span&gt;&lt;/h1&gt;

&lt;p style="text-align:justify"&gt;&lt;span style="font-family:Georgia,serif"&gt;This letter acknowledges the invaluable input &lt;strong&gt;you&lt;/strong&gt;, as a member
of our &lt;em&gt;Innovation Team&lt;/em&gt;,&amp;nbsp;have provided in the &amp;ldquo;Implement Rich Text Editor&amp;rdquo;&amp;nbsp;project. The Management would like to hereby thank you for this great accomplishment that was delivered in a timely fashion, up to the highest company standards, and with great results:&lt;/span&gt;&lt;/p&gt;

&lt;table border="1" bordercolor="#ccc" cellpadding="5" cellspacing="0" style="border-collapse:collapse;width:100%"
summary="Project Schedule"&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th scope="col" style="background-color:#cccccc"&gt;&lt;span style="font-family:Georgia,serif"&gt;Project Phase&lt;/span&gt;&lt;/th&gt;
&lt;th scope="col" style="background-color:#cccccc"&gt;&lt;span style="font-family:Georgia,serif"&gt;Deadline&lt;/span&gt;&lt;/th&gt;
&lt;th scope="col" style="background-color:#cccccc"&gt;&lt;span style="font-family:Georgia,serif"&gt;Status&lt;/span&gt;&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;&lt;span style="font-family:Georgia,serif"&gt;Phase 1: Market research&lt;/span&gt;&lt;/td&gt;
&lt;td style="text-align:center"&gt;&lt;span style="font-family:Georgia,serif"&gt;2016-10-15&lt;/span&gt;&lt;/td&gt;
&lt;td style="text-align:center"&gt;&lt;span style="font-family:Georgia,serif"&gt;&lt;span style="color:#19b159"&gt;✓&lt;/span&gt;&lt;/span&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td style="background-color:#eeeeee"&gt;&lt;span style="font-family:Georgia,serif"&gt;Phase 2: Editor implementation&lt;/span&gt;&lt;/td&gt;
&lt;td style="background-color:#eeeeee; text-align:center"&gt;&lt;span style="font-family:Georgia,serif"&gt;2016-10-20&lt;/span&gt;&lt;/td&gt;
&lt;td style="background-color:#eeeeee; text-align:center"&gt;&lt;span style="font-family:Georgia,serif"&gt;&lt;span
style="color:#19b159"&gt;✓&lt;/span&gt;&lt;/span&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;&lt;span style="font-family:Georgia,serif"&gt;Phase 3: Rollout to Production&lt;/span&gt;&lt;/td&gt;
&lt;td style="text-align:center"&gt;&lt;span style="font-family:Georgia,serif"&gt;2016-10-22&lt;/span&gt;&lt;/td&gt;
&lt;td style="text-align:center"&gt;&lt;span style="font-family:Georgia,serif"&gt;&lt;span style="color:#19b159"&gt;✓&lt;/span&gt;&lt;/span&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;

&lt;p style="text-align:justify"&gt;&lt;span style="font-family:Georgia,serif"&gt;The project that you participated in is of utmost importance to the future success of our platform. &amp;nbsp;We are very proud to share that&amp;nbsp;the&amp;nbsp;CKEditor implementation was a huge success and brought congratulations from both the key Stakeholders and the Customers:&lt;/span&gt;&lt;/p&gt;

&lt;blockquote&gt;
&lt;p style="text-align:center"&gt;This new editor has totally changed our content creation experience!&lt;/p&gt;

&lt;p style="text-align:center"&gt;&amp;mdash; John F. Smith, CEO, The New Web&lt;/p&gt;
&lt;/blockquote&gt;

&lt;p style="text-align:justify"&gt;&lt;span style="font-family:Georgia,serif"&gt;This letter recognizes that much of our success is directly attributable to your efforts.&amp;nbsp;You deserve to be proud of your achievement. May your future efforts be equally successful and rewarding.&lt;/span&gt;&lt;/p&gt;

&lt;p style="text-align:justify"&gt;&lt;span style="font-family:Georgia,serif"&gt;I am sure we will be seeing and hearing a great deal more about your accomplishments in the future. Keep up the good work!&lt;/span&gt;&lt;/p&gt;

&lt;p&gt;&amp;nbsp;&lt;/p&gt;

&lt;p&gt;&lt;span style="font-family:Georgia,serif"&gt;Best regards,&lt;/span&gt;&lt;/p&gt;

&lt;p&gt;&lt;span style="font-family:Georgia,serif"&gt;&lt;em&gt;The Management&lt;/em&gt;&lt;/span&gt;&lt;/p&gt;
&lt;h2 style="text-align: center;"&gt;The Flavorful Tuscany Meetup&lt;/h2&gt;
&lt;p style="text-align: center;"&gt;&lt;span style="color: #007ac9;"&gt;&lt;strong&gt;Welcome letter&lt;/strong&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;Dear Guest,&lt;/p&gt;
&lt;p&gt;We are delighted to welcome you to the annual &lt;em&gt;Flavorful Tuscany Meetup&lt;/em&gt; and hope you will enjoy the programme as well as your stay at the Bilancino Hotel.&lt;/p&gt;
&lt;p&gt;Please find below the full schedule of the event.&lt;/p&gt;
&lt;table class="schedule" cellpadding="15" cellspacing="0" style="border-collapse:collapse;width:100%;"&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th colspan="2" scope="col" style="background-color: #F2F9FF; text-align: center; font-size: 21px;"&gt;&lt;span&gt;Saturday, July 14&lt;/span&gt;&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td style="white-space:nowrap;"&gt;&lt;span&gt;9:30 AM - 11:30 AM&lt;/span&gt;&lt;/td&gt;
&lt;td&gt;&lt;span&gt;Americano vs. Brewed - “know your coffee” session with &lt;strong&gt;Stefano Garau&lt;/strong&gt;&lt;/span&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td style="white-space:nowrap;"&gt;&lt;span&gt;1:00 PM - 3:00 PM&lt;/span&gt;&lt;/td&gt;
&lt;td&gt;&lt;span&gt;Pappardelle al pomodoro - live cooking session with &lt;strong&gt;Rita Fresco&lt;/strong&gt;&lt;/span&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td style="white-space:nowrap;"&gt;&lt;span&gt;5:00 PM - 8:00 PM&lt;/span&gt;&lt;/td&gt;
&lt;td&gt;&lt;span&gt;Tuscan vineyards at a glance - wine-tasting session with &lt;strong&gt;Frederico Riscoli&lt;/strong&gt;&lt;/span&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;blockquote&gt;
&lt;p&gt;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!&lt;/p&gt;
&lt;p&gt;Angelina Calvino, food journalist&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;Please arrive at the Bilancino Hotel reception desk at least &lt;strong&gt;half an hour earlier&lt;/strong&gt; to make sure that the registration process goes as smoothly as possible.&lt;/p&gt;
&lt;p&gt;We look forward to welcoming you to the event.&lt;/p&gt;
&lt;p&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Victoria Valc&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Event Manager&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;Bilancino Hotel&lt;/strong&gt;&lt;/p&gt;
</textarea>
</div>
<script>
Expand Down Expand Up @@ -126,7 +110,7 @@ <h2><label for="editor1">Document Editor</label></h2>

// An array of stylesheets to style the WYSIWYG area.
// Note: it is recommended to keep your own styles in a separate file in order to make future updates painless.
contentsCss: [ 'https://cdn.ckeditor.com/4.6.1/full-all/contents.css', 'mystyles.css' ],
contentsCss: [ 'https://cdn.ckeditor.com/4.7.3/full-all/contents.css', 'mystyles.css' ],

// This is optional, but will let us define multiple different styles for multiple editors using the same CSS file.
bodyClass: 'document-editor',
Expand Down
35 changes: 32 additions & 3 deletions editors/document-editor/mystyles.css
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
@import url('https://fonts.googleapis.com/css?family=Nunito+Sans:200,200i,400,400i,600,600i,700,700i');

body.document-editor {
width: 15.8cm;
min-height: 21cm;
Expand All @@ -7,17 +9,44 @@ body.document-editor {
border-radius: 5px;
background: white;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
margin-top: 30px;
margin-bottom: 30px;
font-size: 16px;
line-height: 24px;
font-family: "Nunito Sans", Verdana, Helvatica, sans-serif;
}

body.document-editor, body.document-editor td, body.document-editor th {
body.document-editor td, body.document-editor th {
font-size: 0.9em;
}

body.document-editor h1 {
margin-bottom:1cm;
}

body.document-editor table {
margin-top:0.5cm;
margin-bottom:0.5cm;
}

body.document-editor h1 {
margin-bottom:1cm;
body.document-editor table td {
border-right: 1px solid #d0d0d0;
border-bottom: 1px solid #d0d0d0;
}

body.document-editor table td:first-of-type {
border-left: 1px solid #d0d0d0;
}

body.document-editor table tr:first-of-type td {
border-top: 1px solid #d0d0d0;
}

body.document-editor table thead th {
border-top: 1px solid #d0d0d0;
border-right: 1px solid #d0d0d0;
}

body.document-editor table thead th:first-of-type {
border-left: 1px solid #d0d0d0;
}

0 comments on commit 6b80958

Please sign in to comment.