Sign in Ui improved in mobile

hover fix for sign_in btn

improved osem-navbar.css.scss

removed class black

app/assets/stylesheets/application.css

@@ -15,4 +15,5 @@
  *= require leaflet
  *= require bootstrap3-switch
  *= require osem-payments
+ *= require osem-navbar
 */

app/assets/stylesheets/osem-navbar.css.scss

@@ -0,0 +1,36 @@
+@import "breakpoints.css.scss";
+.nav-osem {
+    border: none;
+    @include breakpoint(xs) {
+        .navbar-collapse {
+            background-color: white;
+            border-bottom: 2px solid #efefef;
+        }
+        .navbar-nav > li > a {
+            color: black;
+        }
+        .navbar-collapse.in {
+            overflow: hidden;
+            max-height: none;
+        }
+        .navbar-toggle .icon-bar {
+            background-color: white;
+        }
+        .navbar-nav .open .dropdown-toggle:focus {
+            color: black;
+            background-color: #eeeeee;
+        }
+        input[type=text],
+        input[type=password] {
+            text-align: center;
+            padding: 5px;
+            display: block;
+            margin: auto;
+            width: 255px;
+        }
+    }
+    .dropdown-menu {
+        padding: 17px 17px 0px 17px;
+        min-width: 225px;
+    }
+}

app/views/layouts/_navigation.html.haml

@@ -1,4 +1,4 @@
-.navbar.navbar-default.navbar-fixed-top{:role=>"navigation"}
+.navbar.navbar-default.navbar-fixed-top.nav-osem{:role=>"navigation"}
   .container
     .navbar-header
       %button{"data-target"=>".navbar-collapse", "data-toggle"=>"collapse", :class=>"navbar-toggle", :type=>"button"}
@@ -58,7 +58,7 @@
               %span.fa.fa-user
               Sign In
               %span.caret
-            .dropdown-menu{:style => "padding: 17px; min-width: 225px;"}
+            .dropdown-menu
               - if ENV['OSEM_ICHAIN_ENABLED'] == 'true'
                 = form_tag User.ichain_login_url do
                   = text_field_tag 'username', nil, id: 'user_ichain_email_dd', placeholder: 'Username'