Webasyst Framework v.2.9.0

Site app v.2.6.0
UI app v.2.9.0

Author: Leonix

wa-apps/installer/lib/config/app.php

@@ -4,7 +4,7 @@
     'description' => 'Install new apps from the Webasyst Store',
     'icon'        => 'img/installer.svg',
     'mobile'      => false,
-    'version'     => '2.9.0', // developer preview
+    'version'     => '2.9.0',
     'critical'    => '2.9.0',
     'system'      => true,
     'vendor'      => 'webasyst',

wa-apps/site/lib/config/app.php

@@ -5,7 +5,7 @@
     'icon'       => 'img/site512.png',
     'sash_color' => '#49a2e0',
     'frontend'   => true,
-    'version'    => '2.6.0', // developer preview
+    'version'    => '2.6.0',
     'critical'   => '2.6.0',
     'vendor'     => 'webasyst',
     'system'     => true,

wa-apps/ui/lib/config/app.php

@@ -5,4 +5,4 @@
     'version' => '2.9.0',
     'vendor'  => 'Webasyst',
     'ui'      => '1.3,2.0',
-);
+);

wa-apps/ui/templates/actions/component/autocomplete.html

@@ -15,7 +15,7 @@
 <div class="u-component-page">
     <h1 class="u-page-title">{$_title|escape}</h1>
 
-    <blockquote class="small">Для работы компонента требуется подключение <code>wa-content/js/jquery-wa/<b>wa.js</b></code> — файла, в котором релизованы все базовые JS-компоненты Webasyst 2.</blockquote>
+    <blockquote class="small">Для работы компонента требуется подключение <code>wa-content/js/jquery-wa/<b>wa.js</b></code> — файла, в котором реализованы все базовые JS-компоненты Webasyst 2.</blockquote>
 
     <p>В основе компонента лежит jQuery UI Autocomplete.</p>
 

wa-apps/ui/templates/actions/component/badge.html

@@ -25,13 +25,13 @@
 {/function}
 
 {function name="_user"}
-<span class="badge user">Cтатус</span>
-<span class="badge user blue">Cтатус</span>
-<span class="badge user green">Cтатус</span>
-<span class="badge user yellow">Cтатус</span>
-<span class="badge user orange">Cтатус</span>
-<span class="badge user purple"><i class="fas fa-globe"></i>Cтатус</span>
-<span class="badge user button-light-gray"><b>Cтатус</b> <i class="fas fa-chevron-right fa-xs custom-ml-4"></i></span>
+<span class="badge user">Статус</span>
+<span class="badge user blue">Статус</span>
+<span class="badge user green">Статус</span>
+<span class="badge user yellow">Статус</span>
+<span class="badge user orange">Статус</span>
+<span class="badge user purple"><i class="fas fa-globe"></i>Статус</span>
+<span class="badge user button-light-gray"><b>Статус</b> <i class="fas fa-chevron-right fa-xs custom-ml-4"></i></span>
 {/function}
 
 {function name="_squared"}
@@ -45,7 +45,7 @@
 <div class="u-component-page">
     <h1 class="u-page-title">{$_title|escape}</h1>
     <p>Выделение небольших элементов (счетчиков, числовых показателей, иконок, символов) на цветом фоне. По умолчанию — на красном фоне.</p>
-    <p>Размер шрифта и общая геометрия основываются на размере шрифта родительного элемента (1em) и могут быть скоррентированы с помощью классов <a href="{$wa_app_url}component/misc/">.smallest — .largest</a>.</p>
+    <p>Размер шрифта и общая геометрия основываются на размере шрифта родительного элемента (1em) и могут быть скорректированы с помощью классов <a href="{$wa_app_url}component/misc/">.smallest — .largest</a>.</p>
 
     <div class="line">
         {_render}

wa-apps/ui/templates/actions/component/banner.html

@@ -24,7 +24,7 @@ <h1 class="u-page-title">{$_title|escape}</h1>
 
     <p class="banner-additional-hint">Баннер выводится над областью приложения (под <a href="{$wa_app_url}component/waheader/">wa_header</a>) и имеет абсолютное позиционирование (position: fixed).</p>
 
