Example navigation bar using Bootstrap.NavBar and Bootstrap.Buttons

I'm currently having some trouble creating a responsive navbar using Bootstrap.NavBar and Bootstrap.Buttons - please could you generate an example navbar using the above?

[rowpsmo1859]

Thanks for filing this issue!

I have a basic menu working but am still developing out the responsive hamburger portion of bootstraps navbar. The html is setting correctly but I think elm is interfering with the bootstrap javascript.

I have an idea for making this work using just elm but need to prototype it.

[rowpsmo1859]

I haven't made much movement on this since commenting.

Below is the code I have. The responsive part of bootstrap isn't working yet. This feature should be built into elm-bootstrapify. My hypothesis is that the virtual dom is conflicting with the bootstrap javascript. This needs to be tested thoroughly. I'm hoping this is due to human error on my part!

module ResponsiveNavbar exposing (..)

import Bootstrap.Grid exposing (..)
import Bootstrap.Navbar exposing (..)

import Html exposing (a, text, li, span, button)
import Html.Attributes exposing (id, class, attribute)
import Html exposing (..)
import Html.Attributes exposing (..)
import String

navbarHamburger target =
  let
    attributes =  [ attribute "data-toggle" "collapse", class "navbar-toggle", attribute "data-target" target ]
  in
    button attributes
     [
      span [ class "icon-bar" ] [],
      span [ class "icon-bar" ] [],
      span [ class "icon-bar" ] []
     ]


main =
  body []
   [
    navbar DefaultNavbar []
     [
      containerFluid
       [
        navbarHeader []
         [
          navbarHamburger "#collapseMe",
          navbarBrand []
           [
            text "Brand goes here"
           ]
         ],
        navbarCollapse [ id "collapseMe" ]
         [
          navbarList NavbarNav NavbarDefault []
           [
            li []
             [
              a []
               [
                text "One"
               ]
              ],
             li []
              [
               a []
              [
               text "Two"
              ]
             ],
            li []
             [
              a []
               [
                text "Three"
               ]
             ]
           ],
          navbarList NavbarNav NavbarRight []
           [
            li []
             [
              a []
               [
                text "One"
               ]
             ],
            li []
             [
              a []
               [
                text "Two"
               ]
             ]
           ]
         ]
       ]
     ],
    containerFluid
     [
      row
       [
        column [ ExtraSmall Twelve, Small Twelve, Medium Twelve, Large Twelve ]
         [
          text "hello world"
         ]
       ]
     ]
   ]