b4 column hidden

[roojs1] / Roo / bootstrap / NavHeaderbar.js

diff --git a/Roo/bootstrap/NavHeaderbar.js b/Roo/bootstrap/NavHeaderbar.js
index 33d044e..052c107 100644 (file)
--- a/Roo/bootstrap/NavHeaderbar.js
+++ b/Roo/bootstrap/NavHeaderbar.js
@@ -2,7 +2,8 @@
  * - LGPL
  *
  * navbar
- * 
+ * navbar-fixed-top
+ * navbar-expand-md  fixed-top 
  */
 
 /**
@@ -43,7 +44,7 @@ Roo.extend(Roo.bootstrap.NavHeaderbar, Roo.bootstrap.NavSimplebar,  {
         
         var   cfg = {
             tag: this.nav || 'nav',
-            cls: 'navbar',
+            cls: 'navbar navbar-expand-md',
             role: 'navigation',
             cn: []
         };
@@ -55,49 +56,57 @@ Roo.extend(Roo.bootstrap.NavHeaderbar, Roo.bootstrap.NavSimplebar,  {
         }
         
         if(this.srButton){
-            cn.push({
-                tag: 'div',
-                cls: 'navbar-header',
+            var btn = {
+                tag: 'button',
+                type: 'button',
+                cls: 'navbar-toggle navbar-toggler',
+                'data-toggle': 'collapse',
                 cn: [
                     {
-                        tag: 'button',
-                        type: 'button',
-                        cls: 'navbar-toggle',
-                        'data-toggle': 'collapse',
-                        cn: [
-                            {
-                                tag: 'span',
-                                cls: 'sr-only',
-                                html: 'Toggle navigation'
-                            },
-                            {
-                                tag: 'span',
-                                cls: 'icon-bar'
-                            },
-                            {
-                                tag: 'span',
-                                cls: 'icon-bar'
-                            },
-                            {
-                                tag: 'span',
-                                cls: 'icon-bar'
-                            }
-                        ]
+                        tag: 'span',
+                        cls: 'sr-only',
+                        html: 'Toggle navigation'
+                    },
+                    {
+                        tag: 'span',
+                        cls: 'icon-bar navbar-toggler-icon'
+                    },
+                    {
+                        tag: 'span',
+                        cls: 'icon-bar'
+                    },
+                    {
+                        tag: 'span',
+                        cls: 'icon-bar'
                     }
                 ]
+            };
+            
+            cn.push( Roo.bootstrap.version == 4 ? btn : {
+                tag: 'div',
+                cls: 'navbar-header',
+                cn: [
+                    btn
+                ]
             });
         }
         
         cn.push({
             tag: 'div',
-            cls: 'collapse navbar-collapse',
+            cls: Roo.bootstrap.version == 4  ? 'nav flex-row roo-navbar-collapse collapse navbar-collapse' : 'collapse navbar-collapse roo-navbar-collapse',
             cn : []
         });
         
-        cfg.cls += this.inverse ? ' navbar-inverse' : ' navbar-default';
+        cfg.cls += this.inverse ? ' navbar-inverse navbar-dark bg-dark' : ' navbar-default';
+        
+        if (['light','white'].indexOf(this.weight) > -1) {
+           cfg.cls += ['light','white'].indexOf(this.weight) > -1 ? ' navbar-light' : ' navbar-dark';
+       }
+       cfg.cls += ' bg-' + this.weight;
+        
         
         if (['fixed-top','fixed-bottom','static-top'].indexOf(this.position)>-1) {
-            cfg.cls += ' navbar-' + this.position;
+            cfg.cls += ' navbar-' + this.position + ' ' + this.position ;
             
             // tag can override this..
             
@@ -105,7 +114,8 @@ Roo.extend(Roo.bootstrap.NavHeaderbar, Roo.bootstrap.NavSimplebar,  {
         }
         
         if (this.brand !== '') {
-            cn[0].cn.push({
+            var cp =  Roo.bootstrap.version == 4 ? cn : cn[0].cn;
+            cp.unshift({ // changed from push ?? BS4 needs it at the start? - does this break or exsiting?
                 tag: 'a',
                 href: this.brand_href ? this.brand_href : '#',
                 cls: 'navbar-brand',
@@ -126,13 +136,20 @@ Roo.extend(Roo.bootstrap.NavHeaderbar, Roo.bootstrap.NavSimplebar,  {
     },
     getHeaderChildContainer : function()
     {
-        if (this.el.select('.navbar-header').getCount()) {
+        if (this.srButton && this.el.select('.navbar-header').getCount()) {
             return this.el.select('.navbar-header',true).first();
         }
         
         return this.getChildContainer();
     },
     
+    getChildContainer : function()
+    {
+        
+       return this.el.select('.roo-navbar-collapse',true).first();
+        
+       
+    },
     
     initEvents : function()
     {