diff --git a/docs/guides/configuration.md b/docs/guides/configuration.md index f782c3a..bc8a6f1 100644 --- a/docs/guides/configuration.md +++ b/docs/guides/configuration.md @@ -6,19 +6,19 @@ description: You can learn about the configuration in the documentation of the D # Configuration -You can configure RichText appearance and functionality via the corresponding API. The available parameters will allow you to: +You can configure the appearance and functionality of RichText through its API. The available parameters let you: -- Show/hide **menubar** using the [`menubar`](api/config/menubar.md) property -- Configure **toolbar** using the [`toolbar`](api/config/toolbar.md) property -- Enable the **fullscreen mode** using the [`fullscreenMode`](api/config/fullscreen-mode.md) property -- Toggle the **layout** between "classic" and "document" modes using the [`layoutMode`](api/config/layout-mode.md) property -- Specify **initial value** using the [`value`](api/config/value.md) property -- Specify **initial locale** using the [`locale`](api/config/locale.md) property -- Apply **initial styles** using the [`defaultStyles`](api/config/default-styles.md) property +- Show or hide the **menubar** with the [`menubar`](api/config/menubar.md) property +- Configure the **toolbar** with the [`toolbar`](api/config/toolbar.md) property +- Enable **fullscreen mode** with the [`fullscreenMode`](api/config/fullscreen-mode.md) property +- Toggle the **layout** between "classic" and "document" modes with the [`layoutMode`](api/config/layout-mode.md) property +- Set the **initial value** with the [`value`](api/config/value.md) property +- Set the **initial locale** with the [`locale`](api/config/locale.md) property +- Apply **initial styles** with the [`defaultStyles`](api/config/default-styles.md) property ## Layout modes -There are two layout modes of RichText editor between which you can select to get the best working place for creating your perfect content: +The RichText editor provides two layout modes: - **"classic"** @@ -32,7 +32,7 @@ There are two layout modes of RichText editor between which you can select to ge ![Document mode](./../assets/richtext/document_mode.png) -To specify the desired mode, you need to define it in the [`layoutMode`](api/config/layout-mode.md) property of the RichText configuration object during initialization of the component: +To set the mode, define the [`layoutMode`](api/config/layout-mode.md) property of the RichText configuration object when initializing the component: ~~~jsx const editor = new richtext.Richtext("#root", { @@ -42,7 +42,7 @@ const editor = new richtext.Richtext("#root", { ## Toolbar -The RichText toolbar consists of several blocks of controls that can be changed according to your needs. +The RichText toolbar consists of several blocks of controls that you can customize. ### Default toolbar controls diff --git a/docs/guides/initialization.md b/docs/guides/initialization.md index a43bf9e..e84d7c4 100644 --- a/docs/guides/initialization.md +++ b/docs/guides/initialization.md @@ -6,7 +6,7 @@ description: You can learn about the initialization in the documentation of the # Initialization -This guide will give you detailed instructions on how to create RichText on a page to enrich your application with features of the RichText editor. Take the following steps to get a ready-to-use component: +To add the RichText editor to a page, follow these steps: 1. [Include the RichText source files on a page](#including-source-files). 2. [Create a container for RichText](#creating-container). @@ -16,12 +16,12 @@ This guide will give you detailed instructions on how to create RichText on a pa [Download the package](https://dhtmlx.com/docs/products/dhtmlxRichText/download.shtml) and unpack it into a folder of your project. -To create RichText, you need to include 2 source files on your page: +To create RichText, include two source files on your page: - *richtext.js* - *richtext.css* -Make sure that you set correct relative paths to the source files: +Use correct relative paths to the source files: ~~~html title="index.html" @@ -53,11 +53,11 @@ const editor = new richtext.Richtext("#root", { ### Configuration properties :::note -The full list of properties to configure **RichText** can be found [**here**](api/overview/properties_overview.md). +See the [full list of **RichText** properties](api/overview/properties_overview.md). ::: ## Example -In this snippet you can see how to initialize **RichText** with the initial data: +The snippet below shows how to initialize **RichText** with initial data: diff --git a/docs/guides/localization.md b/docs/guides/localization.md index f29e8cd..3fcf091 100644 --- a/docs/guides/localization.md +++ b/docs/guides/localization.md @@ -6,11 +6,11 @@ description: You can learn about the localization in the documentation of the DH # Localization -You can localize all labels in the interface of JavaScript RichText. For this you need to create a new locale or modify a built-in one and apply it to RichText. +You can localize all labels of the JavaScript RichText interface. To do that, create a new locale or modify a built-in one and apply it to RichText. ## Default locale -The **English** locale is used by default: +RichText uses the **English** locale by default: ~~~jsx const en = { @@ -158,7 +158,7 @@ const en = { ~~~ :::info -Besides the default ***en*** locale (*English*), RichText also includes the built-in ***de*** (*German*) and ***cn*** (*Chinese*) ones. +Besides the default ***en*** (*English*) locale, RichText includes the built-in ***de*** (*German*) and ***cn*** (*Chinese*) locales. :::
@@ -461,14 +461,14 @@ const cn = { ## Custom locale -To apply a custom locale you need to: +To apply a custom locale: -- create a custom locale (or modify the default one) and provide translations for all text labels (it can be any language you need) +- create a custom locale (or modify the default one) and provide translations for all text labels -- apply the new locale to **RichText** via its [`locale`](api/config/locale.md) property or use the [`setLocale()`](api/methods/set-locale.md) method +- apply the new locale to **RichText** through the [`locale`](api/config/locale.md) property or the [`setLocale()`](api/methods/set-locale.md) method ## Example -In this snippet you can see how to switch through several locales: +The snippet below shows how to switch between locales: diff --git a/docs/guides/stylization.md b/docs/guides/stylization.md index e14c464..b8e6b7c 100644 --- a/docs/guides/stylization.md +++ b/docs/guides/stylization.md @@ -6,9 +6,9 @@ description: You can learn about the styling in the documentation of the DHTMLX # Styling -You can fully customize the appearance of DHTMLX RichText by overriding CSS variables and applying custom styles to specific parts of the widget. +You can customize the appearance of DHTMLX RichText by overriding CSS variables and applying custom styles to specific parts of the widget. -This guide shows how to apply a **dark theme** and use available class names to style the editor’s menubar, toolbar, popup, and content area. +This guide shows how to apply a **dark theme** and use the built-in class names to style the editor’s menubar, toolbar, popup, and content area. ## Default structure and class names @@ -18,7 +18,7 @@ RichText uses the following core classes to structure its UI: |------------------------|---------------------------------------------| | `.wx-richtext` | Root container of the RichText widget | | `.wx-richtext-menubar` | Container for menubar | -| `.wx-richtext-menu` | Container for menubar dropdown menu | +| `.wx-richtext-menu` | Container for menubar dropdown menu | | `.wx-richtext-toolbar` | Container for toolbar | | `.wx-editor-area` | Container for main editable content area | @@ -56,7 +56,7 @@ You can override RichText's default styles by redefining CSS variables on the `# ``` :::note -These styles will apply a dark background, adjust button and icon colors, and improve visibility for dark UI themes. +These styles apply a dark background and adjust button, icon, and text colors for dark UI themes. ::: ## List of supported CSS variables @@ -82,7 +82,7 @@ These styles will apply a dark background, adjust button and icon colors, and im ## Live demo -In this snippet you can see how to apply a custom style to RichText: +The snippet below shows how to apply a custom style to RichText: diff --git a/docs/guides/typescript_support.md b/docs/guides/typescript_support.md index ad247d8..196c527 100644 --- a/docs/guides/typescript_support.md +++ b/docs/guides/typescript_support.md @@ -6,16 +6,12 @@ description: You can learn about using typescript with the DHTMLX JavaScript Ric # TypeScript support -Starting from v2.0, the library of DHTMLX RichText provides an ability to use TypeScript definitions. The built-in support of TypeScript works out of the box. +Starting from v2.0, the DHTMLX RichText library ships with built-in TypeScript definitions. :::note -You can try out the functionality right in our Snippet Tool. +You can try it out in our Snippet Tool. ::: ## Advantages of using TypeScript -Why do you need to use DHTMLX RichText with TypeScript? - -The main benefit of TypeScript is that it allows you to significantly increase the efficiency of the development process. - -The way of building an application becomes more robust as checking the types together with autocompletion allow you to avoid potential mistakes. Besides, TypeScript provides you with information about types of data you should use while working with the API of the DHTMLX RichText library. +TypeScript helps you write more reliable code and speeds up development. Type checking and autocompletion catch potential mistakes during development, and the type definitions document the data shapes expected by the DHTMLX RichText API.