style changes for account pages
This commit is contained in:
Connor Turland
parent
14eb7562b1
commit
32908c7717
|
|
@ -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('');
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
@ -9,21 +9,27 @@
|
|||
<%= form_for @user, url: user_url, :html =>{ :class => "edit_user centerGreyForm"} do |form| %>
|
||||
<h3>Edit Account</h3>
|
||||
<div class="userImage">
|
||||
<%= image_tag @user.image.url(:round), :size => "120x120" %>
|
||||
<%= image_tag @user.image.url(:round), :size => "84x84" %>
|
||||
<div class="editPhoto"></div>
|
||||
</div>
|
||||
<div class="name"> <%= @user.name %> </div>
|
||||
<div class="accountName" onclick="Metamaps.Account.changeName()">
|
||||
<div class="nameEdit"><%= @user.name %></div>
|
||||
</div>
|
||||
<div class="changeName"><%= form.label :name, "Name:", :class => "firstFieldText" %>
|
||||
<%= form.email_field :name %></div>
|
||||
<div><%= form.label :email, "Email:", :class => "firstFieldText" %>
|
||||
<%= form.email_field :email %></div>
|
||||
<div class="changePass" onclick="Metamaps.Account.showPass()">Change Password</div>
|
||||
<div class="toHide">
|
||||
<div><%= form.label :password, "Current Password:", :class => "firstFieldText" %>
|
||||
<%= form.password_field :password, :autocomplete => :off%></div>
|
||||
<div>
|
||||
<%= form.label :current_password, "Current Password:", :class => "firstFieldText" %>
|
||||
<%= password_field_tag :current_password, params[:current_password] %>
|
||||
</div>
|
||||
<div><%= form.label :password, "New Password:", :class => "firstFieldText" %>
|
||||
<%= form.password_field :password, :autocomplete => :off%></div>
|
||||
<div><%= form.label :password_confirmation, "Confirm New Password:", :class => "firstFieldText" %>
|
||||
<%= form.password_field :password_confirmation, :autocomplete => :off%></div>
|
||||
<div class="noChangePass" onclick="Metamaps.Account.hidePass()">oops, don't change password</div>
|
||||
<div class="noChangePass" onclick="Metamaps.Account.hidePass()">Oops, don't change password</div>
|
||||
</div>
|
||||
<%= form.submit "Update", class: "update" %>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -6,22 +6,27 @@
|
|||
|
||||
<div class="accountImage"></div>
|
||||
<div>
|
||||
<%= f.email_field :email, :autofocus => true %></div>
|
||||
<%= f.email_field :email, :autofocus => true, :placeholder => "Email" %></div>
|
||||
|
||||
<div>
|
||||
<%= f.password_field :password %></div>
|
||||
<%= f.password_field :password, :placeholder => "Password" %></div>
|
||||
|
||||
<div><%= f.submit "Sign in" %></div>
|
||||
<div class="accountSubmit"><%= f.submit "Sign in" %></div>
|
||||
|
||||
<% if devise_mapping.rememberable? -%>
|
||||
<div><%= f.check_box :remember_me %></div>
|
||||
<div class="accountRememberMe">
|
||||
<%= f.label :remember_me, "Stay signed in" %>
|
||||
<%= f.check_box :remember_me %>
|
||||
<div class="clearfloat"></div>
|
||||
</div>
|
||||
<% end -%>
|
||||
|
||||
<br />
|
||||
<%- if devise_mapping.recoverable? && controller_name != 'passwords' %>
|
||||
<%= link_to "Forgot your password?", new_password_path(resource_name), :class => "forgotPasswordText" ,
|
||||
:data => { :bypass => 'true'}%><br />
|
||||
<% end -%>
|
||||
<br />
|
||||
<div class="clearfloat"></div>
|
||||
<div class="accountForgotPass">
|
||||
<%- if devise_mapping.recoverable? && controller_name != 'passwords' %>
|
||||
<%= link_to "Forgot password?", new_password_path(resource_name),
|
||||
:data => { :bypass => 'true'} %>
|
||||
<% end -%>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue