diff options
| -rw-r--r-- | app/assets/stylesheets/pages/profile.scss | 17 | ||||
| -rw-r--r-- | app/views/profiles/show.html.haml | 24 |
2 files changed, 40 insertions, 1 deletions
diff --git a/app/assets/stylesheets/pages/profile.scss b/app/assets/stylesheets/pages/profile.scss index 260179074cf..0cd37e7014f 100644 --- a/app/assets/stylesheets/pages/profile.scss +++ b/app/assets/stylesheets/pages/profile.scss @@ -197,3 +197,20 @@ width: 105px; } } + +.modal-profile-crop { + .modal-dialog { + width: 380px; + } + + .profile-crop-image-container { + width: 350px; + height: 350px; + margin: 0 auto; + } + + .crop-controls { + padding: 10px 0 0 0; + text-align: center; + } +} diff --git a/app/views/profiles/show.html.haml b/app/views/profiles/show.html.haml index cd582ba7060..2d9129470f8 100644 --- a/app/views/profiles/show.html.haml +++ b/app/views/profiles/show.html.haml @@ -26,7 +26,7 @@ %a.btn.js-choose-user-avatar-button Browse file... %span.avatar-file-name.prepend-left-default.js-avatar-filename No file chosen - = f.file_field :avatar, class: "js-user-avatar-input hidden" + = f.file_field :avatar_dialog_trigger, class: "js-user-avatar-input hidden", accept: "image/*" .help-block The maximum file size allowed is 200KB. - if @user.avatar? @@ -94,3 +94,25 @@ .prepend-top-default.append-bottom-default = f.submit 'Update profile settings', class: "btn btn-success" = link_to "Cancel", user_path(current_user), class: "btn btn-cancel" + +.modal.modal-profile-crop + .modal-dialog + .modal-content + .modal-header + %button.close{:type => "button", :'data-dismiss' => "modal"} + %span + × + %h4.modal-title + Position and size your new avatar + .modal-body + .profile-crop-image-container + %img.modal-profile-crop-image + .crop-controls + .btn-group + %button.btn.btn-primary{ data: { method: "zoom", option: "0.1" } } + %span.fa.fa-search-plus + %button.btn.btn-primary{ data: { method: "zoom", option: "-0.1" } } + %span.fa.fa-search-minus + .modal-footer + %button.btn.btn-primary.js-upload-user-avatar{:type => "button"} + Set new profile picture |