1- page_title _('Preferences') 2- @content_class = "limit-container-width" unless fluid_layout 3- user_theme_id = Gitlab::Themes.for_user(@user).id 4- user_fields = { theme: user_theme_id, gitpod_enabled: @user.gitpod_enabled, sourcegraph_enabled: @user.sourcegraph_enabled }.to_json 5- @themes = Gitlab::Themes::THEMES.to_json 6- data_attributes = { themes: @themes, integration_views: integration_views.to_json, user_fields: user_fields, body_classes: Gitlab::Themes.body_classes, profile_preferences_path: profile_preferences_path } 7 8- Gitlab::Themes.each do |theme| 9 = stylesheet_link_tag "themes/#{theme.css_filename}" if theme.css_filename 10 11= form_for @user, url: profile_preferences_path, remote: true, method: :put, html: { id: "profile-preferences-form" } do |f| 12 .row.gl-mt-3.js-preferences-form.js-search-settings-section 13 .col-lg-4.application-theme#navigation-theme 14 %h4.gl-mt-0 15 = s_('Preferences|Navigation theme') 16 %p 17 = s_('Preferences|Customize the appearance of the application header and navigation sidebar.') 18 .col-lg-8.application-theme 19 .row 20 - Gitlab::Themes.each do |theme| 21 %label.col-6.col-sm-4.col-md-3.gl-mb-5.gl-text-center 22 .preview{ class: theme.css_class } 23 = f.radio_button :theme_id, theme.id, checked: user_theme_id == theme.id 24 = theme.name 25 26 .col-sm-12 27 %hr 28 29 .row.js-preferences-form.js-search-settings-section 30 .col-lg-4.profile-settings-sidebar#syntax-highlighting-theme 31 %h4.gl-mt-0 32 = s_('Preferences|Syntax highlighting theme') 33 %p 34 = s_('Preferences|This setting allows you to customize the appearance of the syntax.') 35 = succeed '.' do 36 = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'syntax-highlighting-theme'), target: '_blank' 37 .col-lg-8.syntax-theme 38 - Gitlab::ColorSchemes.each do |scheme| 39 = label_tag do 40 .preview= image_tag "#{scheme.css_class}-scheme-preview.png" 41 = f.radio_button :color_scheme_id, scheme.id 42 = scheme.name 43 44 .col-sm-12 45 %hr 46 47 .row.js-preferences-form.js-search-settings-section 48 .col-lg-4.profile-settings-sidebar#behavior 49 %h4.gl-mt-0 50 = s_('Preferences|Behavior') 51 %p 52 = s_('Preferences|This setting allows you to customize the behavior of the system layout and default views.') 53 = succeed '.' do 54 = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'behavior'), target: '_blank' 55 .col-lg-8 56 .form-group 57 = f.label :layout, class: 'label-bold' do 58 = s_('Preferences|Layout width') 59 = f.select :layout, layout_choices, {}, class: 'select2' 60 .form-text.text-muted 61 = s_('Preferences|Choose between fixed (max. 1280px) and fluid (%{percentage}) application layout.').html_safe % { percentage: '100%' } 62 .form-group 63 = f.label :dashboard, class: 'label-bold' do 64 = s_('Preferences|Homepage content') 65 = f.select :dashboard, dashboard_choices, {}, class: 'select2' 66 .form-text.text-muted 67 = s_('Preferences|Choose what content you want to see on your homepage.') 68 69 = render_if_exists 'profiles/preferences/group_overview_selector', f: f # EE-specific 70 71 .form-group 72 = f.label :project_view, class: 'label-bold' do 73 = s_('Preferences|Project overview content') 74 = f.select :project_view, project_view_choices, {}, class: 'select2' 75 .form-text.text-muted 76 = s_('Preferences|Choose what content you want to see on a project’s overview page.') 77 .form-group.form-check 78 = f.check_box :render_whitespace_in_code, class: 'form-check-input' 79 = f.label :render_whitespace_in_code, class: 'form-check-label' do 80 = s_('Preferences|Render whitespace characters in the Web IDE') 81 .form-group.form-check 82 = f.check_box :show_whitespace_in_diffs, class: 'form-check-input' 83 = f.label :show_whitespace_in_diffs, class: 'form-check-label' do 84 = s_('Preferences|Show whitespace changes in diffs') 85 .form-group.form-check 86 = f.check_box :view_diffs_file_by_file, class: 'form-check-input' 87 = f.label :view_diffs_file_by_file, class: 'form-check-label' do 88 = s_("Preferences|Show one file at a time on merge request's Changes tab") 89 .form-text.text-muted 90 = s_("Preferences|Instead of all the files changed, show only one file at a time. To switch between files, use the file browser.") 91 .form-group.form-check 92 = f.check_box :markdown_surround_selection, class: 'form-check-input' 93 = f.label :markdown_surround_selection, class: 'form-check-label' do 94 = s_('Preferences|Surround text selection when typing quotes or brackets') 95 .form-text.text-muted 96 - supported_characters = %w(" ' ` \( [ { < * _).map {|char| "<code>#{char}</code>" }.join(', ') 97 - msg = "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}." 98 = s_(msg).html_safe 99 100 .form-group 101 = f.label :tab_width, s_('Preferences|Tab width'), class: 'label-bold' 102 = f.number_field :tab_width, 103 class: 'form-control gl-form-input', 104 min: Gitlab::TabWidth::MIN, 105 max: Gitlab::TabWidth::MAX, 106 required: true 107 .form-text.text-muted 108 = s_('Preferences|Must be a number between %{min} and %{max}') % { min: Gitlab::TabWidth::MIN, max: Gitlab::TabWidth::MAX } 109 110 .col-sm-12 111 %hr 112 .row.js-preferences-form.js-search-settings-section 113 .col-lg-4.profile-settings-sidebar#localization 114 %h4.gl-mt-0 115 = _('Localization') 116 %p 117 = _('Customize language and region related settings.') 118 = succeed '.' do 119 = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'localization'), target: '_blank' 120 .col-lg-8 121 .form-group 122 = f.label :preferred_language, class: 'label-bold' do 123 = _('Language') 124 = f.select :preferred_language, language_choices, {}, class: 'select2' 125 .form-text.text-muted 126 = s_('Preferences|This feature is experimental and translations are not complete yet') 127 .form-group 128 = f.label :first_day_of_week, class: 'label-bold' do 129 = _('First day of the week') 130 = f.select :first_day_of_week, first_day_of_week_choices_with_default, {}, class: 'select2' 131 .col-sm-12 132 %hr 133 .row.js-preferences-form.js-search-settings-section 134 .col-lg-4.profile-settings-sidebar#time-preferences 135 %h4.gl-mt-0 136 = s_('Preferences|Time preferences') 137 %p 138 = s_('Preferences|Configure how dates and times display for you.') 139 = succeed '.' do 140 = link_to _('Learn more'), help_page_path('user/profile/preferences', anchor: 'time-preferences'), target: '_blank' 141 .col-lg-8 142 .form-group.form-check 143 = f.check_box :time_display_relative, class: 'form-check-input' 144 = f.label :time_display_relative, class: 'form-check-label' do 145 = s_('Preferences|Use relative times') 146 .form-text.text-muted 147 = s_('Preferences|For example: 30 minutes ago.') 148 - if Feature.enabled?(:user_time_settings) 149 .form-group.form-check 150 = f.check_box :time_format_in_24h, class: 'form-check-input' 151 = f.label :time_format_in_24h, class: 'form-check-label' do 152 = s_('Preferences|Display time in 24-hour format') 153 154 #js-profile-preferences-app{ data: data_attributes } 155