ui improved and added logout funtionality

ashish-jajoria · ashish-jajoria · commit 46a08b2b87bd · 2018-11-12T15:42:36.000+05:30
diff --git a/Gemfile b/Gemfile
@@ -61,4 +61,6 @@ gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
 
 gem 'rolify'
 
-gem 'semantic-ui-sass'
+gem 'semantic-ui-sass'
+
+gem 'jquery-rails'
diff --git a/Gemfile.lock b/Gemfile.lock
@@ -104,6 +104,10 @@ GEM
     jbuilder (2.8.0)
       activesupport (>= 4.2.0)
       multi_json (>= 1.2)
+    jquery-rails (4.3.3)
+      rails-dom-testing (>= 1, < 3)
+      railties (>= 4.2.0)
+      thor (>= 0.14, < 2.0)
     listen (3.1.5)
       rb-fsevent (~> 0.9, >= 0.9.4)
       rb-inotify (~> 0.9, >= 0.9.7)
@@ -240,6 +244,7 @@ DEPENDENCIES
   cucumber-rails
   database_cleaner
   jbuilder (~> 2.5)
+  jquery-rails
   listen (>= 3.0.5, < 3.2)
   puma (~> 3.11)
   rails (~> 5.2.1)
diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
@@ -11,6 +11,7 @@
 // about supported directives.
 //
 //= require rails-ujs
+//= require jquery
 //= require activestorage
 //= require semantic-ui
 //= require turbolinks
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -7,10 +7,24 @@
 
     <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
     <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
+
+    <div class="ui fixed inverted menu">
+      <div class="ui container">
+        <a href="#" class="header item">
+          <img class="logo" src="https://pbs.twimg.com/profile_images/691206086955790336/CDMbA57p_400x400.png">
+          Rails JumpStart
+        </a>
+
+        <% if @current_user.present? %>
+          <a href="#" class="item">Home</a>
+          <%= link_to 'Logout', logout_path, method: :delete, class: 'right aligned item' %>
+        <% end %>
+      </div>
+    </div>
   </head>
 
   <body>
-    <div class="ui container">
+    <div class="ui container" style="margin-top: 55px">
       <%= yield %>
     </div>
   </body>
diff --git a/app/views/sessions/new.html.erb b/app/views/sessions/new.html.erb
@@ -1,14 +1,21 @@
-<h1>Log In</h1>
-<%= form_for :login do |f| %>
-  <div>
-    <%= f.label :email %>
-    <%= f.text_field :email, autofocus: true %>
+<div class="ui three column centered grid">
+  <div class="column">
+    <div class="ui stacked segment">
+      <h1>Log In</h1>
+      <%= form_for :login, html: {class: 'ui fluid form'} do |f| %>
+
+        <div class="field">
+          <%= f.label :email %>
+          <%= f.text_field :email, autofocus: true %>
+        </div>
+        <div class="field">
+          <%= f.label :password %>
+          <%= f.password_field :password %>
+        </div>
+        <div>
+          <%= f.submit "Log In", class: 'ui large teal submit button' %>
+        </div>
+    <% end %>
+    </div>
   </div>
-  <div>
-    <%= f.label :password %>
-    <%= f.password_field :password %>
-  </div>
-  <div>
-    <%= f.submit "Log In" %>
-  </div>
-<% end %>
+</div>
