Download as
Browse Code »

Commit 41373171c8ec436dc81719b6768230dc330b3aa1

Authored by Daniela Feitosa
1 parent 2758921d
Exists in master and in 29 other branches add_member_task_reject_details, admin_visible_profile, article-list-template, community_notifications, contact_admin_translation, event_fixes, fix_comments_pagination, fix_rails4_organization_ratings, fix_sign_up_form, follow_step_fix, forum_topic_creation, mirror_block_improvements, multi_env_on_remote_user, new_security, noosfero_spb_ci, organization_ratings_improvements, organization_ratings_link_to_profile_stable-spb-1.3, organization_ratings_translations_fix, profile_api_improvements, ratings_minor_fixes, remote_user_fix, send_email_to_admins, stable-spb-1.3, stable-spb-1.3-fixes, stable-spb-1.4, stable-spb-1.5, suggest_rejected_value, web_steps_improvements, xss_terminate_custom_options

Fixed balloons alignment on signup 

All fixed fields have balloons
Showing 2 changed files with 48 additions and 7 deletions   Show diff stats
app/views/account/_signup_form.rhtml
  Diff comments   View file @4137317
@@ -35,12 +35,13 @@ @@ -35,12 +35,13 @@
35 35
36 <div id='signup-password-confirmation'> 36 <div id='signup-password-confirmation'>
37 <%= required f.password_field(:password_confirmation) %> 37 <%= required f.password_field(:password_confirmation) %>
  38 + <%= content_tag(:small,_('We need to be sure that you filled in your password correctly. Confirm you password.'), :id => 'password-confirmation-balloon') %>
38 <div id='password-check'><p>&nbsp;</p></div> 39 <div id='password-check'><p>&nbsp;</p></div>
39 </div> 40 </div>
40 41
41 <div id='signup-email'> 42 <div id='signup-email'>
42 <%= required f.text_field(:email) %> 43 <%= required f.text_field(:email) %>
43 - <%= content_tag(:small,_('This e-mail address will be used to contact you.')) %> 44 + <%= content_tag(:small,_('This e-mail address will be used to contact you.'), :id => 'email-balloon') %>
44 <div id='email-check'><p>&nbsp;</p></div> 45 <div id='email-check'><p>&nbsp;</p></div>
45 </div> 46 </div>
46 <%= observe_field "user_email", 47 <%= observe_field "user_email",
@@ -63,9 +64,9 @@ @@ -63,9 +64,9 @@
63 }" 64 }"
64 %> 65 %>
65 66
66 - <div class='formfield'>  
67 - <%= label(:profile_data, :name, _('Full name'), {:class => 'formlabel'}) %>  
68 - <%= required text_field(:profile_data, :name) %> 67 + <div id='signup-name'>
  68 + <%= labelled_form_field(_('Full name'), text_field(:profile_data, :name)) %>
  69 + <%= content_tag(:small,_('Tell us your name, it will be used to identify yourself.'), :id => 'name-balloon') %>