-    <p class="banner-additional-hint">Вывести баннер без абсолютного позицирования среди других компонентов (position: static) легко — с помощью дополнительного класса <code>.banner<strong>.static</strong></code>. Однако в этом случае вам следует самостоятельно разместить его в шаблоне (в интерфейсе) в подходящем месте.</p>
+    <p class="banner-additional-hint">Вывести баннер без абсолютного позиционирования среди других компонентов (position: static) легко — с помощью дополнительного класса <code>.banner<strong>.static</strong></code>. Однако в этом случае вам следует самостоятельно разместить его в шаблоне (в интерфейсе) в подходящем месте.</p>
 
     <p class="banner-additional-hint">Раскраска баннера — на ваше усмотрение. По умолчанию — красная (для показа сообщений о критических ошибках).</p>
 

wa-apps/ui/templates/actions/component/box.html

@@ -45,7 +45,7 @@ <h1 class="u-page-title">{$_title|escape}</h1>
     <p>Компонент <code>.box</code> — простейший контейнер с отступами для визуально гармоничного размещения произвольного контента в интерфейсе бекенда Webasyst.</p>
     <p>Отступы выверены в соответствии с другим компонентами библиотеки wa-2.0.css (меню, заголовками, кнопками и т. д.). Когда рядом с такими навигационными компонентами нужно разметить какой-то нестандартный элемент интерфейса, например, просто какой-то текст, кнопку, чекбокс, класс <code>.box</code> поможет добавить отступы правильно и в рамках визуальной «сетки» бекенда Webasyst.</p>
 
-    <p>Оборачивать базовые навигионные компоненты (например, <code>.menu</code>) в <code>.box</code> не нужно. Использовать <code>.box</code> нужно только для произвольного кастомного контента.</p>
+    <p>Оборачивать базовые навигационные компоненты (например, <code>.menu</code>) в <code>.box</code> не нужно. Использовать <code>.box</code> нужно только для произвольного кастомного контента.</p>
 
     <h3><code>.box</code></h3>
     <p><code>&lt;div class="box"&gt;...&lt;/div&gt;</code> — и готово. В простейшем виде <code>.box</code> идеально подходит для небольших блоков с некоторым кастомным контентом.</p>

wa-apps/ui/templates/actions/component/button.html

@@ -337,7 +337,7 @@ <h3>button<code>.circle</code></h3>
     </div>
 
     <h3><code>.danger</code>, <code>.warning</code>, <code>.success</code></h3>
-    <p>Если вы привыкли к семнатике <a href="{$wa_app_url}component/alert/">.alert</a>, то цвет кнопки можно также задать с помощью классов <code>.danger</code> (то же, что и .red), <code>.warning</code> (то же, что и .yellow), <code>.success</code> (то же, что и .success):</p>
+    <p>Если вы привыкли к семантике <a href="{$wa_app_url}component/alert/">.alert</a>, то цвет кнопки можно также задать с помощью классов <code>.danger</code> (то же, что и .red), <code>.warning</code> (то же, что и .yellow), <code>.success</code> (то же, что и .success):</p>
     <div class="line">
         {_render_dws}
     </div>
@@ -364,7 +364,7 @@ <h3>Общие рекомендации</h3>
         <li>Желтый <code>.yellow</code>: любое достаточно важное действие, требующие внимания пользователя — отложенный старт рассылки, перемещение файлов между хранилищами, отправка важной формы с данными. Или если просто это визуально подходит к остальной части интерфейса.</li>
         <li>Оранжевый <code>.orange</code>: любое важное и потенциально опасное действие, но которое при желании можно откатить обратно. Используйте в случаях, если действие опасное, но красный цвет выглядит слишком агрессивно.</li>
         <li>Красный <code>.red</code>: только для действий перманентного изменения/удаления данных, которое нельзя откатить обратно. Один лишь вид кнопки вселяет чувство опасности и забирает на себя все внимание пользователя, поэтому показывать такие красные кнопки нужно только в случае действительно «неотвратимой опасности».</li>
