From 28be464785258699c26e17899d4e90f7e8ac97b2 Mon Sep 17 00:00:00 2001
From: Anton <info@ensostudio.ru>
Date: Tue, 30 Nov 2021 10:32:29 +0300
Subject: [PATCH] Update usage-widgets.md

---
 docs/guide-ru/usage-widgets.md | 42 ++++++++++++++++++++++++++++++++--
 1 file changed, 40 insertions(+), 2 deletions(-)

diff --git a/docs/guide-ru/usage-widgets.md b/docs/guide-ru/usage-widgets.md
index eb21a56..cfe1696 100644
--- a/docs/guide-ru/usage-widgets.md
+++ b/docs/guide-ru/usage-widgets.md
@@ -25,6 +25,11 @@
 - [[yii\bootstrap5\Toast|Toast]]
 - [[yii\bootstrap5\ToggleButtonGroup|ToggleButtonGroup]]
 
+## ActiveField: дополнительные поля <span id="additional-fields"></span>
+
+- [Диапазон](https://getbootstrap.com/docs/5.1/forms/range/): `$form->rangeInput(['min' => 0, 'max' => 100, 'step' => 1])`
+- [Выбор цвета](https://getbootstrap.com/docs/5.1/forms/form-control/#color): `$form->colorInput()`
+- [Переключатель](https://getbootstrap.com/docs/5.1/forms/checks-radios/#switches): `$form->checkbox(['switch' => true])`
 
 ## Настройка CSS классов виджетов <span id="customizing-css-classes"></span>
 
@@ -35,7 +40,7 @@
 ```php
 echo Button::widget([
     'label' => 'Action',
-    'options' => ['class' => 'btn-primary'], // создаст класс "btn btn-primary"
+    'options' => ['class' => 'btn-primary'], // устанавливает класс "btn btn-primary"
 ]);
 ```
 
@@ -44,7 +49,7 @@ echo Button::widget([
 ```php
 echo ButtonGroup::widget([
     'options' => [
-        'class' => ['widget' => 'btn-group-vertical'] // replaces 'btn-group' with 'btn-group-vertical'
+        'class' => ['widget' => 'btn-group-vertical'] // заменяет класс 'btn-group' на 'btn-group-vertical'
     ],
     'buttons' => [
         ['label' => 'A'],
@@ -52,3 +57,36 @@ echo ButtonGroup::widget([
     ]
 ]);
 ```
+
+## Виджет навигационной панели <span id="navbar-widget"></span>
+
+Виджет навигационной панели имеет свои особенности. Вы должны определить, точку останова (разрешение при котором панель отображается в свернутом виде)
+и основной стиль отображения (цветовая схема) для панели.
+
+Вы можете изменить цветовую схему и точку останова с помощью CSS классов. По умолчанию, используется цветовая схема 
+`navbar-light bg-light` и точка останова `navbar-expand-lg`. Для получения доп. информации, смотрите [документацию Bootstrap](https://getbootstrap.com/docs/5.1/components/navbar/):
+
+```php
+Navbar::begin([
+    'options' => [
+        'class' => ['navbar-dark', 'bg-dark', 'navbar-expand-md']
+    ]
+]);
+    [...]
+Navbar::end();
+``` 
+
+Если Вы хотите повернуть бренд (значок) и переключить положение кнопок в мобильной навигации, то можете сделать это следующим образом:
+
+```php
+Navbar::begin([
+	'brandOptions' => [
+		'class' => ['order-1']
+	],
+	'togglerOptions' => [
+		'class' => ['order-0']
+	]
+]);
+    [...]
+Navbar::end();
+```