diff options
Diffstat (limited to 'app/views/profiles')
22 files changed, 584 insertions, 607 deletions
diff --git a/app/views/profiles/accounts/_providers.html.haml b/app/views/profiles/accounts/_providers.html.haml index 6c6fa32f736..6f0c091dfdb 100644 --- a/app/views/profiles/accounts/_providers.html.haml +++ b/app/views/profiles/accounts/_providers.html.haml @@ -1,6 +1,6 @@ -- button_class = 'btn btn-default gl-button gl-mb-3 gl-mr-3' +- button_class = 'btn btn-default gl-button' -%label.label-bold +%label.label-bold.gl-mb-0 = s_('Profiles|Connected Accounts') %p= s_('Profiles|Select a service to sign in with.') - providers.each do |provider| diff --git a/app/views/profiles/accounts/show.html.haml b/app/views/profiles/accounts/show.html.haml index fec5d2d5ff5..799dfaae8c5 100644 --- a/app/views/profiles/accounts/show.html.haml +++ b/app/views/profiles/accounts/show.html.haml @@ -14,90 +14,88 @@ - c.with_body do = html_escape(_('You have set up 2FA for your account! If you lose access to your 2FA device, you can use your recovery codes to access your account. Alternatively, if you upload an SSH key, you can %{anchorOpen}use that key to generate additional recovery codes%{anchorClose}.')) % { anchorOpen: '<a href="%{href}">'.html_safe % { href: help_page_path('user/profile/account/two_factor_authentication', anchor: 'generate-new-recovery-codes-using-ssh') }, anchorClose: '</a>'.html_safe } -.row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = s_('Profiles|Two-factor authentication') +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = s_('Profiles|Two-factor authentication') + %p.gl-text-secondary + = s_("Profiles|Increase your account's security by enabling two-factor authentication (2FA).") + %div %p - = s_("Profiles|Increase your account's security by enabling two-factor authentication (2FA).") - .col-lg-8 - %p - #{_('Status')}: #{current_user.two_factor_enabled? ? _('Enabled') : _('Disabled')} + %span.gl-font-weight-bold + #{_('Status')}: + #{current_user.two_factor_enabled? ? _('Enabled') : _('Disabled')} - if current_user.two_factor_enabled? = render Pajamas::ButtonComponent.new(variant: :confirm, href: profile_two_factor_auth_path) do = _('Manage two-factor authentication') - else - .gl-mb-3 - = render Pajamas::ButtonComponent.new(variant: :confirm, href: profile_two_factor_auth_path, button_options: { data: { qa_selector: 'enable_2fa_button' }}) do - = _('Enable two-factor authentication') - .col-lg-12 - %hr + = render Pajamas::ButtonComponent.new(variant: :confirm, href: profile_two_factor_auth_path, button_options: { data: { qa_selector: 'enable_2fa_button' }}) do + = _('Enable two-factor authentication') - if display_providers_on_profile? - .row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = s_('Profiles|Service sign-in') - %p - = s_('Profiles|Connect a service for sign-in.') - .col-lg-8 - = render 'providers', providers: button_based_providers, group_saml_identities: local_assigns[:group_saml_identities] - .col-lg-12 - %hr + .settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = s_('Profiles|Service sign-in') + %p.gl-text-secondary + = s_('Profiles|Connect a service for sign-in.') + = render 'providers', providers: button_based_providers, group_saml_identities: local_assigns[:group_saml_identities] + - if current_user.can_change_username? - .row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0.warning-title - = s_('Profiles|Change username') - %p - = s_('Profiles|Changing your username can have unintended side effects.') - = succeed '.' do - = link_to _('Learn more'), help_page_path('user/profile/index', anchor: 'change-your-username'), target: '_blank', rel: 'noopener noreferrer' - .col-lg-8 - - data = { initial_username: current_user.username, root_url: root_url, action_url: update_username_profile_path(format: :json) } - #update-username{ data: data } - .col-lg-12 - %hr + .settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0.warning-title + = s_('Profiles|Change username') + %p.gl-text-secondary + = s_('Profiles|Changing your username can have unintended side effects.') + = succeed '.' do + = link_to _('Learn more'), help_page_path('user/profile/index', anchor: 'change-your-username'), target: '_blank', rel: 'noopener noreferrer' + - data = { initial_username: current_user.username, root_url: root_url, action_url: update_username_profile_path(format: :json) } + #update-username{ data: data } - if prevent_delete_account? - .row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0.danger-title - = s_('Profiles|Delete account') - .col-lg-8 - %p - = s_('Profiles|Account deletion is not allowed by your administrator.') + .settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0.danger-title + = s_('Profiles|Delete account') + %p.gl-text-secondary + = s_('Profiles|Account deletion is not allowed by your administrator.') - else - .row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0.danger-title - = s_('Profiles|Delete account') - .col-lg-8 - - if current_user.can_be_removed? && can?(current_user, :destroy_user, current_user) - %p - = s_('Profiles|Deleting an account has the following effects:') - = render 'users/deletion_guidance', user: current_user - - -# Delete button here - = render Pajamas::ButtonComponent.new(variant: :danger, button_options: { id: 'delete-account-button', disabled: true, data: { qa_selector: 'delete_account_button' }}) do + .settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-mt-0.danger-title = s_('Profiles|Delete account') + - if current_user.can_be_removed? && can?(current_user, :destroy_user, current_user) + %p.gl-text-secondary + = s_('Profiles|Deleting an account has the following effects:') + = render 'users/deletion_guidance', user: current_user - #delete-account-modal{ data: { action_url: user_registration_path, - confirm_with_password: ('true' if current_user.confirm_deletion_with_password?), - username: current_user.username } } + -# Delete button here + = render Pajamas::ButtonComponent.new(variant: :danger, button_options: { id: 'delete-account-button', disabled: true, data: { qa_selector: 'delete_account_button' }}) do + = s_('Profiles|Delete account') + + #delete-account-modal{ data: { action_url: user_registration_path, + confirm_with_password: ('true' if current_user.confirm_deletion_with_password?), + username: current_user.username } } + - else + - if current_user.solo_owned_groups.present? + %p + = s_('Profiles|Your account is currently an owner in these groups:') + %ul + - current_user.solo_owned_groups.each do |group| + %li= group.name + %p + = s_('Profiles|You must transfer ownership or delete these groups before you can delete your account.') + - elsif !current_user.can_remove_self? + %p + = s_('Profiles|GitLab is unable to verify your identity automatically. For security purposes, you must set a password by %{openingTag}resetting your password%{closingTag} to delete your account.').html_safe % { openingTag: "<a href='#{reset_profile_password_path}' rel=\"nofollow\" data-method=\"put\">".html_safe, closingTag: '</a>'.html_safe} + %p + = s_('Profiles|If after setting a password, the option to delete your account is still not available, please %{link_start}submit a request%{link_end} to begin the account deletion process.').html_safe % { link_start: '<a href="https://support.gitlab.io/account-deletion/" rel="nofollow noreferrer noopener" target="_blank">'.html_safe, link_end: '</a>'.html_safe} - else - - if current_user.solo_owned_groups.present? - %p - = s_('Profiles|Your account is currently an owner in these groups:') - %strong= current_user.solo_owned_groups.map(&:name).join(', ') - %p - = s_('Profiles|You must transfer ownership or delete these groups before you can delete your account.') - - elsif !current_user.can_remove_self? - %p - = s_('Profiles|GitLab is unable to verify your identity automatically. For security purposes, you must set a password by %{openingTag}resetting your password%{closingTag} to delete your account.').html_safe % { openingTag: "<a href='#{reset_profile_password_path}' rel=\"nofollow\" data-method=\"put\">".html_safe, closingTag: '</a>'.html_safe} - %p - = s_('Profiles|If after setting a password, the option to delete your account is still not available, please %{link_start}submit a request%{link_end} to begin the account deletion process.').html_safe % { link_start: '<a href="https://support.gitlab.io/account-deletion/" rel="nofollow noreferrer noopener" target="_blank">'.html_safe, link_end: '</a>'.html_safe} - - else - %p - = s_("Profiles|You don't have access to delete this user.") -.gl-mb-3 + %p + = s_("Profiles|You don't have access to delete this user.") diff --git a/app/views/profiles/active_sessions/_active_session.html.haml b/app/views/profiles/active_sessions/_active_session.html.haml index 9ec8d694dac..e91c28e6e84 100644 --- a/app/views/profiles/active_sessions/_active_session.html.haml +++ b/app/views/profiles/active_sessions/_active_session.html.haml @@ -27,9 +27,5 @@ - unless is_current_session .float-right - = link_to(revoke_session_path(active_session), - { data: { confirm: _('Are you sure? The device will be signed out of GitLab and all remember me tokens revoked.') }, - method: :delete, - class: "gl-button btn btn-danger gl-ml-3" }) do - %span.sr-only= _('Revoke') + = link_button_to revoke_session_path(active_session), data: { confirm: _('Are you sure? The device will be signed out of GitLab and all remember me tokens revoked.'), confirm_btn_variant: :danger }, method: :delete, class: 'gl-ml-3', variant: :danger, 'aria-label': _('Revoke') do = _('Revoke') diff --git a/app/views/profiles/active_sessions/index.html.haml b/app/views/profiles/active_sessions/index.html.haml index 1952655937e..baca9559e08 100644 --- a/app/views/profiles/active_sessions/index.html.haml +++ b/app/views/profiles/active_sessions/index.html.haml @@ -1,16 +1,15 @@ - page_title _('Active Sessions') - @force_desktop_expanded_sidebar = true -.row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = page_title - %p - = _('This is a list of devices that have logged into your account. Revoke any sessions that you do not recognize.') - .col-lg-8 - .gl-mb-3 +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = page_title + %p.gl-text-secondary + = _('This is a list of devices that have logged into your account. Revoke any sessions that you do not recognize.') - = render Pajamas::CardComponent.new(card_options: { class: 'gl-border-0' }, body_options: { class: 'gl-p-0' }) do |c| - - c.with_body do - %ul.list-group.list-group-flush - = render partial: 'profiles/active_sessions/active_session', collection: @sessions + = render Pajamas::CardComponent.new(card_options: { class: 'gl-border-0' }, body_options: { class: 'gl-p-0' }) do |c| + - c.with_body do + %ul.list-group.list-group-flush + = render partial: 'profiles/active_sessions/active_session', collection: @sessions diff --git a/app/views/profiles/audit_log.html.haml b/app/views/profiles/audit_log.html.haml index 44cfbc1f74f..d47f1ea7c25 100644 --- a/app/views/profiles/audit_log.html.haml +++ b/app/views/profiles/audit_log.html.haml @@ -1,11 +1,12 @@ - page_title _('Authentication log') - @force_desktop_expanded_sidebar = true -.row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = page_title - %p - = _('This is a security log of authentication events involving your account.') - .col-lg-8 - = render 'event_table', events: @events +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = page_title + %p.gl-text-secondary + = _('This is a security log of authentication events involving your account.') + + = render 'event_table', events: @events diff --git a/app/views/profiles/chat_names/_chat_name.html.haml b/app/views/profiles/chat_names/_chat_name.html.haml index afc3894c23b..0ac8ede3c62 100644 --- a/app/views/profiles/chat_names/_chat_name.html.haml +++ b/app/views/profiles/chat_names/_chat_name.html.haml @@ -10,4 +10,4 @@ = _('Never') %td - = link_to _('Remove'), profile_chat_name_path(chat_name), method: :delete, class: 'gl-button btn btn-danger float-right', aria: { label: _('Remove') }, data: { confirm: _('Are you sure you want to remove this nickname?'), confirm_btn_variant: 'danger' } + = link_button_to _('Remove'), profile_chat_name_path(chat_name), method: :delete, class: 'float-right', aria: { label: _('Remove') }, data: { confirm: _('Are you sure you want to remove this nickname?'), confirm_btn_variant: 'danger' }, variant: :danger diff --git a/app/views/profiles/chat_names/index.html.haml b/app/views/profiles/chat_names/index.html.haml index 264ee040d7d..7a63fc30d9c 100644 --- a/app/views/profiles/chat_names/index.html.haml +++ b/app/views/profiles/chat_names/index.html.haml @@ -2,29 +2,27 @@ - @hide_search_settings = true - @force_desktop_expanded_sidebar = true -.row.gl-mt-5.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = page_title - %p - = _('You can see your chat accounts.') +.settings-section.js-search-settings-section.gl-mt-3 + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = page_title - .col-lg-8 - %h5.gl-mt-0 - = sprintf(_('Active chat names (%{count})'), { count: @chat_names.size }) + %h5.gl-font-lg.gl-mt-0 + = sprintf(_('Active chat names (%{count})'), { count: @chat_names.size }) - - if @chat_names.present? - .table-responsive - %table.table - %thead - %tr - %th= _('Team domain') - %th= _('Nickname') - %th= _('Last used') - %th - %tbody - = render @chat_names + - if @chat_names.present? + .table-responsive + %table.table + %thead + %tr + %th= _('Team domain') + %th= _('Nickname') + %th= _('Last used') + %th + %tbody + = render @chat_names - - else - .settings-message.text-center - = _("You don't have any active chat names.") + - else + .gl-text-secondary.settings-message + = _("You don't have any active chat names.") diff --git a/app/views/profiles/comment_templates/index.html.haml b/app/views/profiles/comment_templates/index.html.haml index dd5b43aa802..0692f5d8ebb 100644 --- a/app/views/profiles/comment_templates/index.html.haml +++ b/app/views/profiles/comment_templates/index.html.haml @@ -1,10 +1,11 @@ -- page_title _('Comment Templates') +- page_title _('Comment templates') -#js-comment-templates-root.row.gl-mt-5{ data: { base_path: profile_comment_templates_path } } - .col-lg-4 - %h4.gl-mt-0 - = page_title - %p - = _('Comment templates can be used when creating comments inside issues, merge requests, and epics.') - .col-lg-8 - = gl_loading_icon(size: 'lg') +#js-comment-templates-root.settings-section.gl-mt-3{ data: { base_path: profile_comment_templates_path } } + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = page_title + %p.gl-text-secondary + = _('Comment templates can be used when creating comments inside issues, merge requests, and epics.') + + = gl_loading_icon(size: 'lg') diff --git a/app/views/profiles/emails/index.html.haml b/app/views/profiles/emails/index.html.haml index c16f3c3b12b..743c26260e4 100644 --- a/app/views/profiles/emails/index.html.haml +++ b/app/views/profiles/emails/index.html.haml @@ -1,24 +1,26 @@ - page_title _('Emails') - @force_desktop_expanded_sidebar = true -.row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = page_title - %p - = _('Control emails linked to your account') - .col-lg-8 - %h4.gl-mt-0 - = _('Add email address') +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = _('Add email address') + %p.gl-text-secondary + = _('Control emails linked to your account') + %div = gitlab_ui_form_for 'email', url: profile_emails_path do |f| .form-group = f.label :email, _('Email'), class: 'label-bold' = f.text_field :email, class: 'form-control gl-form-input', data: { qa_selector: 'email_address_field' } .gl-mt-3 = f.submit _('Add email address'), data: { qa_selector: 'add_email_address_button' }, pajamas_button: true - %hr - %h4.gl-mt-0 - = _('Linked emails (%{email_count})') % { email_count: @emails.load.size } + +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = _('Linked emails (%{email_count})') % { email_count: @emails.load.size } .account-well.gl-mb-3 %ul %li @@ -59,8 +61,6 @@ .gl-display-flex.gl-justify-content-end.gl-align-items-flex-end.gl-flex-grow-1.gl-flex-wrap-reverse.gl-gap-3 - unless email.confirmed? - confirm_title = "#{email.confirmation_sent_at ? _('Resend confirmation email') : _('Send confirmation email')}" - = link_to confirm_title, resend_confirmation_instructions_profile_email_path(email), method: :put, class: 'gl-button btn btn-sm btn-default' + = link_button_to confirm_title, resend_confirmation_instructions_profile_email_path(email), method: :put, size: :small - = link_to profile_email_path(email), data: { confirm: _('Are you sure?'), qa_selector: 'delete_email_link'}, method: :delete, class: 'gl-button btn btn-sm btn-danger' do - %span.sr-only= _('Remove') - = sprite_icon('remove') + = link_button_to nil, profile_email_path(email), data: { confirm: _('Are you sure?'), qa_selector: 'delete_email_link'}, method: :delete, variant: :danger, size: :small, icon: 'remove', 'aria-label': _('Remove') diff --git a/app/views/profiles/gpg_keys/_key.html.haml b/app/views/profiles/gpg_keys/_key.html.haml index d52b16814c0..d8b8dda29dc 100644 --- a/app/views/profiles/gpg_keys/_key.html.haml +++ b/app/views/profiles/gpg_keys/_key.html.haml @@ -19,9 +19,6 @@ .float-right %span.key-created-at = html_escape(s_('Profiles|Created %{time_ago}')) % { time_ago: time_ago_with_tooltip(key.created_at) } - = link_to profile_gpg_key_path(key), data: { confirm: _('Are you sure? Removing this GPG key does not affect already signed commits.') }, method: :delete, class: "gl-button btn btn-icon btn-danger gl-ml-3" do - %span.sr-only= _('Remove') - = sprite_icon('remove') - = link_to revoke_profile_gpg_key_path(key), data: { confirm: _('Are you sure? All commits that were signed with this GPG key will be unverified.') }, method: :put, class: "gl-button btn btn-danger gl-ml-3" do - %span.sr-only= _('Revoke') + = link_button_to nil, profile_gpg_key_path(key), data: { confirm: _('Are you sure? Removing this GPG key does not affect already signed commits.') }, method: :delete, class: 'gl-ml-3', variant: :danger, icon: 'remove', 'aria-label': _('Remove') + = link_button_to revoke_profile_gpg_key_path(key), data: { confirm: _('Are you sure? All commits that were signed with this GPG key will be unverified.') }, method: :put, class: 'gl-ml-3', variant: :danger, 'aria-label': _('Revoke') do = _('Revoke') diff --git a/app/views/profiles/gpg_keys/index.html.haml b/app/views/profiles/gpg_keys/index.html.haml index b21a4da16b9..2dfd6c7860f 100644 --- a/app/views/profiles/gpg_keys/index.html.haml +++ b/app/views/profiles/gpg_keys/index.html.haml @@ -2,21 +2,25 @@ - add_page_specific_style 'page_bundles/profile' - @force_desktop_expanded_sidebar = true -.row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = page_title - %p - = _('GPG keys allow you to verify signed commits.') - .col-lg-8 - %h5.gl-mt-0 - = _('Add a GPG key') - %p.profile-settings-content - - help_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path('user/project/repository/gpg_signed_commits/index.md') } - = _('Add a GPG key for secure access to GitLab. %{help_link_start}Learn more.%{help_link_end}').html_safe % {help_link_start: help_link_start, help_link_end: '</a>'.html_safe } - = render 'form' - %hr - %h5 - = _('Your GPG keys (%{count})') % { count: @gpg_keys.count } - .gl-mb-3 - = render 'key_table' +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = page_title + %p.gl-text-secondary + = _('GPG keys allow you to verify signed commits.') + + %h5.gl-font-lg.gl-mt-0 + = _('Add a GPG key') + %p + - help_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path('user/project/repository/gpg_signed_commits/index.md') } + = _('Add a GPG key for secure access to GitLab. %{help_link_start}Learn more%{help_link_end}.').html_safe % {help_link_start: help_link_start, help_link_end: '</a>'.html_safe } + = render 'form' + +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = _('Your GPG keys (%{count})') % { count: @gpg_keys.count } + .gl-mb-3 + = render 'key_table' diff --git a/app/views/profiles/keys/_key_details.html.haml b/app/views/profiles/keys/_key_details.html.haml index 4f3d97fb90c..f1d5a127728 100644 --- a/app/views/profiles/keys/_key_details.html.haml +++ b/app/views/profiles/keys/_key_details.html.haml @@ -14,13 +14,13 @@ %strong= ssh_key_usage_types.invert[@key.usage_type] %li %span.light= _('Created on:') - %strong= @key.created_at.to_s(:medium) + %strong= @key.created_at.to_fs(:medium) %li %span.light= _('Expires:') - %strong= @key.expires_at.try(:to_s, :medium) || _('Never') + %strong= @key.expires_at&.to_fs(:medium) || _('Never') %li %span.light= _('Last used on:') - %strong= @key.last_used_at.try(:to_s, :medium) || _('Never') + %strong= @key.last_used_at&.to_fs(:medium) || _('Never') .col-md-8 = form_errors(@key, type: 'key') unless @key.valid? diff --git a/app/views/profiles/keys/index.html.haml b/app/views/profiles/keys/index.html.haml index e7c0cf813b5..c2e65dcc8ef 100644 --- a/app/views/profiles/keys/index.html.haml +++ b/app/views/profiles/keys/index.html.haml @@ -2,27 +2,27 @@ - add_page_specific_style 'page_bundles/profile' - @force_desktop_expanded_sidebar = true -.row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = page_title - %p - = _('SSH keys allow you to establish a secure connection between your computer and GitLab.') - %br - %h4.gl-mt-0 - = _('SSH Fingerprints') - %p - - config_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_instance_configuration_url } - = html_escape(s_('SSH fingerprints verify that the client is connecting to the correct host. Check the %{config_link_start}current instance configuration%{config_link_end}.')) % { config_link_start: config_link_start, config_link_end: '</a>'.html_safe } - .col-lg-8 - %h5.gl-mt-0 - = _('Add an SSH key') - %p.profile-settings-content - - help_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path('user/ssh.md') } - = _('Add an SSH key for secure access to GitLab. %{help_link_start}Learn more.%{help_link_end}').html_safe % {help_link_start: help_link_start, help_link_end: '</a>'.html_safe } - = render 'form' - %hr - %h5 - = _('Your SSH keys (%{count})') % { count: @keys.count } - .gl-mb-3 - = render 'key_table' +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = page_title + %p.gl-text-secondary + = _('SSH keys allow you to establish a secure connection between your computer and GitLab.') + - config_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_instance_configuration_url } + = html_escape(s_('SSH fingerprints verify that the client is connecting to the correct host. Check the %{config_link_start}current instance configuration%{config_link_end}.')) % { config_link_start: config_link_start, config_link_end: '</a>'.html_safe } + + %h5.gl-font-lg.gl-mt-0 + = _('Add an SSH key') + %p + - help_link_start = '<a href="%{url}" target="_blank" rel="noopener noreferrer">'.html_safe % { url: help_page_path('user/ssh.md') } + = _('Add an SSH key for secure access to GitLab. %{help_link_start}Learn more%{help_link_end}.').html_safe % {help_link_start: help_link_start, help_link_end: '</a>'.html_safe } + = render 'form' + +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = _('Your SSH keys (%{count})') % { count: @keys.count } + .gl-mb-3 + = render 'key_table' diff --git a/app/views/profiles/notifications/_email_settings.html.haml b/app/views/profiles/notifications/_email_settings.html.haml index cd7a7ced1d4..60f366f8878 100644 --- a/app/views/profiles/notifications/_email_settings.html.haml +++ b/app/views/profiles/notifications/_email_settings.html.haml @@ -1,7 +1,6 @@ - form = local_assigns.fetch(:form) -.form-group - .js-notification-email-listbox-input{ data: { label: _('Notification Email'), name: 'user[notification_email]', emails: @user.public_verified_emails.to_json, empty_value_text: _('Use primary email (%{email})') % { email: @user.email }, value: @user.notification_email, disabled: local_assigns.fetch(:email_change_disabled, nil) } } - .help-block - = local_assigns.fetch(:help_text, nil) +.js-notification-email-listbox-input.gl-mb-3{ data: { label: _('Global notification email'), name: 'user[notification_email]', emails: @user.public_verified_emails.to_json, empty_value_text: _('Use primary email (%{email})') % { email: @user.email }, value: @user.notification_email, disabled: local_assigns.fetch(:email_change_disabled, nil) } } +.help-block + = local_assigns.fetch(:help_text, nil) .form-group = form.gitlab_ui_checkbox_component :email_opted_in, _('Receive product marketing emails') diff --git a/app/views/profiles/notifications/_group_settings.html.haml b/app/views/profiles/notifications/_group_settings.html.haml index 898762ca78a..1878634e56c 100644 --- a/app/views/profiles/notifications/_group_settings.html.haml +++ b/app/views/profiles/notifications/_group_settings.html.haml @@ -1,17 +1,15 @@ - emails_disabled = group.emails_disabled? -.gl-responsive-table-row.notification-list-item - .table-section.section-40 - %span.notification.gl-mr-2 +.notification-list-item.gl-md-display-flex.gl-justify-content-space-between.gl-align-items-center.gl-px-3.gl-py-4 + .gl-mb-2.gl-md-mb-0 + %span.gl-mr-2 = notification_icon(notification_icon_level(setting, emails_disabled)) - %span.str-truncated + %span = link_to group.name, group_path(group) - .table-section.section-30.text-right + .gl-display-flex.gl-gap-3.gl-flex-wrap - if setting - .js-vue-notification-dropdown{ data: { disabled: emails_disabled.to_s, dropdown_items: notification_dropdown_items(setting).to_json, notification_level: setting.level, group_id: group.id, container_class: 'gl-mr-3', show_label: "true" } } - - .table-section.section-30 + .js-vue-notification-dropdown{ data: { disabled: emails_disabled.to_s, dropdown_items: notification_dropdown_items(setting).to_json, notification_level: setting.level, group_id: group.id, show_label: "true" } } = form_for setting, url: profile_group_notifications_path(group), method: :put, html: { class: 'update-notifications gl-display-flex' } do |f| - .js-notification-email-listbox-input{ data: { name: 'notification_setting[notification_email]', emails: @user.public_verified_emails.to_json, empty_value_text: _('Global notification email') , value: setting.notification_email } } + .js-notification-email-listbox-input{ data: { name: 'notification_setting[notification_email]', emails: @user.public_verified_emails.to_json, empty_value_text: _('Global notification email') , value: setting.notification_email, placement: 'right' } } diff --git a/app/views/profiles/notifications/_project_settings.html.haml b/app/views/profiles/notifications/_project_settings.html.haml index e6953d1b32e..955449f0ba1 100644 --- a/app/views/profiles/notifications/_project_settings.html.haml +++ b/app/views/profiles/notifications/_project_settings.html.haml @@ -1,12 +1,13 @@ - emails_disabled = project.emails_disabled? -%li.notification-list-item - %span.notification.gl-mr-2 - = notification_icon(notification_icon_level(setting, emails_disabled)) +.notification-list-item.gl-md-display-flex.gl-justify-content-space-between.gl-align-items-center.gl-px-3.gl-py-4 + .gl-mb-2.gl-md-mb-0 + %span.gl-mr-2 + = notification_icon(notification_icon_level(setting, emails_disabled)) - %span.str-truncated - = link_to_project(project) + %span + = link_to_project(project) - .float-right + .gl-display-flex.gl-gap-3.gl-flex-wrap - if setting .js-vue-notification-dropdown{ data: { disabled: emails_disabled.to_s, dropdown_items: notification_dropdown_items(setting).to_json, notification_level: setting.level, project_id: project.id, container_class: 'gl-mr-3', show_label: "true" } } diff --git a/app/views/profiles/notifications/show.html.haml b/app/views/profiles/notifications/show.html.haml index 06d37787d2e..2c7ef2b7e0e 100644 --- a/app/views/profiles/notifications/show.html.haml +++ b/app/views/profiles/notifications/show.html.haml @@ -2,55 +2,59 @@ - page_title _('Notifications') - @force_desktop_expanded_sidebar = true -%div - - if @user.errors.any? - = render Pajamas::AlertComponent.new(variant: :danger) do |c| - - c.with_body do - %ul - - @user.errors.full_messages.each do |msg| - %li= msg - - = hidden_field_tag :notification_type, 'global' - .row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 +- if @user.errors.any? + = render Pajamas::AlertComponent.new(variant: :danger) do |c| + - c.with_body do + %ul + - @user.errors.full_messages.each do |msg| + %li= msg + += hidden_field_tag :notification_type, 'global' +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 = page_title - %p - = _('You can specify notification level per group or per project.') - %p - = _('By default, all projects and groups will use the global notifications setting.') - .col-lg-8 - %h5.gl-mt-0 - = _('Global notification settings') - - = gitlab_ui_form_for @user, url: profile_notifications_path, method: :put, html: { class: 'update-notifications gl-mt-3' } do |f| - = render_if_exists 'profiles/notifications/email_settings', form: f - - = label_tag :global_notification_level, _('Global notification level'), class: "label-bold" - %br - .clearfix - .form-group.float-left.global-notification-setting - - if @global_notification_setting - .js-vue-notification-dropdown{ data: { dropdown_items: notification_dropdown_items(@global_notification_setting).to_json, notification_level: @global_notification_setting.level, help_page_path: help_page_path('user/profile/notifications'), show_label: 'true' } } - - .clearfix - - = gitlab_ui_form_for @user, url: profile_notifications_path, method: :put do |f| - .form-group - = f.gitlab_ui_checkbox_component :notified_of_own_activity, _('Receive notifications about your own activity') - - %hr - %h5 - = _('Groups (%{count})') % { count: @user_groups.total_count } - %div - - @group_notifications.each do |setting| - = render 'group_settings', setting: setting, group: setting.source - = paginate @user_groups, theme: 'gitlab' - %h5 - = _('Projects (%{count})') % { count: @project_notifications.size } - %p.account-well - = _('To specify the notification level per project of a group you belong to, you need to visit project page and change notification level there.') - .gl-mb-3 - %ul.bordered-list + %p.gl-text-secondary + = _('You can specify notification level per group or per project.') + + .gl-mt-0 + = gitlab_ui_form_for @user, url: profile_notifications_path, method: :put, html: { class: 'update-notifications gl-mt-3' } do |f| + = render_if_exists 'profiles/notifications/email_settings', form: f + + = label_tag :global_notification_level, _('Global notification level'), class: "label-bold gl-mb-0" + .gl-text-secondary.gl-mb-3 + = _('By default, all projects and groups use the global notifications setting.') + + .form-group.global-notification-setting.gl-mb-3 + - if @global_notification_setting + .js-vue-notification-dropdown{ data: { dropdown_items: notification_dropdown_items(@global_notification_setting).to_json, notification_level: @global_notification_setting.level, help_page_path: help_page_path('user/profile/notifications'), show_label: 'true' } } + + = gitlab_ui_form_for @user, url: profile_notifications_path, method: :put do |f| + .form-group + = f.gitlab_ui_checkbox_component :notified_of_own_activity, _('Receive notifications about your own activity') + + = render Pajamas::CardComponent.new(card_options: { class: 'gl-new-card' }, header_options: { class: 'gl-new-card-header'}, body_options: { class: 'gl-new-card-body' }) do |c| + - c.with_header do + %h3.gl-new-card-title + = _('Groups (%{count})') % { count: @user_groups.total_count } + - c.with_body do + - if @user_groups.total_count > 0 + - @group_notifications.each do |setting| + = render 'group_settings', setting: setting, group: setting.source + = paginate @user_groups, theme: 'gitlab' + - else + .gl-new-card-empty.gl-px-3.gl-py-4= _("You do not belong to any groups yet.") + + = render Pajamas::CardComponent.new(card_options: { class: 'gl-new-card' }, header_options: { class: 'gl-new-card-header gl-display-block'}, body_options: { class: 'gl-new-card-body' }) do |c| + - c.with_header do + %h3.gl-new-card-title + = _('Projects (%{count})') % { count: @project_notifications.size } + .gl-new-card-description + = _('To specify the notification level per project of a group you belong to, visit the project page and change the notification level there.') + - c.with_body do + - if @project_notifications.size > 0 - @project_notifications.each do |setting| = render 'project_settings', setting: setting, project: setting.source + - else + .gl-new-card-empty.gl-px-3.gl-py-4= _("You do not belong to any projects yet.") diff --git a/app/views/profiles/passwords/edit.html.haml b/app/views/profiles/passwords/edit.html.haml index 4fdf80c1eb1..4848a9dc595 100644 --- a/app/views/profiles/passwords/edit.html.haml +++ b/app/views/profiles/passwords/edit.html.haml @@ -2,36 +2,34 @@ - page_title _('Password') - @force_desktop_expanded_sidebar = true -.row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = page_title - %p - = _('After a successful password update, you will be redirected to the login page where you can log in with your new password.') - .col-lg-8 - %h5.gl-mt-0 - - if @user.password_automatically_set - = _('Change your password') - - else - = _('Change your password or recover your current one') - = gitlab_ui_form_for @user, url: profile_password_path, method: :put, html: {class: "update-password"} do |f| - = form_errors(@user) +.settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = page_title + %p.gl-text-secondary + - if @user.password_automatically_set + = _('Change your password.') + - else + = _('Change your password or recover your current one.') + = gitlab_ui_form_for @user, url: profile_password_path, method: :put, html: {class: "update-password"} do |f| + = form_errors(@user) - - unless @user.password_automatically_set? - .form-group - = f.label :password, _('Current password'), class: 'label-bold' - = f.password_field :password, required: true, autocomplete: 'current-password', class: 'form-control gl-form-input', data: { qa_selector: 'current_password_field' } - %p.form-text.text-muted - = _('You must provide your current password in order to change it.') - .form-group - = f.label :new_password, _('New password'), class: 'label-bold' - = f.password_field :new_password, required: true, autocomplete: 'new-password', class: 'form-control gl-form-input js-password-complexity-validation', data: { qa_selector: 'new_password_field' } - = render_if_exists 'shared/password_requirements_list' + - unless @user.password_automatically_set? .form-group - = f.label :password_confirmation, _('Password confirmation'), class: 'label-bold' - = f.password_field :password_confirmation, required: true, autocomplete: 'new-password', class: 'form-control gl-form-input', data: { qa_selector: 'confirm_password_field' } - .gl-mt-3.gl-mb-3 - = f.submit _('Save password'), class: "gl-mr-3", data: { qa_selector: 'save_password_button' }, pajamas_button: true - - unless @user.password_automatically_set? - = render Pajamas::ButtonComponent.new(href: reset_profile_password_path, variant: :link, method: :put) do - = _('I forgot my password') + = f.label :password, _('Current password'), class: 'label-bold' + = f.password_field :password, required: true, autocomplete: 'current-password', class: 'form-control gl-form-input gl-max-w-80', data: { qa_selector: 'current_password_field' } + %p.form-text.text-muted + = _('You must provide your current password in order to change it.') + .form-group + = f.label :new_password, _('New password'), class: 'label-bold' + = f.password_field :new_password, required: true, autocomplete: 'new-password', class: 'form-control gl-form-input js-password-complexity-validation gl-max-w-80', data: { qa_selector: 'new_password_field' } + = render_if_exists 'shared/password_requirements_list' + .form-group + = f.label :password_confirmation, _('Password confirmation'), class: 'label-bold' + = f.password_field :password_confirmation, required: true, autocomplete: 'new-password', class: 'form-control gl-form-input gl-max-w-80', data: { qa_selector: 'confirm_password_field' } + .gl-mt-3.gl-mb-3 + = f.submit _('Save password'), class: "gl-mr-3", data: { qa_selector: 'save_password_button' }, pajamas_button: true + - unless @user.password_automatically_set? + = render Pajamas::ButtonComponent.new(href: reset_profile_password_path, variant: :link, method: :put) do + = _('I forgot my password') diff --git a/app/views/profiles/personal_access_tokens/index.html.haml b/app/views/profiles/personal_access_tokens/index.html.haml index 57c0badd033..5020f6cbb22 100644 --- a/app/views/profiles/personal_access_tokens/index.html.haml +++ b/app/views/profiles/personal_access_tokens/index.html.haml @@ -4,27 +4,26 @@ - type_plural = _('personal access tokens') - @force_desktop_expanded_sidebar = true -.row.gl-mt-3.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = page_title - %p - = s_('AccessTokens|You can generate a personal access token for each application you use that needs access to the GitLab API.') - %p - = s_('AccessTokens|You can also use personal access tokens to authenticate against Git over HTTP.') - = s_('AccessTokens|They are the only accepted password when you have Two-Factor Authentication (2FA) enabled.') +.settings-section.settings-section-no-bottom.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = page_title + %p.gl-text-secondary + = s_('AccessTokens|You can generate a personal access token for each application you use that needs access to the GitLab API.') + = s_('AccessTokens|You can also use personal access tokens to authenticate against Git over HTTP.') + = s_('AccessTokens|They are the only accepted password when you have Two-Factor Authentication (2FA) enabled.') - .col-lg-8 - #js-new-access-token-app{ data: { access_token_type: type } } + #js-new-access-token-app{ data: { access_token_type: type } } - = render 'shared/access_tokens/form', - ajax: true, - type: type, - path: profile_personal_access_tokens_path, - token: @personal_access_token, - scopes: @scopes, - help_path: help_page_path('user/profile/personal_access_tokens.md', anchor: 'personal-access-token-scopes') + = render 'shared/access_tokens/form', + ajax: true, + type: type, + path: profile_personal_access_tokens_path, + token: @personal_access_token, + scopes: @scopes, + help_path: help_page_path('user/profile/personal_access_tokens.md', anchor: 'personal-access-token-scopes') - #js-access-token-table-app{ data: { access_token_type: type, access_token_type_plural: type_plural, initial_active_access_tokens: @active_access_tokens.to_json } } + #js-access-token-table-app{ data: { access_token_type: type, access_token_type_plural: type_plural, initial_active_access_tokens: @active_access_tokens.to_json } } #js-tokens-app{ data: { tokens_data: tokens_app_data } } diff --git a/app/views/profiles/preferences/show.html.haml b/app/views/profiles/preferences/show.html.haml index a085840ee84..e5e7c1dc3f4 100644 --- a/app/views/profiles/preferences/show.html.haml +++ b/app/views/profiles/preferences/show.html.haml @@ -11,165 +11,152 @@ = stylesheet_link_tag "themes/#{theme.css_filename}" if theme.css_filename = gitlab_ui_form_for @user, url: profile_preferences_path, remote: true, method: :put, html: { id: "profile-preferences-form" } do |f| - .row.gl-mt-3.js-preferences-form.js-search-settings-section - .col-lg-4.application-theme#navigation-theme - %h4.gl-mt-0 - = s_('Preferences|Color theme') + .settings-section.js-preferences-form.js-search-settings-section.application-theme#navigation-theme + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = s_('Preferences|Color theme') + %p.gl-text-secondary + = s_('Preferences|Customize the color of GitLab.') + - if show_super_sidebar? %p - = s_('Preferences|Customize the color of GitLab.') - - if show_super_sidebar? - %p - = s_('Preferences|Note: You have the new navigation enabled, so only Dark Mode theme significantly changes GitLab\'s appearance.') - .col-lg-8.application-theme - .row - - Gitlab::Themes.each do |theme| - %label.col-6.col-sm-4.col-md-3.gl-mb-5.gl-text-center - .preview{ class: theme.css_class } - = f.gitlab_ui_radio_component :theme_id, theme.id, - theme.name, - radio_options: { checked: user_theme_id == theme.id } + = s_('Preferences|Note: You have the new navigation enabled, so only Dark Mode theme significantly changes GitLab\'s appearance.') + .application-theme.row + - Gitlab::Themes.each do |theme| + %label.col-6.col-sm-4.col-md-3.col-xl-2.gl-mb-5 + .preview{ class: theme.css_class } + = f.gitlab_ui_radio_component :theme_id, theme.id, + theme.name, + radio_options: { checked: user_theme_id == theme.id } - .col-sm-12 - %hr - - .row.js-preferences-form.js-search-settings-section - .col-lg-4.profile-settings-sidebar#syntax-highlighting-theme - %h4.gl-mt-0 - = s_('Preferences|Syntax highlighting theme') - %p - = s_('Preferences|Customize the appearance of the syntax.') - = succeed '.' do - = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'syntax-highlighting-theme'), target: '_blank', rel: 'noopener noreferrer' - .col-lg-8.syntax-theme + .settings-section.js-preferences-form.js-search-settings-section#syntax-highlighting-theme + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = s_('Preferences|Syntax highlighting theme') + %p.gl-text-secondary + = s_('Preferences|Customize the appearance of the syntax.') + = succeed '.' do + = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'syntax-highlighting-theme'), target: '_blank', rel: 'noopener noreferrer' + .syntax-theme.row - Gitlab::ColorSchemes.each do |scheme| - = label_tag do + %label.col-6.col-sm-4.col-md-3.col-lg-auto.gl-mb-5 .preview= image_tag "#{scheme.css_class}-scheme-preview.png" = f.gitlab_ui_radio_component :color_scheme_id, scheme.id, - scheme.name, - radio_options: { checked: user_color_schema_id == scheme.id } + scheme.name, + radio_options: { checked: user_color_schema_id == scheme.id } - .col-sm-12 - %hr + .settings-section.js-preferences-form.js-search-settings-section#diffs-colors + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = s_('Preferences|Diff colors') + %p.gl-text-secondary + = s_('Preferences|Customize the colors of removed and added lines in diffs.') + .form-group + #js-profile-preferences-diffs-colors-app{ data: user_diffs_colors } - .row.js-preferences-form.js-search-settings-section - .col-lg-4.profile-settings-sidebar#diffs-colors - %h4.gl-mt-0 - = s_('Preferences|Diff colors') - %p - = s_('Preferences|Customize the colors of removed and added lines in diffs.') - .col-lg-8 - .form-group - #js-profile-preferences-diffs-colors-app{ data: user_diffs_colors } + .settings-section.js-preferences-form.js-search-settings-section#behavior + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = s_('Preferences|Behavior') + %p.gl-text-secondary + = s_('Preferences|Customize the behavior of the system layout and default views.') + = succeed '.' do + = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'behavior'), target: '_blank', rel: 'noopener noreferrer' + .form-group + = f.label :layout, class: 'label-bold' do + = s_('Preferences|Layout width') + = f.select :layout, layout_choices, {}, class: 'gl-form-select custom-select' + .form-text.text-muted + = s_('Preferences|Choose between fixed (max. 1280px) and fluid (%{percentage}) application layout.').html_safe % { percentage: '100%' } + .js-listbox-input{ data: { label: s_('Preferences|Homepage'), description: s_('Preferences|Choose what content you want to see by default on your homepage.'), name: 'user[dashboard]', items: dashboard_choices.to_json, value: current_user.dashboard, block: true.to_s, fluid_width: true.to_s } } - .col-sm-12 - %hr + = render_if_exists 'profiles/preferences/group_overview_selector', f: f # EE-specific - .row.js-preferences-form.js-search-settings-section - .col-lg-4.profile-settings-sidebar#behavior - %h4.gl-mt-0 - = s_('Preferences|Behavior') - %p - = s_('Preferences|Customize the behavior of the system layout and default views.') - = succeed '.' do - = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'behavior'), target: '_blank', rel: 'noopener noreferrer' - .col-lg-8 - .form-group - = f.label :layout, class: 'label-bold' do - = s_('Preferences|Layout width') - = f.select :layout, layout_choices, {}, class: 'gl-form-select custom-select' - .form-text.text-muted - = s_('Preferences|Choose between fixed (max. 1280px) and fluid (%{percentage}) application layout.').html_safe % { percentage: '100%' } - .js-listbox-input{ data: { label: s_('Preferences|Homepage'), description: s_('Preferences|Choose what content you want to see by default on your homepage.'), name: 'user[dashboard]', items: dashboard_choices.to_json, value: current_user.dashboard } } + .form-group + = f.label :project_view, class: 'label-bold' do + = s_('Preferences|Project overview content') + = f.select :project_view, project_view_choices, {}, class: 'gl-form-select custom-select' + .form-text.text-muted + = s_('Preferences|Choose what content you want to see on a project’s overview page.') + .form-group + = f.gitlab_ui_checkbox_component :project_shortcut_buttons, s_('Preferences|Show shortcut buttons above files on project overview') + .form-group + = f.gitlab_ui_checkbox_component :render_whitespace_in_code, s_('Preferences|Render whitespace characters in the Web IDE') + .form-group + = f.gitlab_ui_checkbox_component :show_whitespace_in_diffs, s_('Preferences|Show whitespace changes in diffs') + .form-group + = f.gitlab_ui_checkbox_component :view_diffs_file_by_file, + s_("Preferences|Show one file at a time on merge request's Changes tab"), + help_text: s_("Preferences|Instead of all the files changed, show only one file at a time. To switch between files, use the file browser.") + .form-group + - supported_characters = %w(" ' ` ( [ { < * _).map { |char| "<code>#{char}</code>" }.join(', ') + = f.gitlab_ui_checkbox_component :markdown_surround_selection, + s_('Preferences|Surround text selection when typing quotes or brackets'), + help_text: sprintf(s_("Preferences|When you type in a description or comment box, selected text is surrounded by the corresponding character after typing one of the following characters: %{supported_characters}."), { supported_characters: supported_characters }).html_safe + .form-group + = f.gitlab_ui_checkbox_component :markdown_automatic_lists, + s_('Preferences|Automatically add new list items'), + help_text: html_escape(s_('Preferences|When you type in a description or comment box, pressing %{kbdOpen}Enter%{kbdClose} in a list adds a new item below.')) % { kbdOpen: '<kbd>'.html_safe, kbdClose: '</kbd>'.html_safe } - = render_if_exists 'profiles/preferences/group_overview_selector', f: f # EE-specific + .form-group + = f.label :tab_width, s_('Preferences|Tab width'), class: 'label-bold' + = f.number_field :tab_width, + class: 'form-control gl-form-input', + min: Gitlab::TabWidth::MIN, + max: Gitlab::TabWidth::MAX, + required: true + .form-text.text-muted + = s_('Preferences|Must be a number between %{min} and %{max}') % { min: Gitlab::TabWidth::MIN, max: Gitlab::TabWidth::MAX } - .form-group - = f.label :project_view, class: 'label-bold' do - = s_('Preferences|Project overview content') - = f.select :project_view, project_view_choices, {}, class: 'gl-form-select custom-select' - .form-text.text-muted - = s_('Preferences|Choose what content you want to see on a project’s overview page.') - .form-group - = f.gitlab_ui_checkbox_component :project_shortcut_buttons, s_('Preferences|Show shortcut buttons above files on project overview') - .form-group - = f.gitlab_ui_checkbox_component :render_whitespace_in_code, s_('Preferences|Render whitespace characters in the Web IDE') - .form-group - = f.gitlab_ui_checkbox_component :show_whitespace_in_diffs, s_('Preferences|Show whitespace changes in diffs') - .form-group - = f.gitlab_ui_checkbox_component :view_diffs_file_by_file, - s_("Preferences|Show one file at a time on merge request's Changes tab"), - help_text: s_("Preferences|Instead of all the files changed, show only one file at a time. To switch between files, use the file browser.") - .form-group - - supported_characters = %w(" ' ` ( [ { < * _).map { |char| "<code>#{char}</code>" }.join(', ') - = f.gitlab_ui_checkbox_component :markdown_surround_selection, - s_('Preferences|Surround text selection when typing quotes or brackets'), - help_text: sprintf(s_("Preferences|When you type in a description or comment box, selected text is surrounded by the corresponding character after typing one of the following characters: %{supported_characters}."), { supported_characters: supported_characters }).html_safe - .form-group - = f.gitlab_ui_checkbox_component :markdown_automatic_lists, - s_('Preferences|Automatically add new list items'), - help_text: html_escape(s_('Preferences|When you type in a description or comment box, pressing %{kbdOpen}Enter%{kbdClose} in a list adds a new item below.')) % { kbdOpen: '<kbd>'.html_safe, kbdClose: '</kbd>'.html_safe } + .settings-section.js-preferences-form.js-search-settings-section#localization + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = _('Localization') + %p.gl-text-secondary + = _('Customize language and region related settings.') + = succeed '.' do + = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'localization'), target: '_blank', rel: 'noopener noreferrer' + .js-listbox-input{ data: { label: _('Language'), description: s_('Preferences|This feature is experimental and translations are not yet complete.'), name: 'user[preferred_language]', items: language_choices.to_json, value: current_user.preferred_language, block: true.to_s, fluid_width: true.to_s } } + %p.gl-mt-n5 + = link_to help_page_url('development/i18n/translation'), class: 'text-nowrap', target: '_blank', rel: 'noopener noreferrer' do + = _("Help translate GitLab into your language") + %span{ aria: { label: _('Open new window') } } + = sprite_icon('external-link') + .form-group + = f.label :first_day_of_week, class: 'label-bold' do + = _('First day of the week') + = f.select :first_day_of_week, first_day_of_week_choices_with_default, {}, class: 'gl-form-select custom-select' - .form-group - = f.label :tab_width, s_('Preferences|Tab width'), class: 'label-bold' - = f.number_field :tab_width, - class: 'form-control gl-form-input', - min: Gitlab::TabWidth::MIN, - max: Gitlab::TabWidth::MAX, - required: true - .form-text.text-muted - = s_('Preferences|Must be a number between %{min} and %{max}') % { min: Gitlab::TabWidth::MIN, max: Gitlab::TabWidth::MAX } - - .col-sm-12 - %hr - .row.js-preferences-form.js-search-settings-section - .col-lg-4.profile-settings-sidebar#localization - %h4.gl-mt-0 - = _('Localization') - %p - = _('Customize language and region related settings.') - = succeed '.' do - = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'localization'), target: '_blank', rel: 'noopener noreferrer' - .col-lg-8 - .js-listbox-input{ data: { label: _('Language'), description: s_('Preferences|This feature is experimental and translations are not yet complete.'), name: 'user[preferred_language]', items: language_choices.to_json, value: current_user.preferred_language } } - %p.gl-mt-n5 - = link_to help_page_url('development/i18n/translation'), class: 'text-nowrap', target: '_blank', rel: 'noopener noreferrer' do - = _("Help translate GitLab into your language") - %span{ aria: { label: _('Open new window') } } - = sprite_icon('external-link') - .form-group - = f.label :first_day_of_week, class: 'label-bold' do - = _('First day of the week') - = f.select :first_day_of_week, first_day_of_week_choices_with_default, {}, class: 'gl-form-select custom-select' - .col-sm-12 - %hr - .row.js-preferences-form.js-search-settings-section - .col-lg-4.profile-settings-sidebar#time-preferences - %h4.gl-mt-0 - = s_('Preferences|Time preferences') - %p - = s_('Preferences|Configure how dates and times display for you.') + .settings-section.js-preferences-form.js-search-settings-section#time-preferences + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = s_('Preferences|Time preferences') + %p.gl-text-secondary + = s_('Preferences|Configure how dates and times display for you.') + = succeed '.' do + = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'time-preferences'), target: '_blank', rel: 'noopener noreferrer' + .form-group + = f.gitlab_ui_checkbox_component :time_display_relative, + s_('Preferences|Use relative times'), + help_text: s_('Preferences|For example: 30 minutes ago.') + - if Feature.enabled?(:disable_follow_users, @user) + .settings-section.js-preferences-form.js-search-settings-section#enabled_following + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = s_('Preferences|Enable follow users feature') + %p.gl-text-secondary + = s_('Preferences|Turns on or off the ability to follow or be followed by other users.') = succeed '.' do - = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'time-preferences'), target: '_blank', rel: 'noopener noreferrer' - .col-lg-8 + = link_to _('Learn more'), help_page_path('user/profile/index', anchor: 'follow-users'), target: '_blank', rel: 'noopener noreferrer' .form-group - = f.gitlab_ui_checkbox_component :time_display_relative, - s_('Preferences|Use relative times'), - help_text: s_('Preferences|For example: 30 minutes ago.') - - if Feature.enabled?(:disable_follow_users, @user) - .row.js-preferences-form.js-search-settings-section - .col-sm-12 - %hr - .col-lg-4.profile-settings-sidebar#enabled_following - %h4.gl-mt-0 - = s_('Preferences|Enable follow users feature') - %p - = s_('Preferences|Turns on or off the ability to follow or be followed by other users.') - = succeed '.' do - = link_to _('Learn more'), help_page_path('user/profile/index', anchor: 'follow-users'), target: '_blank', rel: 'noopener noreferrer' - .col-lg-8 - .form-group - = f.gitlab_ui_checkbox_component :enabled_following, - s_('Preferences|Enable follow users') + = f.gitlab_ui_checkbox_component :enabled_following, + s_('Preferences|Enable follow users') = render_if_exists 'profiles/preferences/code_suggestions_settings', form: f = render_if_exists 'profiles/preferences/zoekt_settings', form: f diff --git a/app/views/profiles/show.html.haml b/app/views/profiles/show.html.haml index 1a932ed7b35..ebdea5786f5 100644 --- a/app/views/profiles/show.html.haml +++ b/app/views/profiles/show.html.haml @@ -7,50 +7,50 @@ - if Feature.enabled?(:edit_user_profile_vue, current_user) .js-user-profile - else - = gitlab_ui_form_for @user, url: profile_path, method: :put, html: { multipart: true, class: 'edit-user js-edit-user gl-mt-3 js-quick-submit gl-show-field-errors js-password-prompt-form', remote: true }, authenticity_token: true do |f| - .row.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = s_("Profiles|Public avatar") - %p - - if @user.avatar? - - if gravatar_enabled? - = s_("Profiles|You can change your avatar here or remove the current avatar to revert to %{gravatar_link}").html_safe % { gravatar_link: gravatar_link } - - else - = s_("Profiles|You can change your avatar here") - - else - - if gravatar_enabled? - = s_("Profiles|You can upload your avatar here or change it at %{gravatar_link}").html_safe % { gravatar_link: gravatar_link } - - else - = s_("Profiles|You can upload your avatar here") - - if current_appearance&.profile_image_guidelines? - .md - = brand_profile_image_guidelines - .col-lg-8 - .avatar-image - = link_to avatar_icon_for_user(@user, 400), target: '_blank', rel: 'noopener noreferrer' do - = render Pajamas::AvatarComponent.new(@user, size: 96, alt: "", class: 'gl-float-left gl-mr-5') - %h5.gl-mt-0= s_("Profiles|Upload new avatar") - .gl-display-flex.gl-align-items-center.gl-my-3 - = render Pajamas::ButtonComponent.new(button_options: { class: 'js-choose-user-avatar-button' }) do - = s_("Profiles|Choose file...") - %span.gl-ml-3.js-avatar-filename= s_("Profiles|No file chosen.") - = f.file_field :avatar, class: 'js-user-avatar-input hidden', accept: 'image/*' - .gl-text-gray-500= s_("Profiles|The maximum file size allowed is 200KB.") + = gitlab_ui_form_for @user, url: profile_path, method: :put, html: { multipart: true, class: 'edit-user js-edit-user js-quick-submit gl-show-field-errors js-password-prompt-form', remote: true }, authenticity_token: true do |f| + .settings-section.js-search-settings-section + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = s_("Profiles|Public avatar") + %p.gl-text-secondary - if @user.avatar? - = render Pajamas::ButtonComponent.new(variant: :danger, - category: :secondary, - href: profile_avatar_path, - button_options: { class: 'gl-mt-3', data: { confirm: s_("Profiles|Avatar will be removed. Are you sure?") } }, - method: :delete) do - = s_("Profiles|Remove avatar") - .col-lg-12 - %hr - .row.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0= s_("Profiles|Current status") - %p= s_("Profiles|This emoji and message will appear on your profile and throughout the interface.") - .col-lg-8 + - if gravatar_enabled? + = s_("Profiles|You can change your avatar here or remove the current avatar to revert to %{gravatar_link}").html_safe % { gravatar_link: gravatar_link } + - else + = s_("Profiles|You can change your avatar here") + - else + - if gravatar_enabled? + = s_("Profiles|You can upload your avatar here or change it at %{gravatar_link}").html_safe % { gravatar_link: gravatar_link } + - else + = s_("Profiles|You can upload your avatar here") + - if current_appearance&.profile_image_guidelines? + .md + = brand_profile_image_guidelines + .avatar-image + = link_to avatar_icon_for_user(@user, 400), target: '_blank', rel: 'noopener noreferrer' do + = render Pajamas::AvatarComponent.new(@user, size: 96, alt: "", class: 'gl-float-left gl-mr-5') + %h5.gl-mt-0= s_("Profiles|Upload new avatar") + .gl-display-flex.gl-align-items-center.gl-my-3 + = render Pajamas::ButtonComponent.new(button_options: { class: 'js-choose-user-avatar-button' }) do + = s_("Profiles|Choose file...") + %span.gl-ml-3.js-avatar-filename= s_("Profiles|No file chosen.") + = f.file_field :avatar, class: 'js-user-avatar-input hidden', accept: 'image/*' + .gl-text-gray-500= s_("Profiles|The maximum file size allowed is 200KB.") + - if @user.avatar? + = render Pajamas::ButtonComponent.new(variant: :danger, + category: :secondary, + href: profile_avatar_path, + button_options: { class: 'gl-mt-3', data: { confirm: s_("Profiles|Avatar will be removed. Are you sure?") } }, + method: :delete) do + = s_("Profiles|Remove avatar") + + .settings-section.js-search-settings-section.gl-border-t.gl-pt-6 + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0= s_("Profiles|Current status") + %p.gl-text-secondary= s_("Profiles|This emoji and message will appear on your profile and throughout the interface.") + .gl-max-w-80 #js-user-profile-set-status-form = f.fields_for :status, @user.status do |status_form| = status_form.hidden_field :emoji, data: { js_name: 'emoji' } @@ -59,121 +59,117 @@ = status_form.hidden_field :clear_status_after, value: user_clear_status_at(@user), data: { js_name: 'clearStatusAfter' } - .col-lg-12 - %hr - .row.user-time-preferences.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0= s_("Profiles|Time settings") - %p= s_("Profiles|Set your local time zone.") - .col-lg-8 - = f.label :user_timezone, _("Time zone") - .js-timezone-dropdown{ data: { timezone_data: timezone_data.to_json, initial_value: @user.timezone, name: 'user[timezone]' } } - .col-lg-12 - %hr - .row.js-search-settings-section - .col-lg-4.profile-settings-sidebar - %h4.gl-mt-0 - = s_("Profiles|Main settings") - %p - = s_("Profiles|This information will appear on your profile.") - - if current_user.ldap_user? - = s_("Profiles|Some options are unavailable for LDAP accounts") - .col-lg-8 - .row - .form-group.gl-form-group.col-md-9.rspec-full-name - = render 'profiles/name', form: f, user: @user - .form-group.gl-form-group.col-md-3 - = f.label :id, s_('Profiles|User ID') - = f.text_field :id, class: 'gl-form-input form-control', readonly: true - .form-group.gl-form-group - = f.label :pronouns, s_('Profiles|Pronouns') - = f.text_field :pronouns, class: 'gl-form-input form-control gl-md-form-input-lg' - %small.form-text.text-gl-muted - = s_("Profiles|Enter your pronouns to let people know how to refer to you.") - .form-group.gl-form-group - = f.label :pronunciation, s_('Profiles|Pronunciation') - = f.text_field :pronunciation, class: 'gl-form-input form-control gl-md-form-input-lg' - %small.form-text.text-gl-muted - = s_("Profiles|Enter how your name is pronounced to help people address you correctly.") - = render_if_exists 'profiles/extra_settings', form: f - = render_if_exists 'profiles/email_settings', form: f - .form-group.gl-form-group - = f.label :skype - = f.text_field :skype, class: 'gl-form-input form-control gl-md-form-input-lg', placeholder: s_("Profiles|username") - .form-group.gl-form-group - = f.label :linkedin - = f.text_field :linkedin, class: 'gl-form-input form-control gl-md-form-input-lg' - %small.form-text.text-gl-muted - = s_("Profiles|Your LinkedIn profile name from linkedin.com/in/profilename") - .form-group.gl-form-group - = f.label :twitter - = f.text_field :twitter, class: 'gl-form-input form-control gl-md-form-input-lg', placeholder: s_("Profiles|@username") - .form-group.gl-form-group - - external_accounts_help_url = help_page_path('user/profile/index', anchor: 'add-external-accounts-to-your-user-profile-page') - - external_accounts_link = link_to '', external_accounts_help_url, target: "_blank", rel: "noopener noreferrer" - - external_accounts_docs_link = safe_format(s_('Profiles|Your Discord user ID. %{external_accounts_link_start}Learn more.%{external_accounts_link_end}'), tag_pair(external_accounts_link, :external_accounts_link_start, :external_accounts_link_end)) - - min_discord_length = 17 - - max_discord_length = 20 - = f.label :discord - = f.text_field :discord, - class: 'gl-form-input form-control gl-md-form-input-lg js-validate-length', - placeholder: s_("Profiles|User ID"), - data: { min_length: min_discord_length, - min_length_message: s_('Profiles|Discord ID is too short (minimum is %{min_length} characters).') % { min_length: min_discord_length }, - max_length: max_discord_length, - max_length_message: s_('Profiles|Discord ID is too long (maximum is %{max_length} characters).') % { max_length: max_discord_length }, - allow_empty: true} - %small.form-text.text-gl-muted - = external_accounts_docs_link - .form-group.gl-form-group - = f.label :website_url, s_('Profiles|Website url') - = f.text_field :website_url, class: 'gl-form-input form-control gl-md-form-input-lg', placeholder: s_("Profiles|https://website.com") - .form-group.gl-form-group - = f.label :location, s_('Profiles|Location') - - if @user.read_only_attribute?(:location) - = f.text_field :location, class: 'gl-form-input form-control gl-md-form-input-lg', readonly: true - %small.form-text.text-gl-muted - = s_("Profiles|Your location was automatically set based on your %{provider_label} account") % { provider_label: attribute_provider_label(:location) } - - else - = f.text_field :location, class: 'gl-form-input form-control gl-md-form-input-lg', placeholder: s_("Profiles|City, country") - .form-group.gl-form-group - = f.label :job_title, s_('Profiles|Job title') - = f.text_field :job_title, class: 'gl-form-input form-control gl-md-form-input-lg' - .form-group.gl-form-group - = f.label :organization, s_('Profiles|Organization') - = f.text_field :organization, class: 'gl-form-input form-control gl-md-form-input-lg' - %small.form-text.text-gl-muted - = s_("Profiles|Who you represent or work for.") - .form-group.gl-form-group - = f.label :bio, s_('Profiles|Bio') - = f.text_area :bio, class: 'gl-form-input gl-form-textarea form-control', rows: 4, maxlength: 250 + .settings-section.user-time-preferences.js-search-settings-section.gl-border-t.gl-pt-6 + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0= s_("Profiles|Time settings") + %p.gl-text-secondary= s_("Profiles|Set your local time zone.") + = f.label :user_timezone, _("Time zone") + .js-timezone-dropdown{ data: { timezone_data: timezone_data.to_json, initial_value: @user.timezone, name: 'user[timezone]' } } + + .settings-section.js-search-settings-section.gl-border-t.gl-pt-6 + .settings-sticky-header + .settings-sticky-header-inner + %h4.gl-my-0 + = s_("Profiles|Main settings") + %p.gl-text-secondary + = s_("Profiles|This information will appear on your profile.") + - if current_user.ldap_user? + = s_("Profiles|Some options are unavailable for LDAP accounts") + .form-group.gl-form-group.rspec-full-name.gl-max-w-80 + = render 'profiles/name', form: f, user: @user + .form-group.gl-form-group.gl-md-form-input-lg + = f.label :id, s_('Profiles|User ID') + = f.text_field :id, class: 'gl-form-input form-control', readonly: true + .form-group.gl-form-group + = f.label :pronouns, s_('Profiles|Pronouns') + = f.text_field :pronouns, class: 'gl-form-input form-control gl-md-form-input-lg' + %small.form-text.text-gl-muted + = s_("Profiles|Enter your pronouns to let people know how to refer to you.") + .form-group.gl-form-group + = f.label :pronunciation, s_('Profiles|Pronunciation') + = f.text_field :pronunciation, class: 'gl-form-input form-control gl-md-form-input-lg' + %small.form-text.text-gl-muted + = s_("Profiles|Enter how your name is pronounced to help people address you correctly.") + = render_if_exists 'profiles/extra_settings', form: f + = render_if_exists 'profiles/email_settings', form: f + .form-group.gl-form-group + = f.label :skype + = f.text_field :skype, class: 'gl-form-input form-control gl-md-form-input-lg', placeholder: s_("Profiles|username") + .form-group.gl-form-group + = f.label :linkedin + = f.text_field :linkedin, class: 'gl-form-input form-control gl-md-form-input-lg' + %small.form-text.text-gl-muted + = s_("Profiles|Your LinkedIn profile name from linkedin.com/in/profilename") + .form-group.gl-form-group + = f.label :twitter + = f.text_field :twitter, class: 'gl-form-input form-control gl-md-form-input-lg', placeholder: s_("Profiles|@username") + .form-group.gl-form-group + - external_accounts_help_url = help_page_path('user/profile/index', anchor: 'add-external-accounts-to-your-user-profile-page') + - external_accounts_link = link_to '', external_accounts_help_url, target: "_blank", rel: "noopener noreferrer" + - external_accounts_docs_link = safe_format(s_('Profiles|Your Discord user ID. %{external_accounts_link_start}Learn more.%{external_accounts_link_end}'), tag_pair(external_accounts_link, :external_accounts_link_start, :external_accounts_link_end)) + - min_discord_length = 17 + - max_discord_length = 20 + = f.label :discord + = f.text_field :discord, + class: 'gl-form-input form-control gl-md-form-input-lg js-validate-length', + placeholder: s_("Profiles|User ID"), + data: { min_length: min_discord_length, + min_length_message: s_('Profiles|Discord ID is too short (minimum is %{min_length} characters).') % { min_length: min_discord_length }, + max_length: max_discord_length, + max_length_message: s_('Profiles|Discord ID is too long (maximum is %{max_length} characters).') % { max_length: max_discord_length }, + allow_empty: true} + %small.form-text.text-gl-muted + = external_accounts_docs_link + + .form-group.gl-form-group + = f.label :website_url, s_('Profiles|Website url') + = f.text_field :website_url, class: 'gl-form-input form-control gl-md-form-input-lg', placeholder: s_("Profiles|https://website.com") + .form-group.gl-form-group + = f.label :location, s_('Profiles|Location') + - if @user.read_only_attribute?(:location) + = f.text_field :location, class: 'gl-form-input form-control gl-md-form-input-lg', readonly: true %small.form-text.text-gl-muted - = s_("Profiles|Tell us about yourself in fewer than 250 characters.") - %hr + = s_("Profiles|Your location was automatically set based on your %{provider_label} account") % { provider_label: attribute_provider_label(:location) } + - else + = f.text_field :location, class: 'gl-form-input form-control gl-md-form-input-lg', placeholder: s_("Profiles|City, country") + .form-group.gl-form-group + = f.label :job_title, s_('Profiles|Job title') + = f.text_field :job_title, class: 'gl-form-input form-control gl-md-form-input-lg' + .form-group.gl-form-group + = f.label :organization, s_('Profiles|Organization') + = f.text_field :organization, class: 'gl-form-input form-control gl-md-form-input-lg' + %small.form-text.text-gl-muted + = s_("Profiles|Who you represent or work for.") + .form-group.gl-form-group.gl-mb-6.gl-max-w-80 + = f.label :bio, s_('Profiles|Bio') + = f.text_area :bio, class: 'gl-form-input gl-form-textarea form-control', rows: 4, maxlength: 250 + %small.form-text.text-gl-muted + = s_("Profiles|Tell us about yourself in fewer than 250 characters.") + .gl-border-t.gl-pt-6 %fieldset.form-group.gl-form-group - %legend.col-form-label.col-form-label + %legend.col-form-label = _('Private profile') - private_profile_label = s_("Profiles|Don't display activity-related personal information on your profile.") - private_profile_help_link = link_to sprite_icon('question-o'), help_page_path('user/profile/index.md', anchor: 'make-your-user-profile-page-private') = f.gitlab_ui_checkbox_component :private_profile, '%{private_profile_label} %{private_profile_help_link}'.html_safe % { private_profile_label: private_profile_label, private_profile_help_link: private_profile_help_link.html_safe } %fieldset.form-group.gl-form-group - %legend.col-form-label.col-form-label + %legend.col-form-label = s_("Profiles|Private contributions") = f.gitlab_ui_checkbox_component :include_private_contributions, s_('Profiles|Include private contributions on your profile'), help_text: s_("Profiles|Choose to show contributions of private projects on your public profile without any project, repository or organization information.") - %fieldset.form-group.gl-form-group - %legend.col-form-label.col-form-label + %fieldset.form-group.gl-form-group.gl-mb-0 + %legend.col-form-label = s_("Profiles|Achievements") = f.gitlab_ui_checkbox_component :achievements_enabled, s_('Profiles|Display achievements on your profile') - .row.js-hide-when-nothing-matches-search - .col-lg-12 - %hr - = f.submit s_("Profiles|Update profile settings"), class: 'gl-mr-3 js-password-prompt-btn', pajamas_button: true - = render Pajamas::ButtonComponent.new(href: user_path(current_user)) do - = s_('TagsPage|Cancel') + + .js-hide-when-nothing-matches-search.settings-sticky-footer + = f.submit s_("Profiles|Update profile settings"), class: 'gl-mr-3 js-password-prompt-btn', pajamas_button: true + = render Pajamas::ButtonComponent.new(href: user_path(current_user)) do + = s_('TagsPage|Cancel') #password-prompt-modal diff --git a/app/views/profiles/two_factor_auths/show.html.haml b/app/views/profiles/two_factor_auths/show.html.haml index 461164e1ae9..42297a0cf3d 100644 --- a/app/views/profiles/two_factor_auths/show.html.haml +++ b/app/views/profiles/two_factor_auths/show.html.haml @@ -55,7 +55,8 @@ = label_tag :pin_code, _('Enter verification code'), class: "label-bold" = text_field_tag :pin_code, nil, autocomplete: 'off', inputmode: 'numeric', class: "form-control gl-form-input", required: true, data: { qa_selector: 'pin_code_field' } .gl-mt-3 - = submit_tag _('Register with two-factor app'), class: 'gl-button btn btn-confirm', data: { qa_selector: 'register_2fa_app_button' } + = render Pajamas::ButtonComponent.new(type: :submit, variant: :confirm, button_options: { data: { qa_selector: 'register_2fa_app_button' } }) do + = _('Register with two-factor app') %hr @@ -101,7 +102,7 @@ - else %span.gl-text-gray-500 = _("no name set") - %td= registration[:created_at].to_date.to_s(:medium) + %td= registration[:created_at].to_date.to_fs(:medium) %td = render Pajamas::ButtonComponent.new(variant: :danger, href: registration[:delete_path], |