69 </div> 70 </div>
70 71
71 </div> 72 </div>
@@ -131,6 +132,9 @@ jQuery(function($) { @@ -131,6 +132,9 @@ jQuery(function($) {
131 $('#user_pw').focus(function() { 132 $('#user_pw').focus(function() {
132 $('#password-balloon').fadeIn('slow'); 133 $('#password-balloon').fadeIn('slow');
133 }); 134 });
  135 + $('#user_password_confirmation').focus(function() {
  136 + $('#password-confirmation-balloon').fadeIn('slow');
  137 + });
134 $('#user_password_confirmation, #user_pw').blur(function() { 138 $('#user_password_confirmation, #user_pw').blur(function() {
135 if ($('#user_password_confirmation').val() != '') { 139 if ($('#user_password_confirmation').val() != '') {
136 if ($('#user_password_confirmation').val() == $('#user_pw').val()) { 140 if ($('#user_password_confirmation').val() == $('#user_pw').val()) {
@@ -144,11 +148,24 @@ jQuery(function($) { @@ -144,11 +148,24 @@ jQuery(function($) {
144 } 148 }
145 } 149 }
146 $('#password-balloon').fadeOut('slow'); 150 $('#password-balloon').fadeOut('slow');
  151 + $('#password-confirmation-balloon').fadeOut('slow');
147 }); 152 });
148 $('#user_login').focus(function() { 153 $('#user_login').focus(function() {
149 $('#signup-balloon').fadeIn('slow'); 154 $('#signup-balloon').fadeIn('slow');
150 }); 155 });
151 $('#user_login').blur(function() { $('#signup-balloon').fadeOut('slow'); }); 156 $('#user_login').blur(function() { $('#signup-balloon').fadeOut('slow'); });
152 $('#signup-form').validate({ rules: { 'user[email]': { email: true } }, messages: { 'user[email]' : '' } }); 157 $('#signup-form').validate({ rules: { 'user[email]': { email: true } }, messages: { 'user[email]' : '' } });
  158 + $('#user_email').focus(function() {
  159 + $('#email-balloon').fadeIn('slow');
  160 + });
  161 + $('#user_email').blur(function() {
  162 + $('#email-balloon').fadeOut('slow');
  163 + });
  164 + $('#profile_data_name').focus(function() {
  165 + $('#name-balloon').fadeIn('slow');
  166 + });
  167 + $('#profile_data_name').blur(function() {
  168 + $('#name-balloon').fadeOut('slow');
  169 + });
153 }); 170 });
154 </script> 171 </script>
public/stylesheets/application.css
  Diff comments   View file @4137317
@@ -5828,12 +5828,17 @@ li.profile-activity-item.upload_image .activity-gallery-images-count-1 img { @@ -5828,12 +5828,17 @@ li.profile-activity-item.upload_image .activity-gallery-images-count-1 img {
5828 5828
5829 #signup-form #signup-password, 5829 #signup-form #signup-password,
5830 #signup-form #signup-password-confirmation, 5830 #signup-form #signup-password-confirmation,
  5831 +#signup-form #signup-email,
  5832 +#signup-form #signup-name,
5831 #signup-form #signup-login { 5833 #signup-form #signup-login {
5832 position: relative; 5834 position: relative;
5833 } 5835 }
5834 5836
5835 #signup-form small#signup-balloon, 5837 #signup-form small#signup-balloon,
5836 -#signup-form small#password-balloon { 5838 +#signup-form small#password-balloon,
  5839 +#signup-form small#password-confirmation-balloon,
  5840 +#signup-form small#email-balloon,
  5841 +#signup-form small#name-balloon {
5837 display: none; 5842 display: none;
5838 width: 142px; 5843 width: 142px;
5839 height: 69px; 5844 height: 69px;
@@ -5846,8 +5851,27 @@ li.profile-activity-item.upload_image .activity-gallery-images-count-1 img { @@ -5846,8 +5851,27 @@ li.profile-activity-item.upload_image .activity-gallery-images-count-1 img {
5846 background: transparent url(/images/orange-balloon.png) bottom center no-repeat; 5851 background: transparent url(/images/orange-balloon.png) bottom center no-repeat;
5847 position: absolute; 5852 position: absolute;
5848 z-index: 2; 5853 z-index: 2;
5849 - right: -40px;  
5850 - top: -100px; 5854 + right: 30px;
  5855 +}
  5856 +
  5857 +#signup-form small#signup-balloon {
  5858 + top: -110px;
  5859 +}
  5860 +
  5861 +#signup-form small#password-balloon {
  5862 + top: -75px;
  5863 +}
  5864 +
  5865 +#signup-form small#password-confirmation-balloon {
  5866 + top: -75px;
  5867 +}
  5868 +
  5869 +#signup-form small#email-balloon {
  5870 + top: -75px;
  5871 +}
  5872 +
  5873 +#signup-form small#name-balloon {
  5874 + top: -75px;
5851 } 5875 }
5852 5876
5853 #signup-form .required-field label, 5877 #signup-form .required-field label,