From c817622984994a6a68a73104be8c21937b58e5fc Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Wed, 24 Sep 2014 17:15:39 -0400 Subject: [PATCH 1/6] for heroku --- app/assets/javascripts/src/Metamaps.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/javascripts/src/Metamaps.js b/app/assets/javascripts/src/Metamaps.js index ef09e128..c112917d 100644 --- a/app/assets/javascripts/src/Metamaps.js +++ b/app/assets/javascripts/src/Metamaps.js @@ -1498,7 +1498,7 @@ Metamaps.Realtime = { }); $('body').click(self.close); - self.socket = io.connect('http://localhost:5001'); + self.socket = io.connect('http://gentle-savannah-1303.herokuapp.com'); self.startActiveMap(); }, toggleBox: function (event) { From 6f62d59b66d457af0beaec549694e5911118c4bd Mon Sep 17 00:00:00 2001 From: BasharJabbour Date: Thu, 25 Sep 2014 12:25:46 -0400 Subject: [PATCH 2/6] Sign In, Sign Up, Edit User pages have been changed. Edit User page needs lots of work still. --- app/assets/stylesheets/application.css | 179 +++++++++++++++++++-- app/views/users/edit.html.erb | 19 ++- app/views/users/passwords/new.html.erb | 4 +- app/views/users/registrations/new.html.erb | 14 +- app/views/users/sessions/new.html.erb | 21 ++- diff.txt | 130 +++++++++++++++ 6 files changed, 326 insertions(+), 41 deletions(-) create mode 100644 diff.txt diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index bb0edb60..accf32c0 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -74,9 +74,40 @@ body, /* forgot password fix */ .forgotPassword input[type="submit"] { - padding: 0 5px; - width: auto; + width: 300px; + color: #f5f5f5; + font-family: din-regular; } + +.new_user input[type="submit"] { + width: 96px; + padding: 0px; + font-family: din-regular; + text-transform: uppercase; + color: #f5f5f5; + margin-top:16px; + float: right; +} + +.login input[type="submit"]{ + width:84px; + margin-top: 16px; + margin-left: 61px; + margin-right: 35px; + font-family: din-regular; + text-transform: uppercase; +} + +.edit_user input[type="submit"]{ + width: 96px; + padding: 0px; + font-family: din-regular; + text-transform: uppercase; + color: #f5f5f5; + margin-top:16px; + float: right; +} + html { } @@ -181,6 +212,7 @@ input[type="submit"]:active { .new_session, .new_user, .edit_user, +.login, .forgotPassword { display: block; width: 300px; @@ -189,36 +221,132 @@ input[type="submit"]:active { border-radius: 5px; color: black; box-shadow: 6px 6px 8px rgba(0, 0, 0, 0.4); + position:absolute; top: 50%; left:50%; - position:absolute; - margin-left: -166px; } + +.login{ + width: 322px; + height: 308px; + box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.23), 0px 3px 3px rgba(0, 0, 0, 0.16); + margin-left:-166px; + margin-top:-158px; + padding-left: 35px; + font-family: din-medium; + font-size: 18px; + color: #424242; +} + +.login input[type="checkbox"] { + border: 1px #424242; + top: 250px; + float: left; +} + +.new_user{ + height: 412px; + margin-left:-166px; + box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.23), 0px 3px 3px rgba(0, 0, 0, 0.16); + font-family: din-medium; + font-size: 18px; + line-height: 18px; + text-transform: uppercase; + color:#424242; + margin-top: -222px; +} + +.edit_user { + width: 300px; + height:531px; + top: 136px; + margin-left: -166px; + box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.23), 0px 3px 3px rgba(0, 0, 0, 0.16); + text-transform: uppercase; + font-size: 18px; + line-height: 18px; + font-family: din-medium; + color:#424242; +} + .forgotPassword { height: 134px; + font-family: din-medium; + color:#424242; + text-transform: uppercase; + box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.23), 0px 3px 3px rgba(0, 0, 0, 0.16); + font-size: 18px; + margin-left: -166px; margin-top: -83px; } + +.firstFieldText{ + font-family: din-regular; + font-size: 14px; + color:#424242; + padding-top:24px; + padding-bottom: 6px; + text-transform: none; + margin: 0px; + line-height: 14px +} +.fieldText { + font-family: din-regular; + font-size: 14px; + color:#424242; + padding-top:16px; + padding-bottom: 6px; + text-transform: none; + margin: 0px; + line-height: 14px; +} + +.smallText{ + font: din-regular; + font-size: 12px; + line-height: 12px; + color: #c04f4f; + margin-top: 16px; +} + +.forgotPasswordText { + font-family: din-medium; + font-size: 12px; + color:#757575; + margin-left: 35px; +} + +.name { + font-size: 24px; + text-align: center; + font-family: din-meduim; + color:#424242; + margin-top: 24px; + text-transform: none; +} + .centerGreyForm input[type="text"], .centerGreyForm input[type="email"], .centerGreyForm input[type="password"] { - width: 250px; + width: 300px; height: 32px; - font-size: 15px; + font-size: 14px; direction: ltr; -webkit-appearance: none; appearance: none; display: inline-block; - margin: 0; - padding: 0 8px; + margin: 0px 0px; + padding: 10px 0px 0px 9px; background: #fff; + color: #bdbdbd; border: 1px solid #d9d9d9; border-top: 1px solid #c0c0c0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; - -webkit-border-radius: 1px; - -moz-border-radius: 1px; - border-radius: 1px; + -webkit-border-radius: 2px; + -moz-border-radius: 2px; + border-radius: 2px; font: -webkit-small-control; color: initial; letter-spacing: normal; @@ -227,8 +355,28 @@ input[type="submit"]:active { text-indent: 0px; text-shadow: none; display: inline-block; - text-align: start; + font: din-medium; + text-align: left; } + +.login input[type="email"], +.login input[type="password"] { + width: 200px; + height:32px; + border-radius: 2px; + background-color:#ffffff; + color:#bdbdbd; + font-family: din-medium; + font-size: 14px; + text-align: left; + padding: 11px 0px 0px 10px; + margin-left: 61px; +} + +.login input[type="email"] { + margin-bottom:10px; +} + .centerGreyForm input[type="text"]:hover, .centerGreyForm input[type="email"]:hover, .centerGreyForm input[type="password"]:hover { @@ -237,7 +385,9 @@ input[type="submit"]:active { -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); + color: #424242; } + .new_topic { /* start it off screen while it initializes the spinner, then it will be hidden with jquery */ top: -1000px; @@ -548,6 +698,7 @@ li.accountInvite span { width:84px; margin: 24px auto; } + .accountInput { margin: 0 35px 10px; } @@ -600,12 +751,14 @@ li.accountInvite span { } #user_remember_me { margin-top: 11px; + display:inline; } #user_remember_me, label[for="user_remember_me"] { - float: left; + float: right; font-size: 12px; color: #424242; + margin-left: 24px; } .accountForgotPass { margin: 8px 0 0 35px; diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb index 738d5c62..c85dc299 100644 --- a/app/views/users/edit.html.erb +++ b/app/views/users/edit.html.erb @@ -6,15 +6,18 @@ <% content_for :title, @user.name + "'s Settings | Metamaps" %>
-<%= formula_form_for @user, url: user_url do |form| %> +<%= formula_form_for @user, url: user_url, :html =>{ :class => "edit_user centerGreyForm"} do |form| %>

Edit Account

- - <% if @user.image %><%= image_tag @user.image.url(:round), :size => "48x48" %><% end %> - <%= form.file_field :image %> - <%= form.input :name, label: "Name", class: "name" %> - <%= form.input :email, label: "Email", class: "email" %> - <%= form.input :password, label: "Password", class: "password", :autocomplete => :off %> + <% if @user.image %><%= image_tag @user.image.url(:round), :size => "120x120" %><% end %> +
<%= @user.name %>
+
<%= form.label :email, "Email:", :class => "firstFieldText" %> + <%= form.input :email %>
+
<%= form.label :password, "Current Password:", :class => "firstFieldText" %> + <%= form.input :password, :autocomplete => :off%>
+
<%= form.label :password, "New Password:", :class => "firstFieldText" %> + <%= form.input :password, :autocomplete => :off%>
+
<%= form.label :password, "Confirm New Password:", :class => "firstFieldText" %> + <%= form.input :password, :autocomplete => :off%>
<%= form.submit "Update", class: "update" %> <% end %>
- diff --git a/app/views/users/passwords/new.html.erb b/app/views/users/passwords/new.html.erb index 88dddb4a..120bf376 100644 --- a/app/views/users/passwords/new.html.erb +++ b/app/views/users/passwords/new.html.erb @@ -6,10 +6,10 @@

FORGOT PASSWORD?

-
<%= f.label :email, "Enter Your Email:" %> +
<%= f.label :email, "Enter your email:", :class => "firstFieldText" %> <%= f.email_field :email, :autofocus => true %>
-
<%= f.submit "Send Reset Password Instructions" %>
+
<%= f.submit "Send Password Reset Instructions" %>
<% end %>
diff --git a/app/views/users/registrations/new.html.erb b/app/views/users/registrations/new.html.erb index e7c08256..1f835e30 100644 --- a/app/views/users/registrations/new.html.erb +++ b/app/views/users/registrations/new.html.erb @@ -6,24 +6,24 @@

Sign Up

-
<%= f.label :name %> +
<%= f.label :name, "Name:", :class => "firstFieldText" %> <%= f.text_field :name, :autofocus => true %>
-
<%= f.label :email %> +
<%= f.label :email, "Email:", :class => "fieldText" %> <%= f.email_field :email %>
-
<%= f.label :password %> +
<%= f.label :password, "Password:", :class => "fieldText" %> <%= f.password_field :password %>
-
<%= f.label :password_confirmation %> +
<%= f.label :password_confirmation, "Password Confirmation:", :class => "fieldText" %> <%= f.password_field :password_confirmation %>
-
<%= f.label "Access Code" %> +
<%= f.label "Access Code:", :class => "fieldText" %> <%= f.text_field :joinedwithcode %>
-
<%= f.submit "Sign up" %>
+
<%= f.submit "Sign up!" %>
-

Don't have an access code?
Request an Invite
+

Don't have an access code?
Request an Invite
<% end %>
diff --git a/app/views/users/sessions/new.html.erb b/app/views/users/sessions/new.html.erb index 6f55203b..0a13b435 100644 --- a/app/views/users/sessions/new.html.erb +++ b/app/views/users/sessions/new.html.erb @@ -1,28 +1,27 @@ <% content_for :title, "Sign In | Metamaps" %>
-<%= form_for(resource, :as => resource_name, :url => session_path(resource_name), :html => { :method => :post, :class => "new_user centerGreyForm" }) do |f| %> -

Sign in

- -
<%= f.label :email %> +<%= form_for(resource, :as => resource_name, :url => session_path(resource_name), :html => { :method => :post, :class => "centerGreyForm login" }) do |f| %> +

SIGN IN

+ +
+
<%= f.email_field :email, :autofocus => true %>
-
<%= f.label :password %> +
<%= f.password_field :password %>
+
<%= f.submit "Sign in" %>
<% if devise_mapping.rememberable? -%> -
<%= f.check_box :remember_me %> <%= f.label :remember_me %>
+
<%= f.check_box :remember_me %>
<% end -%> -
<%= f.submit "Sign in" %>
-
<%- if devise_mapping.recoverable? && controller_name != 'passwords' %> - <%= link_to "Forgot your password?", new_password_path(resource_name), - :data => { :bypass => 'true'} %>
+ <%= link_to "Forgot your password?", new_password_path(resource_name), :class => "forgotPasswordText" , + :data => { :bypass => 'true'}%>
<% end -%>
-
Don't have an account?
Request an Invite
<% end %>
diff --git a/diff.txt b/diff.txt new file mode 100644 index 00000000..badb2420 --- /dev/null +++ b/diff.txt @@ -0,0 +1,130 @@ + + +diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css +index bb0edb6..bb56ab0 100644 +--- a/app/assets/stylesheets/application.css ++++ b/app/assets/stylesheets/application.css +@@ -74,8 +74,9 @@ body, + /* forgot password fix */ + + .forgotPassword input[type="submit"] { +- padding: 0 5px; +- width: auto; ++ width: 300px; ++ color: #f5f5f5; ++ font-family: din-regular; + } + html { + +@@ -189,36 +190,55 @@ input[type="submit"]:active { + border-radius: 5px; + color: black; + box-shadow: 6px 6px 8px rgba(0, 0, 0, 0.4); ++ position:absolute; + top: 50%; + left:50%; +- position:absolute; +- margin-left: -166px; ++ + } ++ + .forgotPassword { + height: 134px; + margin-top: -83px; ++ font-family: din-medium; ++ color:#424242; ++ text-transform: uppercase; ++ box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.23), 0px 3px 3px rgba(0, 0, 0, 0.16); ++ font-size: 17px; ++ margin-left: -166px; ++ ++} ++ ++.emailText { ++ font-family: din-regular; ++ font-size: 14px; ++ color:#424242; ++ padding-top:24px; ++ padding-bottom: 6px; ++ text-transform: none; ++ margin: 0px; + } + .centerGreyForm input[type="text"], + .centerGreyForm input[type="email"], + .centerGreyForm input[type="password"] { +- width: 250px; ++ width: 300px; + height: 32px; + font-size: 15px; + direction: ltr; + -webkit-appearance: none; + appearance: none; + display: inline-block; +- margin: 0; +- padding: 0 8px; ++ margin: 0px 0px 6px 0px; ++ padding: 10px 0px 0px 9px; + background: #fff; ++ color: #bdbdbd; + border: 1px solid #d9d9d9; + border-top: 1px solid #c0c0c0; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; +- -webkit-border-radius: 1px; +- -moz-border-radius: 1px; +- border-radius: 1px; ++ -webkit-border-radius: 2px; ++ -moz-border-radius: 2px; ++ border-radius: 2px; + font: -webkit-small-control; + color: initial; + letter-spacing: normal; +@@ -227,8 +247,10 @@ input[type="submit"]:active { + text-indent: 0px; + text-shadow: none; + display: inline-block; +- text-align: start; ++ font: din-medium; ++ text-align: left; + } ++ + .centerGreyForm input[type="text"]:hover, + .centerGreyForm input[type="email"]:hover, + .centerGreyForm input[type="password"]:hover { +@@ -237,7 +259,9 @@ input[type="submit"]:active { + -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); + -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); + box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); ++ color: #424242; + } ++ + .new_topic { + /* start it off screen while it initializes the spinner, then it will be hidden with jquery */ + top: -1000px; +diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb +index 738d5c6..70d6de7 100644 +--- a/app/views/users/edit.html.erb ++++ b/app/views/users/edit.html.erb +@@ -17,4 +17,3 @@ + <%= form.submit "Update", class: "update" %> + <% end %> +
+- +diff --git a/app/views/users/passwords/new.html.erb b/app/views/users/passwords/new.html.erb +index 88dddb4..3238a81 100644 +--- a/app/views/users/passwords/new.html.erb ++++ b/app/views/users/passwords/new.html.erb +@@ -6,10 +6,10 @@ + +

FORGOT PASSWORD?

+ +-
<%= f.label :email, "Enter Your Email:" %> ++
<%= f.label :email, "Enter your email:", :class => "emailText" %> + <%= f.email_field :email, :autofocus => true %>
+ +-
<%= f.submit "Send Reset Password Instructions" %>
++
<%= f.submit "Send Password Reset Instructions" %>
+ + <% end %> +
From 71247a8f04bc04d8c81fc92978edb1d12b43a4f4 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Thu, 25 Sep 2014 13:26:09 -0400 Subject: [PATCH 3/6] fixes for account pages --- app/assets/stylesheets/application.css | 43 +++++++++++--------------- app/views/layouts/_account.html.erb | 18 ++++++----- app/views/users/edit.html.erb | 12 +++---- app/views/users/sessions/new.html.erb | 25 +++++++++------ 4 files changed, 50 insertions(+), 48 deletions(-) diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index cabd6303..e67b6e69 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -92,8 +92,6 @@ body, .login input[type="submit"]{ width:84px; margin-top: 16px; - margin-left: 61px; - margin-right: 35px; font-family: din-regular; text-transform: uppercase; } @@ -227,23 +225,16 @@ input[type="submit"]:active { } .login{ - width: 322px; + width: 200px; height: 308px; box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.23), 0px 3px 3px rgba(0, 0, 0, 0.16); - margin-left:-166px; + margin-left:-100px; margin-top:-158px; - padding-left: 35px; font-family: din-medium; font-size: 18px; color: #424242; } -.login input[type="checkbox"] { - border: 1px #424242; - top: 250px; - float: left; -} - .new_user{ height: 412px; margin-left:-166px; @@ -258,8 +249,7 @@ input[type="submit"]:active { .edit_user { width: 300px; - height:531px; - top: 136px; + margin-top: -282px; margin-left: -166px; box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.23), 0px 3px 3px rgba(0, 0, 0, 0.16); text-transform: uppercase; @@ -309,13 +299,6 @@ input[type="submit"]:active { margin-top: 16px; } -.forgotPasswordText { - font-family: din-medium; - font-size: 12px; - color:#757575; - margin-left: 35px; -} - .name { font-size: 24px; text-align: center; @@ -370,7 +353,6 @@ input[type="submit"]:active { font-size: 14px; text-align: left; padding: 11px 0px 0px 10px; - margin-left: 61px; } .login input[type="email"] { @@ -745,11 +727,18 @@ li.accountInvite span { box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); } .accountSubmit { - margin-left: 35px; float:left; } +.loginAnywhere .accountSubmit { + margin-left: 35px; +} .accountRememberMe { float:right; +} +.login .accountRememberMe { + margin-top: 10px; +} +.loginAnywhere .accountRememberMe { margin-right: 35px; } #user_remember_me { @@ -761,12 +750,16 @@ label[for="user_remember_me"] { float: right; font-size: 12px; color: #424242; - margin-left: 24px; } .accountForgotPass { - margin: 8px 0 0 35px; font-size: 12px; } +.loginAnywhere .accountForgotPass { + margin: 8px 0 0 35px; +} +.login .accountForgotPass { + margin: 8px 0 0 0; +} .accountForgotPass a { color: #757575; } @@ -2257,4 +2250,4 @@ float: left; background-position: 16px 8px; -webkit-transform-origin: left center; transform-origin: left center; -} +} diff --git a/app/views/layouts/_account.html.erb b/app/views/layouts/_account.html.erb index 5fe43665..0cee5c7f 100644 --- a/app/views/layouts/_account.html.erb +++ b/app/views/layouts/_account.html.erb @@ -38,14 +38,18 @@
<%= f.submit "SIGN IN" %>
<% if devise_mapping.rememberable? -%> -
<%= f.check_box :remember_me %> <%= f.label :remember_me, "Stay signed in" %>
+
+ <%= f.label :remember_me, "Stay signed in" %> + <%= f.check_box :remember_me %> +
+
<% end -%>
+
+ <%- if devise_mapping.recoverable? && controller_name != 'passwords' %> + <%= link_to "Forgot password?", new_password_path(resource_name), + :data => { :bypass => 'true'} %> + <% end -%> +
<% end %> -
- <%- if devise_mapping.recoverable? && controller_name != 'passwords' %> - <%= link_to "Forgot password?", new_password_path(resource_name), - :data => { :bypass => 'true'} %> - <% end -%> -
<% end %> diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb index c85dc299..5eee44f1 100644 --- a/app/views/users/edit.html.erb +++ b/app/views/users/edit.html.erb @@ -6,18 +6,18 @@ <% content_for :title, @user.name + "'s Settings | Metamaps" %>
-<%= formula_form_for @user, url: user_url, :html =>{ :class => "edit_user centerGreyForm"} do |form| %> +<%= form_for @user, url: user_url, :html =>{ :class => "edit_user centerGreyForm"} do |form| %>

Edit Account

<% if @user.image %><%= image_tag @user.image.url(:round), :size => "120x120" %><% end %>
<%= @user.name %>
<%= form.label :email, "Email:", :class => "firstFieldText" %> - <%= form.input :email %>
+ <%= form.email_field :email %>
<%= form.label :password, "Current Password:", :class => "firstFieldText" %> - <%= form.input :password, :autocomplete => :off%>
+ <%= form.password_field :password, :autocomplete => :off%>
<%= form.label :password, "New Password:", :class => "firstFieldText" %> - <%= form.input :password, :autocomplete => :off%>
-
<%= form.label :password, "Confirm New Password:", :class => "firstFieldText" %> - <%= form.input :password, :autocomplete => :off%>
+ <%= form.password_field :password, :autocomplete => :off%>
+
<%= form.label :password_confirmation, "Confirm New Password:", :class => "firstFieldText" %> + <%= form.password_field :password_confirmation, :autocomplete => :off%>
<%= form.submit "Update", class: "update" %> <% end %>
diff --git a/app/views/users/sessions/new.html.erb b/app/views/users/sessions/new.html.erb index 0a13b435..0c28a9cb 100644 --- a/app/views/users/sessions/new.html.erb +++ b/app/views/users/sessions/new.html.erb @@ -6,22 +6,27 @@
- <%= f.email_field :email, :autofocus => true %>
+ <%= f.email_field :email, :autofocus => true, :placeholder => "Email" %>
- <%= f.password_field :password %>
+ <%= f.password_field :password, :placeholder => "Password" %> -
<%= f.submit "Sign in" %>
+
<%= f.submit "Sign in" %>
<% if devise_mapping.rememberable? -%> -
<%= f.check_box :remember_me %>
+
+ <%= f.label :remember_me, "Stay signed in" %> + <%= f.check_box :remember_me %> +
+
<% end -%> +
-
- <%- if devise_mapping.recoverable? && controller_name != 'passwords' %> - <%= link_to "Forgot your password?", new_password_path(resource_name), :class => "forgotPasswordText" , - :data => { :bypass => 'true'}%>
- <% end -%> -
+
+ <%- if devise_mapping.recoverable? && controller_name != 'passwords' %> + <%= link_to "Forgot password?", new_password_path(resource_name), + :data => { :bypass => 'true'}%>
+ <% end -%> +
<% end %> From c46ab1a98b9a8d573194bcd1e45fd612fb02af22 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Thu, 25 Sep 2014 13:41:37 -0400 Subject: [PATCH 4/6] added hover to edit photo --- app/assets/stylesheets/application.css | 19 +++++++++++++++++++ app/views/users/edit.html.erb | 5 ++++- 2 files changed, 23 insertions(+), 1 deletion(-) diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index e67b6e69..eb8176b8 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -106,6 +106,25 @@ body, float: right; } +.edit_user .userImage { + width: 120px; + margin: 0 auto; + position: relative; +} +.edit_user .editPhoto { + display: none; + width: 40px; + height: 40px; + background-image: url(photo.png); + position: absolute; + top: 40px; + left: 40px; + cursor: pointer; +} +.edit_user .userImage:hover .editPhoto { + display: block; +} + html { } diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb index 5eee44f1..ea03ef49 100644 --- a/app/views/users/edit.html.erb +++ b/app/views/users/edit.html.erb @@ -8,7 +8,10 @@
<%= form_for @user, url: user_url, :html =>{ :class => "edit_user centerGreyForm"} do |form| %>

Edit Account

- <% if @user.image %><%= image_tag @user.image.url(:round), :size => "120x120" %><% end %> +
+ <%= image_tag @user.image.url(:round), :size => "120x120" %> +
+
<%= @user.name %>
<%= form.label :email, "Email:", :class => "firstFieldText" %> <%= form.email_field :email %>
From 14eb7562b19981bf761b955eb1356149b0102480 Mon Sep 17 00:00:00 2001 From: BasharJabbour Date: Fri, 26 Sep 2014 08:42:11 -0400 Subject: [PATCH 5/6] fixed edit user account page --- app/assets/javascripts/src/Metamaps.js | 36 ++++++++++++++++++ app/assets/stylesheets/application.css | 51 +++++++++++++++++++++++--- app/views/users/edit.html.erb | 4 ++ app/views/users/sessions/new.html.erb | 25 +++++-------- 4 files changed, 95 insertions(+), 21 deletions(-) diff --git a/app/assets/javascripts/src/Metamaps.js b/app/assets/javascripts/src/Metamaps.js index c112917d..7ded91f1 100644 --- a/app/assets/javascripts/src/Metamaps.js +++ b/app/assets/javascripts/src/Metamaps.js @@ -3401,6 +3401,7 @@ Metamaps.Map.InfoBox = { }); $('.yourMap .mapPermission').unbind().click(self.onPermissionClick); + }, createContributorList: function () { var self = Metamaps.Map.InfoBox; @@ -3457,6 +3458,41 @@ Metamaps.Map.InfoBox = { } }; // end Metamaps.Map.InfoBox +/* +* +* Account Settings +* +*/ +Metamaps.Account = { + init: function () { + var self = Metamaps.Account; + $(".changePass").click(function(){ + $(".toHide").show(); + $(".changePass").hide(); + }); + }, + + load: function(){ + var self = Metamaps.Account; + $(".changePass").click(function(){ + $(".toHide").show(); + $(".changePass").hide(); + }); + self.attachEventListeners(); + }, + attachEventListeners: function () { + $(".changePass").click(); + $(".noChangePass").click(); + }, + showPass: function(){ + $(".toHide").show(); + $(".changePass").hide(); + }, + hidePass: function(){ + $(".toHide").hide(); + $(".changePass").show(); + } +}; /* * diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index eb8176b8..38b61813 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -77,6 +77,8 @@ body, width: 300px; color: #f5f5f5; font-family: din-regular; + top: 118px; + position: absolute; } .new_user input[type="submit"] { @@ -110,6 +112,7 @@ body, width: 120px; margin: 0 auto; position: relative; + margin-top: 40px; } .edit_user .editPhoto { display: none; @@ -259,7 +262,6 @@ input[type="submit"]:active { margin-left:-166px; box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.23), 0px 3px 3px rgba(0, 0, 0, 0.16); font-family: din-medium; - font-size: 18px; line-height: 18px; text-transform: uppercase; color:#424242; @@ -272,21 +274,24 @@ input[type="submit"]:active { margin-left: -166px; box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.23), 0px 3px 3px rgba(0, 0, 0, 0.16); text-transform: uppercase; - font-size: 18px; line-height: 18px; font-family: din-medium; color:#424242; } +.toHide { + display:none; +} + .forgotPassword { height: 134px; font-family: din-medium; color:#424242; text-transform: uppercase; box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.23), 0px 3px 3px rgba(0, 0, 0, 0.16); - font-size: 18px; margin-left: -166px; margin-top: -83px; + line-height: 18px; } .firstFieldText{ @@ -311,11 +316,12 @@ input[type="submit"]:active { } .smallText{ - font: din-regular; + font-family: din-regular; font-size: 12px; line-height: 12px; color: #c04f4f; - margin-top: 16px; + margin-top: 8px; + text-transform: none; } .name { @@ -325,6 +331,39 @@ input[type="submit"]:active { color:#424242; margin-top: 24px; text-transform: none; + +} + +.name:after { + background:url(edit.png)no-repeat; + content:" "; + position:absolute; + width:25px; + height:25px; + margin:5px 0px 0px 5px; +} + +.changePass { + font-family: din-regular; + font-size: 14px; + line-height: 14px; + color: #4fb5c0; + padding-top: 16px; + float: left; + text-transform: none; + cursor: pointer; +} + +.noChangePass { + font-family: din-regular; + font-size: 12px; + line-height: 12px; + color: #c04f4f; + padding-top: 16px; + float: left; + text-transform: none; + cursor: pointer; + } .centerGreyForm input[type="text"], @@ -357,7 +396,7 @@ input[type="submit"]:active { text-indent: 0px; text-shadow: none; display: inline-block; - font: din-medium; + font-family: din-medium; text-align: left; } diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb index ea03ef49..56afbb88 100644 --- a/app/views/users/edit.html.erb +++ b/app/views/users/edit.html.erb @@ -15,12 +15,16 @@
<%= @user.name %>
<%= form.label :email, "Email:", :class => "firstFieldText" %> <%= form.email_field :email %>
+
Change Password
+
<%= form.label :password, "Current Password:", :class => "firstFieldText" %> <%= form.password_field :password, :autocomplete => :off%>
<%= form.label :password, "New Password:", :class => "firstFieldText" %> <%= form.password_field :password, :autocomplete => :off%>
<%= form.label :password_confirmation, "Confirm New Password:", :class => "firstFieldText" %> <%= form.password_field :password_confirmation, :autocomplete => :off%>
+
oops, don't change password
+
<%= form.submit "Update", class: "update" %> <% end %>
diff --git a/app/views/users/sessions/new.html.erb b/app/views/users/sessions/new.html.erb index 0c28a9cb..0ce0e56c 100644 --- a/app/views/users/sessions/new.html.erb +++ b/app/views/users/sessions/new.html.erb @@ -6,27 +6,22 @@
- <%= f.email_field :email, :autofocus => true, :placeholder => "Email" %>
+ <%= f.email_field :email, :autofocus => true %>
- <%= f.password_field :password, :placeholder => "Password" %>
+ <%= f.password_field :password %> -
<%= f.submit "Sign in" %>
+
<%= f.submit "Sign in" %>
<% if devise_mapping.rememberable? -%> -
- <%= f.label :remember_me, "Stay signed in" %> - <%= f.check_box :remember_me %> -
-
+
<%= f.check_box :remember_me %>
<% end -%> -
-
- <%- if devise_mapping.recoverable? && controller_name != 'passwords' %> - <%= link_to "Forgot password?", new_password_path(resource_name), - :data => { :bypass => 'true'}%>
- <% end -%> -
+
+ <%- if devise_mapping.recoverable? && controller_name != 'passwords' %> + <%= link_to "Forgot your password?", new_password_path(resource_name), :class => "forgotPasswordText" , + :data => { :bypass => 'true'}%>
+ <% end -%> +
<% end %> From 32908c7717e80c03b2e0e3886abbdf34e1d3c61e Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Fri, 26 Sep 2014 22:31:06 -0400 Subject: [PATCH 6/6] style changes for account pages --- app/assets/javascripts/src/Metamaps.js | 23 +++---- app/assets/stylesheets/application.css | 86 ++++++++++++++------------ app/assets/stylesheets/clean.css | 12 +--- app/views/users/edit.html.erb | 16 +++-- app/views/users/sessions/new.html.erb | 27 ++++---- 5 files changed, 84 insertions(+), 80 deletions(-) diff --git a/app/assets/javascripts/src/Metamaps.js b/app/assets/javascripts/src/Metamaps.js index 7ded91f1..d0f6057d 100644 --- a/app/assets/javascripts/src/Metamaps.js +++ b/app/assets/javascripts/src/Metamaps.js @@ -3466,23 +3466,12 @@ Metamaps.Map.InfoBox = { Metamaps.Account = { init: function () { var self = Metamaps.Account; - $(".changePass").click(function(){ - $(".toHide").show(); - $(".changePass").hide(); - }); - }, - load: function(){ - var self = Metamaps.Account; - $(".changePass").click(function(){ - $(".toHide").show(); - $(".changePass").hide(); - }); - self.attachEventListeners(); + }, - attachEventListeners: function () { - $(".changePass").click(); - $(".noChangePass").click(); + changeName: function(){ + $('.accountName').hide(); + $('.changeName').show(); }, showPass: function(){ $(".toHide").show(); @@ -3491,6 +3480,10 @@ Metamaps.Account = { hidePass: function(){ $(".toHide").hide(); $(".changePass").show(); + + $('#current_password').val(''); + $('#user_password').val(''); + $('#user_password_confirmation').val(''); } }; diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index 38b61813..8ae9967a 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -51,6 +51,22 @@ img { display: block; text-indent: -9999px; } + +::-webkit-input-placeholder { /* WebKit browsers */ + color: #BDBDBD; +} +:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ + color: #BDBDBD; + opacity: 1; +} +::-moz-placeholder { /* Mozilla Firefox 19+ */ + color: #BDBDBD; + opacity: 1; +} +:-ms-input-placeholder { /* Internet Explorer 10+ */ + color: #BDBDBD; +} + html, body, .main, @@ -109,10 +125,10 @@ body, } .edit_user .userImage { - width: 120px; + width: 84px; margin: 0 auto; position: relative; - margin-top: 40px; + margin-top: 32px; } .edit_user .editPhoto { display: none; @@ -120,8 +136,8 @@ body, height: 40px; background-image: url(photo.png); position: absolute; - top: 40px; - left: 40px; + top: 22px; + left: 22px; cursor: pointer; } .edit_user .userImage:hover .editPhoto { @@ -294,8 +310,11 @@ input[type="submit"]:active { line-height: 18px; } +.edit_user label.firstFieldText { + padding-top: 8px; +} .firstFieldText{ - font-family: din-regular; + font-family: 'din-regular', helvetica, sans-serif; font-size: 14px; color:#424242; padding-top:24px; @@ -324,17 +343,16 @@ input[type="submit"]:active { text-transform: none; } -.name { +.accountName { font-size: 24px; text-align: center; - font-family: din-meduim; + font-family: 'din-medium', helvetica, sans-serif; color:#424242; margin-top: 24px; text-transform: none; } - -.name:after { +.accountName:hover .nameEdit:after { background:url(edit.png)no-repeat; content:" "; position:absolute; @@ -342,6 +360,10 @@ input[type="submit"]:active { height:25px; margin:5px 0px 0px 5px; } +.changeName { + display: none; + margin-top: 24px; +} .changePass { font-family: din-regular; @@ -377,11 +399,11 @@ input[type="submit"]:active { appearance: none; display: inline-block; margin: 0px 0px; - padding: 10px 0px 0px 9px; + padding: 5px 0px 0px 9px; background: #fff; - color: #bdbdbd; - border: 1px solid #d9d9d9; - border-top: 1px solid #c0c0c0; + color: #424242 !important; + border: none; + outline:none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; @@ -396,7 +418,7 @@ input[type="submit"]:active { text-indent: 0px; text-shadow: none; display: inline-block; - font-family: din-medium; + font-family: 'din-regular', helvetica, sans-serif; text-align: left; } @@ -406,28 +428,17 @@ input[type="submit"]:active { height:32px; border-radius: 2px; background-color:#ffffff; - color:#bdbdbd; + color: #424242 !important; font-family: din-medium; font-size: 14px; text-align: left; - padding: 11px 0px 0px 10px; + padding: 5px 0px 0px 10px; } .login input[type="email"] { margin-bottom:10px; } -.centerGreyForm input[type="text"]:hover, -.centerGreyForm input[type="email"]:hover, -.centerGreyForm input[type="password"]:hover { - border: 1px solid #b9b9b9; - border-top: 1px solid #a0a0a0; - -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - color: #424242; -} - .new_topic { /* start it off screen while it initializes the spinner, then it will be hidden with jquery */ top: -1000px; @@ -758,8 +769,7 @@ li.accountInvite span { margin: 0; padding: 0 10px; background: #fff; - border: 1px solid #d9d9d9; - border-top: 1px solid #c0c0c0; + border: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; @@ -767,7 +777,7 @@ li.accountInvite span { -moz-border-radius: 2px; border-radius: 2px; font: -webkit-small-control; - color: #BDBDBD; + color: #424242 !important; letter-spacing: normal; word-spacing: normal; text-transform: none; @@ -776,14 +786,6 @@ li.accountInvite span { text-align: start; font-family: 'din-medium', helvetica, sans-serif; } -.sidebarAccountBox input[type="email"]:hover, -.sidebarAccountBox input[type="password"]:hover { - border: 1px solid #b9b9b9; - border-top: 1px solid #a0a0a0; - -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); - box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -} .accountSubmit { float:left; } @@ -2267,7 +2269,15 @@ float: left; display: none; } + /* collabCompass section */ +.collabCompass { + position:fixed; + top:50%; + left:50%; + z-index: 4; +} + .collabCompass:hover p { display: block; } diff --git a/app/assets/stylesheets/clean.css b/app/assets/stylesheets/clean.css index 4548ad71..918af0c3 100644 --- a/app/assets/stylesheets/clean.css +++ b/app/assets/stylesheets/clean.css @@ -805,14 +805,4 @@ box-shadow: 0px 1px 1.5px rgba(0,0,0,0.12), 0 1px 1px rgba(0,0,0,0.24); body a#barometer_tab:hover { background-position: 0 -110px; -} - - -/* REALTIME */ - -.collabCompass { - position:fixed; - top:50%; - left:50%; - z-index: 4; -} +} \ No newline at end of file diff --git a/app/views/users/edit.html.erb b/app/views/users/edit.html.erb index 56afbb88..82166dbf 100644 --- a/app/views/users/edit.html.erb +++ b/app/views/users/edit.html.erb @@ -9,21 +9,27 @@ <%= form_for @user, url: user_url, :html =>{ :class => "edit_user centerGreyForm"} do |form| %>

Edit Account

- <%= image_tag @user.image.url(:round), :size => "120x120" %> + <%= image_tag @user.image.url(:round), :size => "84x84" %>
-
<%= @user.name %>
+
+
<%= @user.name %>
+
+
<%= form.label :name, "Name:", :class => "firstFieldText" %> + <%= form.email_field :name %>
<%= form.label :email, "Email:", :class => "firstFieldText" %> <%= form.email_field :email %>
Change Password
-
<%= form.label :password, "Current Password:", :class => "firstFieldText" %> - <%= form.password_field :password, :autocomplete => :off%>
+
+ <%= form.label :current_password, "Current Password:", :class => "firstFieldText" %> + <%= password_field_tag :current_password, params[:current_password] %> +
<%= form.label :password, "New Password:", :class => "firstFieldText" %> <%= form.password_field :password, :autocomplete => :off%>
<%= form.label :password_confirmation, "Confirm New Password:", :class => "firstFieldText" %> <%= form.password_field :password_confirmation, :autocomplete => :off%>
-
oops, don't change password
+
Oops, don't change password
<%= form.submit "Update", class: "update" %> <% end %> diff --git a/app/views/users/sessions/new.html.erb b/app/views/users/sessions/new.html.erb index 0ce0e56c..16836175 100644 --- a/app/views/users/sessions/new.html.erb +++ b/app/views/users/sessions/new.html.erb @@ -6,22 +6,27 @@
- <%= f.email_field :email, :autofocus => true %>
+ <%= f.email_field :email, :autofocus => true, :placeholder => "Email" %>
- <%= f.password_field :password %>
+ <%= f.password_field :password, :placeholder => "Password" %> -
<%= f.submit "Sign in" %>
+
<%= f.submit "Sign in" %>
+ <% if devise_mapping.rememberable? -%> -
<%= f.check_box :remember_me %>
+
+ <%= f.label :remember_me, "Stay signed in" %> + <%= f.check_box :remember_me %> +
+
<% end -%> - -
- <%- if devise_mapping.recoverable? && controller_name != 'passwords' %> - <%= link_to "Forgot your password?", new_password_path(resource_name), :class => "forgotPasswordText" , - :data => { :bypass => 'true'}%>
- <% end -%> -
+
+
+ <%- if devise_mapping.recoverable? && controller_name != 'passwords' %> + <%= link_to "Forgot password?", new_password_path(resource_name), + :data => { :bypass => 'true'} %> + <% end -%> +
<% end %>