Password & token split up, icon to button for top panel

Dmitriy Zaporozhets
1 parent eb25bfe2
Showing 13 changed files with 108 additions and 92 deletions Show diff stats
app/assets/stylesheets/ui_basic.scss
app/assets/stylesheets/ui_mars.scss
app/controllers/profile_controller.rb
app/views/keys/_show.html.haml
app/views/keys/index.html.haml
app/views/layouts/_head_panel.html.haml
app/views/layouts/profile.html.haml
app/views/notes/_form.html.haml
app/views/profile/password.html.haml
app/views/profile/token.html.haml
app/views/projects/index.html.haml
config/routes.rb
spec/requests/profile_spec.rb
@@ -81,20 +81,6 @@
       }
     }
  
-    .top_panel_ico { 
-      width: 16px;
-      height: 16px;
-      padding: 5px;
-      margin-right:10px;
-      float:right;
-      background: #EEE;
-      @include border-radius(5px);
-      border: 1px solid #DDD;
-      img { 
-        vertical-align:top;
-      }
-    }
-
     .project_name {
       float:left;
       width:360px;
@@ -107,6 +93,14 @@
       text-shadow: 0 1px 1px #FFF;
     }
  
+    .fbtn { 
+      float: right;
+      margin-right:10px;
+      .btn { 
+        margin-left:8px;
+      }
+    }
+
     .search { 
       float: right;
       margin-right: 55px;
@@ -117,6 +111,8 @@
         background-repeat: no-repeat;
         background-position: 10px;
         padding-left:25px;
+        @include border-radius(5px);
+        border:1px solid #ccc;
       }
     }
   }
@@ -24,6 +24,29 @@
     z-index:10;
     height:60px;
  
