-
Notifications
You must be signed in to change notification settings - Fork 67
/
index.html
151 lines (149 loc) · 4.69 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>AI Assistant editor</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="demo.css" />
<link rel="stylesheet" href="content.css" />
</head>
<body>
<div class="header-wrapper">
<h1>AI Assistant editor</h1>
</div>
<div class="editor-wrapper">
<div id="cke5-ai-assistant-demo">
<h3>Improve writing </h3>
<p>
<span style="color: hsl(263, 59%, 52%)">
Select the following paragraph, click
<img
class="image_resized"
style="aspect-ratio: 150/150; width: 25px"
src="https://ckeditor.com/docs/ckeditor5/latest/assets/icons/e9ab8d1d1d.svg"
alt="AI Commands"
width="25"
height="25"
/>
icon in the toolbar and ask AI Assistant to:
<strong>Improve writing</strong>
</span>
</p>
<p>
Building software that survives the exam of time is a real tough
making to do. Being in the same with AI can give both new and
clever solution. Using AI Assistant, you can make your writing better,
and your software is strong and thinks about the future. It's a
trip that welcomes the always-changing tech world, working hard to be
the best in each piece of code.
</p>
<h3>Write your own custom prompts </h3>
<p>
<span style="color: hsl(263, 59%, 52%)">
Select the following table, click
<img
class="image_resized"
style="aspect-ratio: 150/150; width: 25px"
src="https://ckeditor.com/docs/ckeditor5/latest/assets/icons/23bac2bad7.svg"
alt="AI Assistant"
width="25"
height="25"
/>
and try the prompt:
<strong
>Turn this table into a list with the name of items
bolded.</strong
>
</span>
<strong> </strong>
</p>
<figure class="table" style="width: 94.35%">
<table
class="ck-table-resized"
style="border-color: hsl(0, 0%, 30%); border-style: solid"
>
<colgroup>
<col style="width: 16.05%" />
<col style="width: 83.95%" />
</colgroup>
<tbody>
<tr>
<td style="background-color: hsl(0, 0%, 96%)">Customisable</td>
<td>
The ideal tool should adapt to the team's needs, ensuring a
seamless integration into existing processes.
</td>
</tr>
<tr>
<td style="background-color: hsl(0, 0%, 96%)">
Intuitive
</td>
<td>
It's crucial to choose a tool with a familiar user interface
to minimise the learning curve and ensure user adoption.
</td>
</tr>
<tr>
<td style="background-color: hsl(0, 0%, 96%)">
Reliable
</td>
<td>
A robust tool should handle complex tasks, even when multiple
users are involved. This requires a solid software foundation
and rigorous testing to ensure stability and reliability.
</td>
</tr>
</tbody>
</table>
</figure>
<p>
<span style="color: hsl(263, 59%, 52%)">
You can generate without selections too! Click
<img
class="image_resized"
style="aspect-ratio: 150/150; width: 25px"
src="https://ckeditor.com/docs/ckeditor5/latest/assets/icons/23bac2bad7.svg"
alt="AI Assistant"
width="25"
height="25"
/>
and try the prompt:
<strong
>What are the most important things to consider when choosing a
collaborative writing tool</strong
>
</span>
</p>
<h3>Quick translations 🌐</h3>
<p>
<span style="color: hsl(263, 59%, 52%)">
Select the following text in French, click
<img
class="image_resized"
style="aspect-ratio: 150/150; width: 25px"
src="https://ckeditor.com/docs/ckeditor5/latest/assets/icons/e9ab8d1d1d.svg"
alt="AI Commands"
width="25"
height="25"
/>
icon, scroll and select
<strong>Translate to English.</strong>
</span>
</p>
<p>
<i>
Avant l'ère numérique, la collaboration était souvent fastidieuse,
impliquant de longues chaînes d'e-mails et des révisions manuelles.
Les outils modernes ont révolutionné ce processus, permettant une
édition en temps réel, des commentaires et une communication
simplifiée. Avec la demande croissante de contenu à l'ère numérique
d'aujourd'hui, les outils d'écriture collaborative sont devenus
indispensables.
</i>
</p>
</div>
</div>
<script src="https://cdn.ckbox.io/CKBox/2.4.0/ckbox.js"></script>
<script type="module" src="index.js"></script>
</body>
</html>