-        <li>Серые <code>.gray</code> и <code>.dark-gray</code>: для скучных и нейтральных действий или действий, подразумевющих некоторое убывание и уменьшение значения. Например, для отключения какого-то режима работы или функции.</li>
+        <li>Серые <code>.gray</code> и <code>.dark-gray</code>: для скучных и нейтральных действий или действий, подразумевающих некоторое убывание и уменьшение значения. Например, для отключения какого-то режима работы или функции.</li>
         <li>Другие цвета, включая чисто черный и белый, — на усмотрение автора приложения.</li>
     </ul>
 

wa-apps/ui/templates/actions/component/cheatsheet.html

@@ -1,3 +1,6 @@
+{$_title = "Шпаргалка"}
+{$wa->title($_title)}
+
 <h1>Шпаргалка <code>1.3</code> &rarr; <code>2.0</code></h1>
 
 <p>Краткий список того, с чем почти наверняка столкнется разработчик приложения Webasyst при проверке своего приложения в новом окружении <code>wa-2.0.css</code>:</p>
@@ -6,7 +9,7 @@ <h1>Шпаргалка <code>1.3</code> &rarr; <code>2.0</code></h1>
     <li>Скорее всего, «поползет» общий лейаут. Это из-за перехода <code>#wa-app</code>, <code>.sidebar</code> и <code>.content</code> на <code>display: flex;</code>. Попробуйте для начала поставить на проблемный блок (контейнер) <code>display: block;</code>. А затем переводите <code><a href="{$wa_app_url}component/sidebar/">.sidebar / .content</a></code> в своем приложении на режим flexbox.</li>
     <li><code>.menu-v</code> надо заменить на <code><a href="{$wa_app_url}component/menu/">.menu</a></code>.</li>
     <li><code>.menu-h</code> надо заменить на <code><a href="{$wa_app_url}component/chips/">.chips</a></code>.</li>
-    <li>Иконки <code>.icon16</code> нужно заменить на <a href="{$wa_app_url}component/icon/">векторные иконки-глифы</a> Font Awesome либо на свои — с классом <code>.icon</code>. Старые спрайты более не поддерживаются.</li>
+    <li>Иконки <code>.icon10</code> и <code>.icon16</code> нужно заменить на <a href="{$wa_app_url}component/icon/">векторные иконки-глифы</a> Font Awesome либо на свои — с классом <code>.icon</code>. Старые спрайты более не поддерживаются.</li>
     <li><code>.userpic20</code> нужно заменить на <code><a href="{$wa_app_url}component/userpic/">.userpic</a></code>.</li>
     <li>Класса <code>.block</code> больше нет, так как все отступы заложены в основных элементах оформления и контента (внутри разных меню и т. д.), чтобы не возникало недопонимание, какие отступы где нужно делать. Теперь их и не надо делать — они уже есть в каждом компоненте! Если все же нужно создать блок с произвольным контентом, используйте <code>.box</code>. Для общего блока <code>.content</code> — либо <code><a href="{$wa_app_url}component/article/">.article</a></code>, либо <code><a href="{$wa_app_url}component/box/">.box.contentbox</a></code>.</li>
     <li><code>.left200px</code> и <code>.left300px</code> у сайдбара нужно заменить на <code>.width-XX</code> согласно <a href="{$wa_app_url}component/sidebar/">документации</a>.</li>
@@ -18,6 +21,13 @@ <h1>Шпаргалка <code>1.3</code> &rarr; <code>2.0</code></h1>
     <li><code>.indicator</code> переименован в <code>.badge</code>.</li>
     <li><code>.profile</code> больше нет. Используйте <code><a href="{$wa_app_url}component/flexbox/">.flexbox</a></code> или <code><a href="{$wa_app_url}component/list/">.list</a></code>.</li>
     <li>Спиннер загрузки <code>.icon16.loading</code> больше не поддерживается ни в каком виде. Для индикатора процесса загрузки контента используйте <code><a href="{$wa_app_url}component/skeleton/">.skeleton</a></code> (рекомендуется), <code><a href="{$wa_app_url}component/loading/">.waLoading()</a></code> или <code><a href="{$wa_app_url}component/spinner/">.spinner</a></code>.</li>
