             """
               <div class="message-container"></div>
               <div class="row">
-                <div class="btn-group-sm col-lg-5">
-                  <button data-action="clear" class="btn btn-mini">#{glyph "remove"} Clear Console</button>
-                  <button data-action="enable" class="btn btn-mini" disabled="true">#{glyph "play"}</i> Enable Console</button>
-                  <button data-action="disable" class="btn btn-mini">#{glyph "pause"} Disable Console</button>
+                <div class="btn-group btn-group-sm col-md-4">
+                  #{button "clear", "remove", "Clear Console"}
+                  #{button "enable", "play", "Enable Console"}
+                  #{button "disable", "pause", "Disable Console"}
                 </div>
-                <div class="col-lg-6">
+                <div class="col-md-8">
                   <input class="form-control input-xlarge" size="40" placeholder="Filter console content">
                 </div>
               </div>

          dom.body.prepend floatingConsole

          messages = floatingConsole.findFirst ".message-container"

          floatingConsole.on "click", "[data-action=clear]", ->
            floatingConsole.hide()


            return false

          floatingConsole.on "change keyup", "input", ->
            updateFilter @value()

            for e in messages.children()
