docs: fix typos in the documentation

MIGRATION.md

@@ -24,9 +24,9 @@ To facilitate a smooth transition, guidance is provided for the following scenar
 #### <a id="no-custom-configuration"></a>No custom configuration:
 
 If you don't have custom plugin configuration, you only need to update the existing fields to use
-the new default HTML preset to avoid missing preset error. There are two options how to solve it:
+the new default HTML preset to avoid missing preset error. There are two options to solve it:
 
-- **Option1 (Preferable)**: Update the fields in the Content-Type Builder or modify your shemas
+- **Option1 (Preferable)**: Update the fields in the Content-Type Builder or modify your schemas
   manually to use `defaultHtml` preset instead of `default`:
 
 ```js
@@ -77,7 +77,7 @@ directly.
 To transition to the new configuration method, copy and paste your configuration from the existing
 configuration file into `/src/admin/app.js|tsx`:
 
-(Alternatively you can move you configuration file to `/src/admin/`, export the configuration,
+(Alternatively you can move your configuration file to `/src/admin/`, export the configuration,
 and then import it in `admin.js|tsx`)
 
 **Before (v4):**

README.md

@@ -60,15 +60,15 @@ for setup instructions.
 
 ## <a id="usage"></a>✍️ Usage
 
-The field can be fould in the Content-Type Builder under the `CUSTOM` tab:
+The field can be found in the Content-Type Builder under the `CUSTOM` tab:
 
 <p align="center">
   <img src="https://raw.githubusercontent.com/nshenderov/strapi-plugin-ckeditor/master/assets/v5-usage-guide-2.png" width="700" />
 </p>
 
 **Presets**
 
-A preset is a set of settings that define the editor's features and appearence. You
+A preset is a set of settings that define the editor's features and appearance. You
 can specify a dedicated preset for each field. The available presets can be customized through the
 [configuration](#configuration).
 
@@ -187,19 +187,19 @@ following properties:
 ```ts
 /**
  * The `common` styles are applied first, followed by `light` or `dark` styles
- * according to the preferences, and finally `additional` styles.
+ * according to user preferences, and finally `additional` styles.
  */
 type Theme = {
   /**
    * Core styles.
    */
   common?: EditorStyles;
   /**
-   * Styles apllied in light mode.
+   * Styles applied in light mode.
    */
   light?: EditorStyles;
   /**
-   * Styles apllied in dark mode.
+   * Styles applied in dark mode.
    */
   dark?: EditorStyles;
   /**
@@ -322,11 +322,11 @@ export type Theme = {
    */
   common?: EditorStyles;
   /**
-   * Styles apllied in light mode.
+   * Styles applied in light mode.
    */
   light?: EditorStyles;
   /**
-   * Styles apllied in dark mode.
+   * Styles applied in dark mode.
    */
   dark?: EditorStyles;
   /**
@@ -558,7 +558,7 @@ const defaultHtml: Preset = {
 const defaultMarkdown: Preset = {
   ...defaultMarkdownPreset,
   description: 'Modified default Markdown editor',
-  styles: `
+  styles: css`
     .ck {
       --ck-editor-max-width: 1500px;
       --ck-editor-min-height: 700px;

admin/src/config/types.ts

@@ -73,19 +73,19 @@ export type UserPluginConfig = {
  * @remarks
  *
  * The `common` styles are applied first, followed by `light` or `dark` styles
- * according to the preferences, and finally `additional` styles.
+ * according to user preferences, and finally `additional` styles.
  */
 export type Theme = {
   /**
    * Core styles.
    */
   common?: EditorStyles;
   /**
-   * Styles apllied in light mode.
+   * Styles applied in light mode.
    */
   light?: EditorStyles;
   /**
-   * Styles apllied in dark mode.
+   * Styles applied in dark mode.
    */
   dark?: EditorStyles;
   /**