+    .fbtn { 
+      float: right;
+      margin-right:10px;
+      .btn { 
+        margin-left:8px;
+        background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #595D63), to(#31363E));
+        background-image: -webkit-linear-gradient(#595D63 6.6%, #31363E);
+        background-image: -moz-linear-gradient(#595D63 6.6%, #31363E);
+        background-image: -o-linear-gradient(#595D63 6.6%, #31363E);
+        font-size: 12px;
+        &:hover { 
+          background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #595D63), to(#2C2F35));
+          background-image: -webkit-linear-gradient(#595D63 6.6%, #2C2F35);
+          background-image: -moz-linear-gradient(#595D63 6.6%, #202227);
+          background-image: -o-linear-gradient(#595D63 6.6%, #202227);
+          background-position:0 0;
+        }
+
+        border: 1px solid #31363E;
+        color:#D6DADF;
+        text-shadow: 0 -1px 0 #000000;
+      }
+    }
     .search { 
       float: right;
       margin-right: 55px;
@@ -61,16 +84,14 @@
         float:left;
  
         h1 { 
-          background: url('logo_mars.png') no-repeat -3px -4px;
+          background: url('images.png') no-repeat -3px -6px;
+          width: 65px;
+          height: 26px;
+          margin: 6px 0;
+          padding: 0;
+          float: left;
+          text-indent: -1000em;
           float:left;
-          margin-left:5px;
-          font-size:20px;
-          line-height:36px;
-          font-weight:normal;
-          color:#a1a8ae;
-          text-shadow: 0 1px 1px #111;
-          padding-left:50px;
-          padding-top:5px;
         }
       }
     }
@@ -93,14 +114,6 @@
         padding:15px 0;
       }
     }
-
-    .top_panel_ico { 
-      width: 16px;
-      height: 16px;
-      padding: 5px;
-      margin-right:10px;
-      float:right;
-    }
   }
   /*
    *  End of Application Header
@@ -14,6 +14,10 @@ class ProfileController &lt; ApplicationController
     redirect_to :back
   end
  
+  def token
+    @user = current_user
+  end
+
   def password
     @user = current_user
   end
@@ -32,6 +36,6 @@ class ProfileController &lt; ApplicationController
  
   def reset_private_token
     current_user.reset_authentication_token!
-    redirect_to profile_password_path
+    redirect_to profile_token_path
   end
 end
@@ -4,7 +4,7 @@
       %p
         %strong= key.title
   %td
-    %span.right.cgray
+    %span.cgray
       Added
       = time_ago_in_words(key.created_at)
       ago
@@ -4,6 +4,11 @@
  
 %br
  
-%table#keys-table.table
+%table#keys-table.admin-table
+  %thead
+    %tr
+      %th Name
+      %th Added
+      %th
   - @keys.each do |key|
     = render(:partial => 'show', :locals => {:key => key})
@@ -11,12 +11,15 @@
       .search
         = form_tag search_path, :method => :get do |f|
           = text_field_tag "search", nil, :placeholder => "Search", :class => "search-input"
-      - if current_user.can_create_project?
-        = link_to new_project_path, :class => "top_panel_ico", :title => "Create New Project" do 
-          = image_tag "new_project.png", :width => 16
-      - if current_user.is_admin?
-        = link_to admin_root_path, :class => "top_panel_ico", :title => "Admin area" do 
-          = image_tag "admin.PNG", :width => 16
+      .fbtn
+        - if current_user.is_admin?
+          = link_to admin_root_path, :class => "btn small", :title => "Admin area" do 
+            %i.icon-cog
+            Admin
+        - if current_user.can_create_project?
+          = link_to new_project_path, :class => "btn small", :title => "Create New Project" do 
+            %i.icon-plus
+            Project
       .account-box
         = link_to profile_path, :class => "pic" do
           = image_tag gravatar_icon(current_user.email)
@@ -7,7 +7,8 @@
     .container
       %nav.main_menu
         = link_to "Profile", profile_path, :class => "home #{current_page?(:controller => "profile", :action => :show) ? "current" : nil}"
-        = link_to "Password & token", profile_password_path,  :class => current_page?(:controller => "profile", :action => :password) ? "current" : nil
+        = link_to "Password", profile_password_path,  :class => current_page?(:controller => "profile", :action => :password) ? "current" : nil
+        = link_to "Token", profile_token_path,  :class => current_page?(:controller => "profile", :action => :token) ? "current" : nil
         = link_to "Design", profile_design_path, :class => current_page?(:controller => "profile", :action => :design) ? "current" : nil
         = link_to keys_path,  :class => controller.controller_name == "keys" ? "current" : nil do
           SSH Keys
@@ -10,7 +10,7 @@
   = f.text_area :note,  :size => 255
   %p.hint Markdown is enabled.
  
-  .row
+  .row.note_advanced_opts
     .span4
       %h5 Notify via email:
       .clearfix
-.row
-  .span6
-    .thumbnail
-      .caption
-        %h3 Password
-        %hr
-        = form_for @user, :url => profile_password_path, :method => :put do |f|
-          .data
-            .alert.alert-info
-              %p After successful password update you will be redirected to login page where you should login with new password
-            -if @user.errors.any?
-              .alert-message.block-message.error
-                %ul
-                  - @user.errors.full_messages.each do |msg|
-                    %li= msg
-
-            .clearfix
-              = f.label :password
-              .input= f.password_field :password
-            .clearfix
-              = f.label :password_confirmation
-              .input= f.password_field :password_confirmation
-          %hr
-            = f.submit 'Save', :class => "btn"
-
-  .span6.right
-    .thumbnail
-      .caption
-        %h3 
-          Private token
-          %span.cred.right
-            keep it in secret!
-        %hr
-        = form_for @user, :url => profile_reset_private_token_path, :method => :put do |f|
-          .data
-            .alert.alert-info
-              %p Private token used to access application resources without authentication.
-              %hr
-              %p * required for rss feed
-            %p.cgray
-              - if current_user.private_token
-                = text_field_tag "token", current_user.private_token
-              - else
-                You don`t have one yet. Click generate to fix it.
-          %hr
-            - if current_user.private_token
-              = f.submit 'Reset', :confirm => "Are you sure?", :class => "btn"
-            - else
-              = f.submit 'Generate', :class => "btn"
+%h3 Password
+%hr
+= form_for @user, :url => profile_password_path, :method => :put do |f|
+  .data
+    .alert.alert-info
+      %span After successful password update you will be redirected to login page where you should login with new password
+    -if @user.errors.any?
+      .alert-message.block-message.error
+        %ul
+          - @user.errors.full_messages.each do |msg|
+            %li= msg
  
+    .clearfix
+      = f.label :password
+      .input= f.password_field :password
+    .clearfix
+      = f.label :password_confirmation
+      .input= f.password_field :password_confirmation
+  .actions
+    = f.submit 'Save', :class => "btn primary"
@@ -0,0 +1,22 @@
+%h3 
+  Private token
+  %span.cred.right
+    keep it in secret!
+%hr
+= form_for @user, :url => profile_reset_private_token_path, :method => :put do |f|
+  .data
+    .alert.alert-info
+      %p Private token used to access application resources without authentication.
+      %p * required for rss feed
+    %p.cgray
+      - if current_user.private_token
+        = text_field_tag "token", current_user.private_token
+      - else
+        You don`t have one yet. Click generate to fix it.
+  .actions
+    - if current_user.private_token
+      = f.submit 'Reset', :confirm => "Are you sure?", :class => "btn"
+    - else
+      = f.submit 'Generate', :class => "btn primary"
+
+
@@ -23,6 +23,7 @@
           - if current_user.can_create_project?
             %span.right
               = link_to new_project_path, :class => "btn very_small info" do 
+                %i.icon-plus
                 New Project
         - @projects.each do |project|
           = link_to project_path(project), :class => dom_class(project) do
@@ -35,6 +35,7 @@ Gitlab::Application.routes.draw do
   get "errors/githost"
   get "profile/password", :to => "profile#password"
   put "profile/password", :to => "profile#password_update"
+  get "profile/token", :to => "profile#token"
   put "profile/reset_private_token", :to => "profile#reset_private_token"
   get "profile", :to => "profile#show"
   get "profile/design", :to => "profile#design"
@@ -30,7 +30,7 @@ describe &quot;Profile&quot; do
  
   describe "Reset private token" do
     before do
-      visit profile_password_path
+      visit profile_token_path
     end
  
     it "should reset private token" do
...	...	@@ -81,20 +81,6 @@
81	81	}
82	82	}
83	83
84		- .top_panel_ico {
85		- width: 16px;
86		- height: 16px;
87		- padding: 5px;
88		- margin-right:10px;
89		- float:right;
90		- background: #EEE;
91		- @include border-radius(5px);
92		- border: 1px solid #DDD;
93		- img {
94		- vertical-align:top;
95		- }
96		- }
97		-
98	84	.project_name {
99	85	float:left;
100	86	width:360px;
...	...	@@ -107,6 +93,14 @@
107	93	text-shadow: 0 1px 1px #FFF;
108	94	}
109	95
	96	+ .fbtn {
	97	+ float: right;
	98	+ margin-right:10px;
	99	+ .btn {
	100	+ margin-left:8px;
	101	+ }
	102	+ }
	103	+
110	104	.search {
111	105	float: right;
112	106	margin-right: 55px;
...	...	@@ -117,6 +111,8 @@
117	111	background-repeat: no-repeat;
118	112	background-position: 10px;
119	113	padding-left:25px;
	114	+ @include border-radius(5px);
	115	+ border:1px solid #ccc;
120	116	}
121	117	}
122	118	}
...	...
...	...	@@ -24,6 +24,29 @@
24	24	z-index:10;
25	25	height:60px;
26	26
	27	+ .fbtn {
	28	+ float: right;
	29	+ margin-right:10px;
	30	+ .btn {
	31	+ margin-left:8px;
	32	+ background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #595D63), to(#31363E));
	33	+ background-image: -webkit-linear-gradient(#595D63 6.6%, #31363E);
	34	+ background-image: -moz-linear-gradient(#595D63 6.6%, #31363E);
	35	+ background-image: -o-linear-gradient(#595D63 6.6%, #31363E);
	36	+ font-size: 12px;
	37	+ &:hover {
	38	+ background-image: -webkit-gradient(linear, 0 0, 0 30, color-stop(0.066, #595D63), to(#2C2F35));
	39	+ background-image: -webkit-linear-gradient(#595D63 6.6%, #2C2F35);
	40	+ background-image: -moz-linear-gradient(#595D63 6.6%, #202227);
	41	+ background-image: -o-linear-gradient(#595D63 6.6%, #202227);
	42	+ background-position:0 0;
	43	+ }
	44	+
	45	+ border: 1px solid #31363E;
	46	+ color:#D6DADF;
	47	+ text-shadow: 0 -1px 0 #000000;
	48	+ }
	49	+ }
27	50	.search {
28	51	float: right;
29	52	margin-right: 55px;
...	...	@@ -61,16 +84,14 @@
61	84	float:left;
62	85
63	86	h1 {
64		- background: url('logo_mars.png') no-repeat -3px -4px;
	87	+ background: url('images.png') no-repeat -3px -6px;
	88	+ width: 65px;
	89	+ height: 26px;
	90	+ margin: 6px 0;
	91	+ padding: 0;
	92	+ float: left;
	93	+ text-indent: -1000em;
65	94	float:left;
66		- margin-left:5px;
67		- font-size:20px;
68		- line-height:36px;
69		- font-weight:normal;
70		- color:#a1a8ae;
71		- text-shadow: 0 1px 1px #111;
72		- padding-left:50px;
73		- padding-top:5px;
74	95	}
75	96	}
76	97	}
...	...	@@ -93,14 +114,6 @@
93	114	padding:15px 0;
94	115	}
95	116	}
96		-
97		- .top_panel_ico {
98		- width: 16px;
99		- height: 16px;
100		- padding: 5px;
101		- margin-right:10px;
102		- float:right;
103		- }
104	117	}
105	118	/*
106	119	* End of Application Header
...	...
...	...	@@ -14,6 +14,10 @@ class ProfileController < ApplicationController
14	14	redirect_to :back
15	15	end
16	16
	17	+ def token
	18	+ @user = current_user
	19	+ end
	20	+
17	21	def password
18	22	@user = current_user
19	23	end
...	...	@@ -32,6 +36,6 @@ class ProfileController < ApplicationController
32	36
33	37	def reset_private_token
34	38	current_user.reset_authentication_token!
35		- redirect_to profile_password_path
	39	+ redirect_to profile_token_path
36	40	end
37	41	end
...	...
...	...	@@ -4,7 +4,7 @@
4	4	%p
5	5	%strong= key.title
6	6	%td
7		- %span.right.cgray
	7	+ %span.cgray
8	8	Added
9	9	= time_ago_in_words(key.created_at)
10	10	ago
...	...
...	...	@@ -4,6 +4,11 @@
4	4
5	5	%br
6	6
7		-%table#keys-table.table
	7	+%table#keys-table.admin-table
	8	+ %thead
	9	+ %tr
	10	+ %th Name
	11	+ %th Added
	12	+ %th
8	13	- @keys.each do \|key\|
9	14	= render(:partial => 'show', :locals => {:key => key})
...	...
...	...	@@ -11,12 +11,15 @@
11	11	.search
12	12	= form_tag search_path, :method => :get do \|f\|
13	13	= text_field_tag "search", nil, :placeholder => "Search", :class => "search-input"
14		- - if current_user.can_create_project?
15		- = link_to new_project_path, :class => "top_panel_ico", :title => "Create New Project" do
16		- = image_tag "new_project.png", :width => 16
17		- - if current_user.is_admin?
18		- = link_to admin_root_path, :class => "top_panel_ico", :title => "Admin area" do
19		- = image_tag "admin.PNG", :width => 16
	14	+ .fbtn
	15	+ - if current_user.is_admin?
	16	+ = link_to admin_root_path, :class => "btn small", :title => "Admin area" do
	17	+ %i.icon-cog
	18	+ Admin
	19	+ - if current_user.can_create_project?
	20	+ = link_to new_project_path, :class => "btn small", :title => "Create New Project" do
	21	+ %i.icon-plus
	22	+ Project
20	23	.account-box
21	24	= link_to profile_path, :class => "pic" do
22	25	= image_tag gravatar_icon(current_user.email)
...	...
...	...	@@ -7,7 +7,8 @@
7	7	.container
8	8	%nav.main_menu
9	9	= link_to "Profile", profile_path, :class => "home #{current_page?(:controller => "profile", :action => :show) ? "current" : nil}"
10		- = link_to "Password & token", profile_password_path, :class => current_page?(:controller => "profile", :action => :password) ? "current" : nil
	10	+ = link_to "Password", profile_password_path, :class => current_page?(:controller => "profile", :action => :password) ? "current" : nil
	11	+ = link_to "Token", profile_token_path, :class => current_page?(:controller => "profile", :action => :token) ? "current" : nil
11	12	= link_to "Design", profile_design_path, :class => current_page?(:controller => "profile", :action => :design) ? "current" : nil
12	13	= link_to keys_path, :class => controller.controller_name == "keys" ? "current" : nil do
13	14	SSH Keys
...	...
...	...	@@ -10,7 +10,7 @@
10	10	= f.text_area :note, :size => 255
11	11	%p.hint Markdown is enabled.
12	12
13		- .row
	13	+ .row.note_advanced_opts
14	14	.span4
15	15	%h5 Notify via email:
16	16	.clearfix
...	...
1		-.row
2		- .span6
3		- .thumbnail
4		- .caption
5		- %h3 Password
6		- %hr
7		- = form_for @user, :url => profile_password_path, :method => :put do \|f\|
8		- .data
9		- .alert.alert-info
10		- %p After successful password update you will be redirected to login page where you should login with new password
11		- -if @user.errors.any?
12		- .alert-message.block-message.error
13		- %ul
14		- - @user.errors.full_messages.each do \|msg\|
15		- %li= msg
16		-
17		- .clearfix
18		- = f.label :password
19		- .input= f.password_field :password
20		- .clearfix
21		- = f.label :password_confirmation
22		- .input= f.password_field :password_confirmation
23		- %hr
24		- = f.submit 'Save', :class => "btn"
25		-
26		- .span6.right
27		- .thumbnail
28		- .caption
29		- %h3
30		- Private token
31		- %span.cred.right
32		- keep it in secret!
33		- %hr
34		- = form_for @user, :url => profile_reset_private_token_path, :method => :put do \|f\|
35		- .data
36		- .alert.alert-info
37		- %p Private token used to access application resources without authentication.
38		- %hr
39		- %p * required for rss feed
40		- %p.cgray
41		- - if current_user.private_token
42		- = text_field_tag "token", current_user.private_token
43		- - else
44		- You don`t have one yet. Click generate to fix it.
45		- %hr
46		- - if current_user.private_token
47		- = f.submit 'Reset', :confirm => "Are you sure?", :class => "btn"
48		- - else
49		- = f.submit 'Generate', :class => "btn"
	1	+%h3 Password
	2	+%hr
	3	+= form_for @user, :url => profile_password_path, :method => :put do \|f\|
	4	+ .data
	5	+ .alert.alert-info
	6	+ %span After successful password update you will be redirected to login page where you should login with new password
	7	+ -if @user.errors.any?
	8	+ .alert-message.block-message.error
	9	+ %ul
	10	+ - @user.errors.full_messages.each do \|msg\|
	11	+ %li= msg
50	12
	13	+ .clearfix
	14	+ = f.label :password
	15	+ .input= f.password_field :password
	16	+ .clearfix
	17	+ = f.label :password_confirmation
	18	+ .input= f.password_field :password_confirmation
	19	+ .actions
	20	+ = f.submit 'Save', :class => "btn primary"
...	...
...	...	@@ -0,0 +1,22 @@
	1	+%h3
	2	+ Private token
	3	+ %span.cred.right
	4	+ keep it in secret!
	5	+%hr
	6	+= form_for @user, :url => profile_reset_private_token_path, :method => :put do \|f\|
	7	+ .data
	8	+ .alert.alert-info
	9	+ %p Private token used to access application resources without authentication.
	10	+ %p * required for rss feed
	11	+ %p.cgray
	12	+ - if current_user.private_token
	13	+ = text_field_tag "token", current_user.private_token
	14	+ - else
	15	+ You don`t have one yet. Click generate to fix it.
	16	+ .actions
	17	+ - if current_user.private_token
	18	+ = f.submit 'Reset', :confirm => "Are you sure?", :class => "btn"
	19	+ - else
	20	+ = f.submit 'Generate', :class => "btn primary"
	21	+
	22	+
...	...