-    <li>Подключать <code>wa-content/js/jquery-wa/wa.core.js</code>, <code>wa-content/js/jquery-wa/wa.dialog.js</code>, <code>wa-content/js/dialog/dialog.js</code> больше не нужно.<br> Для работы всех JS-компонентов дизайн-системы Websyst 2 подключайте один единственный файл — <code>wa-content/js/jquery-wa/wa.js</code>.</li>
+    <li>Подключать <code>wa-content/js/jquery-wa/wa.core.js</code>, <code>wa-content/js/jquery-wa/wa.dialog.js</code>, <code>wa-content/js/dialog/dialog.js</code> больше не нужно.<br> Для работы всех JS-компонентов дизайн-системы Webasyst 2 подключайте один единственный файл — <code>wa-content/js/jquery-wa/wa.js</code>.</li>
+    <li>Использование старого класса <code>.errormsg</code> нужно заменить на новые <code>.state-error</code> или <code>.state-caution</code> <a href="{$wa_app_url}component/misc/">в зависимости от ситуации</a>.</li>
+    <li>Классы <code>.float-left</code> и <code>.float-right</code> больше не работают — вместо них нужно использовать другую верстку, например, с применением класса <code><a href="{$wa_app_url}component/flexbox/">.flexbox</a></code>.</li>
+    <li>Если в JavaScript-коде продукта используются вызовы <code>.waDialog()</code>, придется переписать их с учетом <a href="{$wa_app_url}component/dialog/">новых требований</a> и обновить HTML-верстку диалогов.</li>
     <li><em>Список будет пополняться.</em></li>
 </ol>
+
+<script>
+    $.wa_ui.title.set({$_title|json_encode});
+</script>

wa-apps/ui/templates/actions/component/dialog.html

@@ -248,7 +248,7 @@
     <h1 class="u-page-title">{$_title|escape}</h1>
     <h2><code>.dialog</code></h2>
 
-    <blockquote class="small">Для работы <code>.waDialog()</code> требуется подключение <code>wa-content/js/jquery-wa/<b>wa.js</b></code> — файла, в котором релизованы все базовые JS-компоненты Webasyst 2. Подключать <code>wa-content/js/dialog/wa.dialog.js</code> для диалога более не нужно — это устаревший код, который будет удален.</blockquote>
+    <blockquote class="small">Для работы <code>.waDialog()</code> требуется подключение <code>wa-content/js/jquery-wa/<b>wa.js</b></code> — файла, в котором реализованы все базовые JS-компоненты Webasyst 2. Подключать <code>wa-content/js/dialog/wa.dialog.js</code> для диалога более не нужно — это устаревший код, который будет удален.</blockquote>
 
     <p>Классический вариант модального диалога, забирающего на себя все внимание пользователя. Временно блокирует весь интерфейс и занимает центральное место на экране.</p>
     <p>Рекомендуется использовать для выполнения какого-то достаточно важного и относительно короткого действия, не допускающего отвлечения пользователя. Например, для подтверждения какой-то ответственной операции.</p>
@@ -386,7 +386,7 @@ <h3>.dialog <code>взаимодействие</code></h3>
         <p>Типовая ситуация:</p>
         <ul>
             <li>У вас на странице есть список каких-то элементов.</li>
-            <li>Каждый элемент можно отредактрировать/удалить в диалоге.</li>
+            <li>Каждый элемент можно отредактировать/удалить в диалоге.</li>
             <li>Вы написали обработчик клика по элементу, который показывает диалог.</li>
             <li>В диалоге есть 3 кнопки: «изменить», «удалить» и «отмена».</li>
         </ul>