Ticket #3796 - Show block submenu as tabs above the content if the block is shown without title.

template/css/common.css

@@ -266,6 +266,11 @@ blockquote {
     max-width: 65%;
 }
 
+.bx-dbc-notitle .bx-db-menu,
+.bx-media-phone .bx-dbc-notitle .bx-db-menu {
+    max-width: none;
+}
+
 .bx-db-menu-tab {
     margin-left: 5px;
     padding-top: 1px;

template/designbox_0.html

@@ -1,5 +1,8 @@
 <!-- Design Box 0 [start]: Content only -->
 <div class="bx-db-container bx-dbc-notitle bx-dbc-nopadding bx-dbc-nobg">
+    <bx_if:show_db_menu>
+        <div class="bx-db-header px-3 md:px-4 pt-2 md:pt-3 pb-4">__caption_item__</div>
+    </bx_if:show_db_menu>
     <div class="bx-db-content relative">__designbox_content__</div>
 </div>
 <!-- Design Box 0 [ end ] -->

template/designbox_10.html

@@ -1,5 +1,8 @@
 <!-- Design Box 10 [start]: Content only + padding -->
 <div class="bx-db-container bx-dbc-notitle bx-dbc-nobg">
+    <bx_if:show_db_menu>
+        <div class="bx-db-header px-3 md:px-4 pt-2 md:pt-3">__caption_item__</div>
+    </bx_if:show_db_menu>
     <div class="bx-db-content bx-content-padding-block relative">__designbox_content__</div>
 </div>
 <!-- Design Box 10 [ end ] -->

template/designbox_13.html

@@ -1,5 +1,8 @@
 <!-- Design Box 13 [start]: Content + background + padding -->
 <div class="bx-db-container bx-dbc-notitle bx-def-color-bg-block bx-def-border-block bx-def-border-radius-block">
+    <bx_if:show_db_menu>
+        <div class="bx-db-header px-3 md:px-4 pt-2 md:pt-3">__caption_item__</div>
+    </bx_if:show_db_menu>
     <div class="bx-db-content bx-content-padding-block relative">__designbox_content__</div>
 </div>
 <!-- Design Box 13 [ end ] -->

template/designbox_3.html

@@ -1,5 +1,8 @@
 <!-- Design Box 3 [start]: Content + background -->
 <div class="bx-db-container bx-dbc-notitle bx-dbc-nopadding bx-def-color-bg-block bx-def-border-block bx-def-border-radius-block">
+    <bx_if:show_db_menu>
+        <div class="bx-db-header px-3 md:px-4 pt-2 md:pt-3 pb-4">__caption_item__</div>
+    </bx_if:show_db_menu>
     <div class="bx-db-content relative">__designbox_content__</div>
 </div>
 <!-- Design Box 3 [ end ] -->

template/scripts/BxBaseFunctions.php

@@ -383,16 +383,32 @@ class BxBaseFunctions extends BxDolFactory implements iBxDolSingleton
      * @see BX_DB_PADDING_DEF
      * @see BX_DB_PADDING_NO_CAPTION
      */
-    function designBoxContent ($sTitle, $sContent, $iTemplateNum = BX_DB_DEF, $mixedMenu = false, $mixedButtons = array())
-    {
-        return $this->_oTemplate->parseHtmlByName('designbox_' . (int)$iTemplateNum . '.html', array(
-            'title' => $sTitle,
-            'designbox_content' => $sContent,
-            'caption_item' => $this->designBoxMenu($mixedMenu, $mixedButtons),
-        ));
+    function designBoxContent ($sTitle, $sContent, $iTemplateNum = BX_DB_DEF, $mixedMenu = false, $mixedButtons = [])
+    {
+        $bNoTitle = in_array($iTemplateNum, [BX_DB_CONTENT_ONLY, BX_DB_PADDING_CONTENT_ONLY, BX_DB_NO_CAPTION, BX_DB_PADDING_NO_CAPTION]);
+        $sMenu = $this->designBoxMenu($mixedMenu, $mixedButtons);
+
+        $aTmplVarsDbMenu = [];
+        if($bNoTitle && $sMenu)
+            $aTmplVarsDbMenu = [
+                'caption_item' => $sMenu
+            ];
+
+        return $this->_oTemplate->parseHtmlByName('designbox_' . (int)$iTemplateNum . '.html', array_merge([
+                'title' => $sTitle,
+                'designbox_content' => $sContent,
+            ], ($bNoTitle ? [
+                'bx_if:show_db_menu' => [
+                    'condition' => !empty($aTmplVarsDbMenu),
+                    'content' => $aTmplVarsDbMenu
+                ]
+            ] : [
+                'caption_item' => $sMenu
+            ]))
+        );
     }
 
-    function designBoxMenu ($mixedMenu, $mixedButtons = array())
+    function designBoxMenu ($mixedMenu, $mixedButtons = [])
     {
         $bUseTabs = is_bool($mixedButtons) && $mixedButtons === true;