From 124971aaaf71b67b20d87797be5c330377cc5a75 Mon Sep 17 00:00:00 2001
From: Synox <synox@users.noreply.github.com>
Date: Tue, 5 Jul 2016 08:30:12 +0200
Subject: [PATCH] optimized navbar for mobile

---
 src/app/navbar/navbar.html | 45 ++++++++++++++++++++++++++++----------
 1 file changed, 33 insertions(+), 12 deletions(-)

diff --git a/src/app/navbar/navbar.html b/src/app/navbar/navbar.html
index 8820674..ce420ed 100644
--- a/src/app/navbar/navbar.html
+++ b/src/app/navbar/navbar.html
@@ -1,20 +1,41 @@
 <div class="navbar" role="navigation">
     <div class="container">
-        <div class="navbar-header">
-            <a class="navbar-brand"><span class="octicon-inbox"></span> Mailbox</a>
+
+        <div class="hidden-xs">
+            <div class="navbar-header">
+                <a class="navbar-brand"><span class="octicon-inbox"></span> Mailbox</a>
+            </div>
+
+            <form class="navbar-form navbar-left">
+                <a class="btn btn-default" ng-click="$ctrl.gotoRandomAddress()" role="button">
+                    <span class="glyphicon glyphicon-random" aria-hidden="true"></span>
+                    create random
+                </a>
+            </form>
+
+
+            <form class="navbar-form navbar-left" role="search" ng-submit="$ctrl.gotoMailbox($ctrl.address)">
+                <input ng-model="$ctrl.address" type='text' class="form-control"/>
+                <button type="submit" class="btn btn-default">open</button>
+            </form>
         </div>
 
-        <form class="navbar-form navbar-left">
-            <a class="btn btn-default" ng-click="$ctrl.gotoRandomAddress()" role="button">
-                <span class="glyphicon glyphicon-random" aria-hidden="true"></span>
-                create random
-            </a>
-        </form>
 
-
-        <form class="navbar-form navbar-left" role="search" ng-submit="$ctrl.gotoMailbox($ctrl.address)">
-            <input ng-model="$ctrl.address" type='text' class="form-control"/>
-            <button type="submit" class="btn btn-default">open</button>
+        <form ng-submit="$ctrl.gotoMailbox($ctrl.address)">
+            <div class="form-inline visible-xs-block">
+                <div class="form-group col-xs-4">
+                    <span class="octicon-inbox"></span></a>
+                    <a class="btn btn-default" ng-click="$ctrl.gotoRandomAddress()" role="button">
+                        <span class="glyphicon glyphicon-random" aria-hidden="true"></span>
+                    </a>
+                </div>
+                <div class="form-group col-xs-6">
+                    <input ng-model="$ctrl.address" type='text' class="form-control"/>
+                </div>
+                <div class="form-group col-xs-2">
+                    <button type="submit" class="btn btn-default">open</button>
+                </div>
+            </div>
         </form>
     </div>
 </div>