diff --git a/app/assets/images/arrow-back.svg b/app/assets/images/arrow-back.svg new file mode 100644 index 000000000..a533edd24 --- /dev/null +++ b/app/assets/images/arrow-back.svg @@ -0,0 +1,3 @@ + + + diff --git a/app/assets/stylesheets/application.css.scss.erb b/app/assets/stylesheets/application.css.scss.erb index 63769c9a1..f5d8ed235 100644 --- a/app/assets/stylesheets/application.css.scss.erb +++ b/app/assets/stylesheets/application.css.scss.erb @@ -43,6 +43,7 @@ @import "instances_table"; @import "file_uploader"; @import "browse"; +@import "lostpassword"; @import "flatpickr/dist/themes/light"; @import "login"; diff --git a/app/assets/stylesheets/lostpassword.scss b/app/assets/stylesheets/lostpassword.scss new file mode 100644 index 000000000..2769eb7b0 --- /dev/null +++ b/app/assets/stylesheets/lostpassword.scss @@ -0,0 +1,69 @@ +.lost-password-form{ + margin-top: 30px; + padding: 37px 41px; + box-shadow: rgba(0, 0, 0, 0.05) 0px 20px 50px; + border-radius: 14px; +} +.lost-password-arrowback{ + all: none; +} +.lost-password-title{ + font-size: 18px; + text-align: center; + font-weight: 700; +} +#lost-password-title-line{ + width: 128px ; + margin: auto !important ; + margin-bottom: 14px !important ; + margin-top: 3px !important ; + border: 1px solid var(--primary-color) !important ; + border-radius: 5px ; +} +.lost-password-description{ + color: #666666; + font-size: 12.5px; + margin-bottom: 14px; + width: 357px; +} +.lost-password-input{ + box-sizing: border-box; + outline: none; + padding: 21px; + font-size: 16px; + border: 1px solid #BDBDBD; + border-radius: 9px; + width: 357px; + +} +.lost-password-input:focus{ + border: 1px solid var(--primary-color); +} +.lost-password-input::placeholder{ + font-weight: 300; + color: #C1C1C1; +} + +.lost-password-input-title{ + font-size: 13px; + margin-bottom: 5px; + font-weight: 600; + color: #666666; +} +.lost-password-button{ + margin-top: 20px; + width: 357px; + font-size: 16px; + color: white; + padding: 21px; + background-color: var(--primary-color); + border: none; + border-radius: 9px; + margin-bottom: 20px; + display: block; +} +.lost-password-button:hover{ + background-color: var(--hover-color); + cursor: pointer; +} + diff --git a/app/controllers/login_controller.rb b/app/controllers/login_controller.rb index 2a9587268..bae176851 100755 --- a/app/controllers/login_controller.rb +++ b/app/controllers/login_controller.rb @@ -75,6 +75,10 @@ def destroy def lost_password end + def lost_password_success + end + + # Sends a new password to the user def send_pass username = params[:user][:account_name] @@ -82,7 +86,7 @@ def send_pass resp = LinkedData::Client::HTTP.post("/users/create_reset_password_token", {username: username, email: email}) if resp.nil? - redirect_to login_index_path, notice: "Please check your email for a message with reset instructions" + redirect_to "/lost_pass_success" else flash[:notice] = resp.errors.first + ". Please try again." redirect_to "/lost_pass" diff --git a/app/views/login/lost_password.html.erb b/app/views/login/lost_password.html.erb deleted file mode 100644 index dbbf4338e..000000000 --- a/app/views/login/lost_password.html.erb +++ /dev/null @@ -1,22 +0,0 @@ -<%= form_for(:user , :url=>{:controller=>'login',:action=>'send_pass'}) do%> - -
- - - - - - - - - - - -
Email: *<%=text_field 'user', :email%>
Account Name: *<%=text_field 'user', :account_name%>
- <%=submit_tag "Email Password Reset Instructions"%> -
-
* required
-
- - -<%end%> \ No newline at end of file diff --git a/app/views/login/lost_password.html.haml b/app/views/login/lost_password.html.haml new file mode 100644 index 000000000..953fb9121 --- /dev/null +++ b/app/views/login/lost_password.html.haml @@ -0,0 +1,15 @@ += form_for(:user , :url=>{:controller=>'login',:action=>'send_pass'}) do + .d-flex.justify-content-center.m-4 + .lost-password-form + .d-flex.justify-content-between + %a{:href => "javascript:javascript:history.go(-1)"} + %img.lost-password-arrowback{:src => "#{asset_path("arrow-back.svg")}"}/ + .lost-password-title-container + %h2.lost-password-title + Recover password + %hr#lost-password-title-line/ + %div + %p.lost-password-description Enter the email associated with your account and we will send an email with instructions to reset your password + %p.lost-password-input-title Email + = text_field 'user', :email,class: "lost-password-input", placeholder: "Enter the email" + %input.lost-password-button{:type => "submit", :value => "Send instructions"}/ diff --git a/app/views/login/lost_password_success.html.haml b/app/views/login/lost_password_success.html.haml new file mode 100644 index 000000000..cfb66b3a9 --- /dev/null +++ b/app/views/login/lost_password_success.html.haml @@ -0,0 +1 @@ += render(CardMessageComponent.new(title:"no-title" ,message: "A password reset email has been sent to your email, please follow the instructions in the email to reset your password.", button_text: "Back home", type:"success")) diff --git a/config/routes.rb b/config/routes.rb index f55d67452..2e74b6fe8 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -145,6 +145,7 @@ # User get '/logout' => 'login#destroy', :as => :logout get '/lost_pass' => 'login#lost_password' + get '/lost_pass_success' => 'login#lost_password_success' get '/reset_password' => 'login#reset_password' post '/accounts/:id/custom_ontologies' => 'users#custom_ontologies', :as => :custom_ontologies get '/login_as/:login_as' => 'login#login_as' , constraints: { login_as: /[\d\w\.\-\%\+ ]+/ }