Ticket #3767 - Add page lyout with 2:5:3 proportions in middle row.

install/sql/system.sql

@@ -5356,7 +5356,8 @@ INSERT INTO `sys_pages_layouts` (`id`, `name`, `icon`, `title`, `template`, `cel
 (17, 'topbottom_area_col1_col5', 'layout_topbottom_area_col1_col5.png', '_sys_layout_topbottom_area_col1_col5', 'layout_topbottom_area_col1_col5.html', 4),
 (18, '1_column_thin', 'layout_1_column_thin.png', '_sys_layout_1_column_thin', 'layout_1_column_thin.html', 1),
 (19, '1_column_half', 'layout_1_column_half.png', '_sys_layout_1_column_half', 'layout_1_column_half.html', 1),
-(20, '1_column_wiki', 'layout_1_column_wiki.png', '_sys_layout_1_column_wiki', 'layout_1_column_wiki.html', 1);
+(20, '1_column_wiki', 'layout_1_column_wiki.png', '_sys_layout_1_column_wiki', 'layout_1_column_wiki.html', 1),
+(21, 'topbottom_area_col2_col5_col3', 'layout_topbottom_area_col2_col5_col3.png', '_sys_layout_topbottom_area_col2_col5_col3', 'layout_topbottom_area_col2_col5_col3.html', 5);
 
 CREATE TABLE IF NOT EXISTS `sys_pages_design_boxes` (
   `id` int(11) NOT NULL,

modules/boonex/english/data/langs/system/en.xml

@@ -2727,6 +2727,7 @@ If it is not enabled then please consider implement this optimization, since it
 	<string name="_sys_layout_topbottom_area_bar_right"><![CDATA[Top&bottom areas with right bar in the middle]]></string>	
         <string name="_sys_layout_topbottom_area_col1_col3_col2"><![CDATA[Top&bottom areas with 3 columns (1:3:2) in the middle]]></string>
         <string name="_sys_layout_topbottom_area_col1_col5"><![CDATA[Top&bottom areas with 2 columns (1:5) in the middle]]></string>
+        <string name="_sys_layout_topbottom_area_col2_col5_col3"><![CDATA[Top&bottom areas with 3 columns (2:5:3) in the middle]]></string>
 	<string name="_sys_loading"><![CDATA[Loading...]]></string>
 	<string name="_sys_location_country"><![CDATA[<i class="sys-icon location-arrow"></i> {0}]]></string>
 	<string name="_sys_location_country_city"><![CDATA[<i class="sys-icon location-arrow"></i> {2}, {1}, {0}]]></string>

modules/boonex/russian/data/langs/system/ru.xml

@@ -2715,6 +2715,7 @@
 	<string name="_sys_layout_topbottom_area_bar_right"><![CDATA[Верхнее и нижнее пространства с правой линейкой посередине]]></string>
         <string name="_sys_layout_topbottom_area_col1_col3_col2"><![CDATA[Верхнее и нижнее пространства с 3 столбцами (1:3:2) посередине]]></string>
         <string name="_sys_layout_topbottom_area_col1_col5"><![CDATA[Верхнее и нижнее пространства с 2 столбцами (1:5) посередине]]></string>
+        <string name="_sys_layout_topbottom_area_col2_col5_col3"><![CDATA[Верхнее и нижнее пространства с 3 столбцами (2:5:3) посередине]]></string>
 	<string name="_sys_loading"><![CDATA[Загрузка...]]></string>
 	<string name="_sys_location_country"><![CDATA[<i class="sys-icon location-arrow"></i> {0}]]></string>
 	<string name="_sys_location_country_city"><![CDATA[<i class="sys-icon location-arrow"></i> {2}, {1}, {0}]]></string>

plugins_public/tailwind/js/tailwind.config.js

@@ -92,11 +92,20 @@ module.exports = {
     },
     extend: {
         width: {
-            46: '11.5rem',
-            50: '12.5rem',
-            112: '28rem',
-            128: '32rem',
-            144: '36rem'
+            '46': '11.5rem',
+            '50': '12.5rem',
+            '112': '28rem',
+            '128': '32rem',
+            '144': '36rem',
+            '1/10': '10%',
+            '2/10': '20%',
+            '3/10': '30%',
+            '4/10': '40%',
+            '5/10': '50%',
+            '6/10': '60%',
+            '7/10': '70%',
+            '8/10': '80%',
+            '9/10': '90%'
         },
         minWidth: {
             4: '1rem',

template/layout_topbottom_area_col2_col5_col3.html

@@ -0,0 +1,31 @@
+<!-- layout top & bottom areas with 3 columns (2:5:3) [ start ] -->
+<div id="__page_id__" class="bx-layout-wrapper bx-layout-topbottom-area-col2-col5-col3">
+    <bx_include_auto:_row_1_column.html />
+    <div class="bx-layout-row flex flex-col md:flex-row">
+        <div class="bx-layout-col bx-layout-col2-col5-col3-column1 bx-layout-column-thin max-w-full md:w-2/10">
+            <div class="bx-layout-cell md:pr-2 lg:pr-3" id="bx-layout-cell-2">
+                __cell_2__
+            </div>
+        </div>
+        <div class="bx-layout-col bx-layout-col2-col5-col3-column2 bx-layout-column-half max-w-full md:w-5/10">
+            <div class="bx-layout-cell md:px-2 lg:px-3" id="bx-layout-cell-3">
+                __cell_3__
+            </div>
+        </div>
+        <div class="bx-layout-col bx-layout-col2-col5-col3-column3 bx-layout-column-thin max-w-full md:w-3/10">
+            <div class="bx-layout-cell md:pl-2 lg:pl-3" id="bx-layout-cell-4">
+                __cell_4__
+            </div>
+        </div>
+    </div>
+    <div class="bx-layout-row bx-clearfix">
+        <div class="bx-layout-col bx-layout-1-column-column1 bx-layout-column-fullwidth">
+            <div class="bx-layout-cell" id="bx-layout-cell-5">
+                __cell_5__
+            </div>
+        </div>
+    </div>
+    <bx_include_auto:_row_1_column_dump.html />
+</div>
+<bx_include_auto:_layout_align_columns.html />
+<!-- layout top & bottom areas with 3 columns (2:5:3) [  end  ] -->